论坛首页 Web前端技术论坛

JAse预览版

浏览 2378 次
锁定老帖子 主题:JAse预览版
精华帖 (0) :: 良好帖 (0) :: 新手帖 (0) :: 隐藏帖 (0)
作者 正文
   发表时间:2009-12-17   最后修改:2009-12-18

很高兴能为大家带来JAse的预览版,一款基于as+js的网页语法编辑器。在经历了jssc的静态DFA语法解析高亮的研究和JAte文本编辑器的失败之后,JAse终于能够吸取两者的经验和不足,慢慢地开发至今。开头不多说了,来看预览地址(暂且只有js解析器,其它的都是不存在的;基于Flash Player 10):

 

两个都可以:http://jase.googlecode.com/svn/trunk/jase1/bin/index.htmlhttp://army8735.org/wp-content/uploads/jase/


它的下载地址:http://code.google.com/p/jase/downloads/list

 

它的svn:http://jase.googlecode.com/svn/trunk/jase1/

目前只能支撑千行级代码编辑,总体性能并不是卡在解析器上,而是卡在flash本身的input上。有过经验的人可能感受颇深,何时adobe能提供高性能的textfield?

JAse基本内容分为两块:编辑器提供基础编辑功能、解析器以插件形式提供高亮功能。两者之间通过一个接口连接,也就是说所有的外部解析器必须实现IParser接口,编辑器每次的更改也都是调用接口方法。如此实现了扩展语法的功能,只要实现了接口,你可以开发任意的高亮程序。当然,我自己也写了个AbstractParser基类,可以方便地在其基础之上拓展。

编辑器的undo、redo等功能还未和解析器链接上,因此使用这些button的话可能会造成高亮错误,这并不是程序本身原因。预览版放出只是展示基本输入修改已经ok了。其它将会在后续版本中逐渐开发。

JAse的整体流程是:寻找目标textarea(如果指定id直接获取,否则以document上第一个textarea为目标)=>隐藏textarea,将自己替换掉它的位置=>加载外部解析器(如果指定syntax直接加载,否则出现界面选择)=>编辑内容=>提交内容(如果指定url则使用urlloader,否则将内容放回textarea并寻找父级form提交)。

其间动态破损、修复、显示模型经历过3次算法变更得以成型,斜线动态区分perl正则和除法的算法也经历过2次变更,让我用图来简单说下吧。

 



在这种情况下,每行代码首先会被解析开始状态(如注释、字符串或者普通),同时渲染标明此行是否被高亮过。这两个状态List是和每行代码一一对应的,增加随之增加,修改随之修改,删除随之删除。而区块List则完全脱离于代码行索引,自成一家。 

这样做的好处是分析和显示互相分开,每次编辑器内容被修改时先有破损和修复模型来完成行状态、渲染状态和区块的操作;然后由显示模型取得可视区域再从区块List中取出索引对每块进行高亮。

但坏处也很明显,每次操作对 区块List的改动太大了,前面增加一个字符,会导致所有后面的索引进行修改(自增1),因此很快就被废除,有了第2种想法。

 



废除区块索引。每次编辑器内容修改,都去计算行状态并且设置涉及行的渲染状态为否以便重新渲染。这个算法对分析阶段来说有了极大的便利,但是在显示阶段却叫苦不迭——在渲染每一行代码的时候,都要根据行状态重新对此行代码进行一遍DFA解析,而这个工作在前面的分析阶段已经做过了(大部分)。同样的功能需要两份代码显得冗余,要合并到一起的话又会变得难以维护,而且多分析一次也显得没有必要。

在经历了一段时间的纠结后,最终还是变更到现在这个样子。



区块List成为二维的,亦和每行对应。然后List中的List保存索引。不过和第1种方式略有不同,之前保存的是绝对索引(字符串的下标),而这里保存的是相对索引(相对于行代码第一个字符而言)。这样每次渲染的时候,只要知道行代码的第一个字符索引,然后遍历这行对应的区块List,相加得出绝对索引即可完成显示。而且每次修改后,后面行的相对索引都无需变更,综合了以上两种方法的优点。

至于斜线的动态区分,最终情况和这类似。静态DFA解析的情况下很容易确定一个斜线的含义究竟是除法还是正则——因为源代码扫猫是从头至尾的。动态情况下因为不确定性,不可能每次修改都从头遍历代码,代价太大了,最好能够从当前行或者前面几行判断出。最初我采用向前回溯的方式,这显得很愚蠢,而且前面行还可能存在单行注释、多行注释等情况干扰(词法分析无需考虑,因为注释空白一开始就被剔除了),基本上行不通。

后来我为每行增加一个布尔值来标明行起始状态如果出现斜线的话它的含义是什么,每次内容修改也会根据解析情况重置它,就和重置行状态和是否被渲染一样。

另外曾经让我非常头疼的一个地方是事件侦听部分。我希望的是每次编辑器内容修改时,所触发的侦听在修改后立刻执行,而as中所有的事件侦听都是在之前执行。这导致使用解析器进行分析显示的时候,实际上代码还根本未发生改变,显然这是个悖论。唯一的做法就是将侦听中模拟事件率先执行,然后通过preventDefault()来取消默认事件发生。这里有个问题,那就是像删除这样的事件(无论del还是backspace或者选区替换)是无法被取消的。所幸的是最终这些难题被一一解决——包括TAB键不能使用,感兴趣的可以查看编辑器源文件来了解是怎么做到的。只关心外部解析器的话不用考虑。

试用过程中有任何问题、反馈或者建议请不吝提出。在beta版完成之后,也会出系列文章来详细介绍JAse的所有技术,就像jssc一样。

   发表时间:2009-12-17  
我来了,呵呵,简单使用了一下,选区后后退时问题已经没有了。
0 请登录后投票
论坛首页 Web前端技术版

跳转论坛:
Global site tag (gtag.js) - Google Analytics