http://army.512j.com/creations/code/jssc3/index.html


不到两个月的时间,jssc3的beta版再次与大家见面了。5.1这几天比较空也比较有条件,正好可以继续开发我的jssc。大概由于习惯吧,也是为了区分SyntaxHighlighter,偶一直都习惯叫它“着色”,而不是“高亮”。即使这种叫法不是很考证、很专业,但大家都明白就成了~
上次发布的jssc2获得了不少人的反馈,其中有的意见是十分有价值的,它也成为了我继续改进程序的参考。感谢所有人的关心和支持,没有你们的帮助,jssc是不可能那么顺利地发展下去的。


根据我收到的多方的信息来看,jssc3准备对以下几点进行改进:


1.string的跨行和结尾转义问题(感谢apoclast的建议):
string末尾的转义存在问题,其实在写之时我就知道有这么一个bug,只是当时想这种极端情况应该不会有人去写吧?事实也的确如此。不过这个bug不改我也一直觉得缺点什么,尤其被人提出之后。
过去也确实没有好的想法,如今我打算引入“着色模式”来进行语法分析着色:一种模式是“正则匹配”,另一种是“线性搜索”。不同的语法选择不同的模式进行解析,如此一来功能和速度都得以解决,bug也相应消除,相信它是一个很好的方案。


2.多行方式问题:
jssc3将继续沿用前两版的多行处理方式,这是自己发明的算法,和SyntaxHighlighter是不同的。由于跨行和转义的改进,多行也相应地进行了调整。实验证明它的速度在领先SyntaxHighlighter的前提下,又有了略微的提升。


3.自动装载:
有人抱怨jssc2提供的Individual(每种语言独立版本)和All-in-one(全部混在一起的版本)还是不够完善,应该有自动装载。于是,在jssc3中将使用延迟异步装载来解决这一问题,并提供一个新的版本:auto-load。


4.代码折叠(感谢jindw给与的方法提示):
如今的语法高亮器有代码折叠功能的我曾经见过,但不多(本来高亮器就不多了),应用的范围很小,功能等等都不足,我没详细研究过。SyntaxHighlighter里也没有,因此我决定尽量为每种语言加入折叠功能,它们大体上分为3种:c风格的花括号折叠、ruby风格的关键字折叠、python风格的缩进折叠。
这里面c风格的折叠功能提供的较早,而其它的语法我不太熟悉,希望他人能够多帮忙。


5.轻量级的语言解析正则的问题(感谢hax在博客中的分析):
perl风格的正则和除法在轻量级解析上不能十全十美,目前jssc的做法是尽可能地匹配一个正则表达式,并将它着色成默认颜色(即不着色),而除法的/符号也是不着色的,如此在表面上看来显示的还是正确的。因为js语法高亮的功能并不要求底层的代码解析也要完全正确,只需显示正常,因此这一点点瑕疵并不会产生影响。况且能写出极端复杂的正则的情况也是微乎其微的,可以采取一些折中。


6.html、css、xml的解析(感谢hax在博客中的分析):
jssc在解析这三种语言上还是弱项,它们本身就比较复杂,再加上有些场景会出现多种语言嵌套的问题(如html嵌套css和脚本,有的内嵌xml)等,这种情况非常复杂,轻量级的解析方法几乎无法应对。


7.别名和标题以及未知语言
新版将仿照sh的方式提供语法别名,标题也可以自定义。另外对于未知语言不报错,只是没有高亮显示,只能够最基础的分行显示。


8.其它
代码长度、复用、可维护性、结构、速度等等能改善的已经不多了,当然还会继续挖掘隐藏着的那一点点潜力。


---
以下将详细叙述主要改进的两点:“着色模式”和“折叠功能”。


1.“着色模式”
“着色模式”分“正则匹配”和“线性搜索”两种,它们分别适应不同的情况。
比如我要判断解析的代码片段是否为数字,就应该用/\d+/这样的正则来匹配,成功则相应地着色为数字。而若要解析的代码片段是个string,则无法写出完美的方案。
考虑如下一行代码:"string\"。很显然这个字符串没有闭合,当前的语境应该是:这行全为字符串,并以下面某行中第一个未被转义的"符号结束。要想改变这一情况,正则的写法必须要求"符号前不能有\转义符。
而如果出现这种情况:"string\\"。这个字符串的末尾有转义符,但转义符本身被前面的转义符给转义了,如此这个string是闭合的。而正则想要写出这种情况比较复杂。
如此递归下去:"string\\","string\\\","string\\\\"……虽然几乎没有人会写出这样的代码,但毕竟它是理论上可能的,正则在这种情况下就显得束手无策了。
为此,jssc3中采用的是jssc1里面最简单最直接也是最根本的方法:“线性搜索”。当语法分析遇到字符串开始的"符号后,将直接去查找后面的"符号,找到后统计它前面的转义字符数。如果是偶数说明没有被转移,这个string到此闭合;否则继续查找,本行内没有就继续查找后面的行,直到找到为止。
这也是设置多行方式的重要原因之一。


2.“折叠功能”
这是受jindw在它的jsi中应用相同功能的思维启发,采用深度计数器来实现。
以c系列风格语言为例:先设定aFoldList数组用以保存需要折叠的节点,aFoldDepth数组用以保存相应节点的深度。每解析一行代码时,如遇到{符号则iDepth++,并且本行节点入栈aFoldList,新的深度0入栈aFoldDepth;如遇到}符号则iDepth--,aFoldList出栈,aFoldDepth出栈。一行分析完成后aFoldDepth中所有的深度计数器自增。
在aFoldList出栈的时候,如果相应的aFoldDepth出栈的深度计数器>1,则说明aFoldList出栈的那个节点可以折叠,折叠的数目就是出栈的深度计数器-1。如此一来即使嵌套的{}折叠也得以解决。


---
自动装载的版本和普通的相差不大,只多了个通过xhr加载语法脚本的过程。你可以通过http://army.512j.com/creations/code/jssc3/autoload.html 查看这个版本,可以看出它在功能上是没有任何区别的。


另外,由于多了折叠过程,因此jssc3在代码量和性能上要比jssc2多耗一点。如果你觉得折叠没什么用处,而且还不稳定的话,可以选择继续使用jssc2。它的核心部分已经改进,和没有折叠的jssc3是完全一样的。


jssc2:http://army.512j.com/creations/code/jssc2/index.html


好了,就到这里了,相信jssc3的正式版本很快就能和大家见面了。最后还要感谢那些给我来信、回帖的人,你们的支持和意见是无比珍贵的,它是对jssc最大的帮助!

 

评论
weiweichen1985 2008-05-16
不错不错。。。好东西
trydofor 2008-05-12
相当不错,加油.
python的折叠,是按缩进计算的.需要计算缩进量和转义换行.

关于颜色,可以参考eclipse,kate,emeditor,emacs等着色包.
关于异步载入,不知道a9text中的a9loader.js能否对你有所帮助.
因此也借宝地,给a9text做个广告:http://a9text.sf.net
Army 2008-05-07
Moore 写道
不知道可以编辑否

那应该称之为JSSE了。

好了,放出下载rc版,等候多方反馈bug了……
Moore 2008-05-07
不知道可以编辑否
Army 2008-05-07
v2更新完毕,有了自动装载了。

css大幅更新了下。

v3的折叠还差python,谁能讲解下python的折叠方式的?另外,ruby系列语法有人熟悉吗?折叠方式正确与否?
Army 2008-05-06
自动装载也可以支持匿名了,ff下正常。
Army 2008-05-06
3个图片合一起opera不兼容,暂时改回分开的方案了。
异步装载改成延迟异步了,绕过ie下栈溢出错误。
Army 2008-05-05
把那3个图片都放在一个图片里了…… 貌似找到原因 了……递归调用xhr自动装载脚本,ie下递归超过12次左右会栈溢出产生错误……
Army 2008-05-05
jindw 写道
oXmr.open("get", sUrl, false);

这句要修改。
同步请求必然导致假死。
而且你这个地方,修改成异步方式也很容易。

异步按需装载改得不是很好,其它浏览器还行,ie下第一次浏览还行,刷新一下就看不到了。

http://army.512j.com/creations/code/jssc3/autoload.js
Army 2008-05-05
jindw 写道
oXmr.open("get", sUrl, false);

这句要修改。
同步请求必然导致假死。
而且你这个地方,修改成异步方式也很容易。


改成异步吗?

hax 写道
建议+和-放在一个图片里。

那样要如何改变显示?

hax 写道
它可以有若干个text node。所以可以考虑用textContent属性。

OK

ps:别名更改完了,未知语法可以了,取消使用eval,参考sh的方式。集合了下c里重复率较高的关键字。

dlovek 写道
能讲解一下制作过程和心得就更好了。

这个……这可是长篇大论了……能自己看懂源码最好了……

而且,不知道,制作思路这种文章适不适合发。
dlovek 2008-05-05
能讲解一下制作过程和心得就更好了。
hax 2008-05-05
Army 写道
是+号,那个图片没存好,有30多k,重存了下变成190b了。可能网速原因当时有问题造成显示慢了些……


建议+和-放在一个图片里。

引用
终于发现为何ff处理大量代码的问题了:

若用textarea节点的话,用oTextarea.firstChild.nodeValue提取的代码只有4096字节,ff可能只支持这么大的容量,其它浏览器没问题。

若用oTextarea.value来提取内容则没有这个限制。可是若是pre标签又不支持oPre.value属性,它将是null。


它可以有若干个text node。所以可以考虑用textContent属性。
jindw 2008-05-05
oXmr.open("get", sUrl, false);

这句要修改。
同步请求必然导致假死。
而且你这个地方,修改成异步方式也很容易。
Army 2008-05-05
to dwwind:
好的。

to icank:
是+号,那个图片没存好,有30多k,重存了下变成190b了。可能网速原因当时有问题造成显示慢了些……

1. 支持未知语言格式的基本显示:
的确,当初有个模糊的理念没有细想,这个是必须的。

2.语言的别名问题:
加载某个语法的时候是用的eval(语言名称),我想应该可以用指向相同引用来解决:
jssc.csharp = {定义...}
jssc.c# = jssc.csharp

3.到可以考虑最基本的像if else提取出来作为共同的基础。

---

终于发现为何ff处理大量代码的问题了:

若用textarea节点的话,用oTextarea.firstChild.nodeValue提取的代码只有4096字节,ff可能只支持这么大的容量,其它浏览器没问题。

若用oTextarea.value来提取内容则没有这个限制。可是若是pre标签又不支持oPre.value属性,它将是null。

所以只能写成这样了oTarget.value || oTarget.firstChild.nodeValue。

另外我改了下名字,每种语言的标题名称可以自己定义,更新了,可以看到cpp变成C++,csharp变成c#了。
hax 2008-05-05
Quake Wang 写道
再提2个新的特性要求:
1. 支持未知语言格式的基本显示:比如在论坛中有人可能会发表一些未在列表中语言格式,<textarea name="code" class="lua"> ,我希望JSSC不报错,能够保持缩进的样式就可以了。
2. 支持语言的别名,这个是SH中有的,可以用class名为js/javascript,c#/csharp

另外是一个改进的建议:
一些代码高亮是可以重用的,比如csharp的keyWords可以扩展c的keyWords, 而reglib, collapse都是和C/Java完全一样的,能否设置成
jssc.csharp = {
  extends: "c",
  keyWords: "csharp多出来的keywords"
}

这样可以减少all-in-one.js的大小


第一点大体就是保持原样,但是可以支持行号之类的功能。



关于扩展关键字那个我不太赞同,毕竟这些语言之间并不是直接继承的关系。但可以考虑把相同的提取出来作为一个常量字符串。
Quake Wang 2008-05-05
再提2个新的特性要求:
1. 支持未知语言格式的基本显示:比如在论坛中有人可能会发表一些未在列表中语言格式,<textarea name="code" class="lua"> ,我希望JSSC不报错,能够保持缩进的样式就可以了。
2. 支持语言的别名,这个是SH中有的,可以用class名为js/javascript,c#/csharp

另外是一个改进的建议:
一些代码高亮是可以重用的,比如csharp的keyWords可以扩展c的keyWords, 而reglib, collapse都是和C/Java完全一样的,能否设置成
jssc.csharp = {
  extends: "c",
  keyWords: "csharp多出来的keywords"
}

这样可以减少all-in-one.js的大小
icank 2008-05-05
代码折叠之后仍然是“-”号而不是我想的“+”号。
dwwind 2008-05-04
很不错。
要是能关闭折叠功能就更好了。
建议:xml 语句中 < > 没有一起着色。
rainlife 2008-05-04
嗯,不错。
BTW:不会再有上次的问题了吧?呵呵
Army 2008-05-04
[quote="Quake Wang"]你写的这个工具很棒,代码比SyntaxHighlighter要简洁,我想用它替换掉目前JavaEye使用的HS。 有3个问题想确认一下: 1. 从ver3的源代码看加上了pre的支持? 2. 折叠代码的功能能否通过设置关闭? 3. 这个工具用的开源协议是什么? [/quote] 1.第2版时就可以支持pre了 2.目前到没有通过设置关闭折叠,不过第2版里没有折叠功能,除此之外和第3版是完全一样的,主贴最后我进行了说明 3.呵呵,想起了寒假那段时间了,问gpl和lgpl有什么不同的时光…… lgpl,请随便用吧~:)
发表评论

提醒: 该博客已发表在公共论坛,博客所有留言会成为论坛回贴,留言请注意遵守论坛发贴规则

您还没有登录,请登录后发表评论

Army
搜索本博客
博客分类
最近加入圈子
存档
最新评论