六月 18th, 2010

继续开发JAse

No Comments, JAse, as、flex, by army.

http://code.google.com/p/jase/

一段日子没怎么动了,惭愧惭愧。废了一天功夫,终于把redo和undo两个操作,与高亮逻辑关联了起来。具体做法就是将语法解析部分合并到命令链当中,与编辑器脱离了。这样每次编辑器内容发生改变的时候,直接执行命令链来保存改变,无需关心高亮逻辑,这些逻辑全部放在命令链中一同处理了。

当中遇到不少问题,还有以前的一些经验,比如:

  1. 侦听textfield的textInput事件时,倘若是手动修改textfield的text,是不会触发的,这点需要相当注意。
  2. ie输入回车时是\r\n,而其它为\n,但是到了textfield里面又会自动将\n替换成\r,这个地方非常迷惑人!在做命令链时保存的内容尤为恼人,必须对所有的内容检测一遍,删掉\r\n,将\r替换成\n。
  3. resize事件放到flash内部了,以前是通过js侦听window的resize,这样需要经过ExternalInterface的中转,效率太低,还需要外部嵌个div之类的。现在直接侦听stage的resize,好很多。
  4. 找人重做了图标,怕openoffice说我侵权。
  5. 正在加新语种。

这里可以试用svn的每次更新版本:

http://jase.googlecode.com/svn/trunk/jase1/bin/index.html

subhtml,顾名思义,即截取字符串时忽略html代码,介于后台输出的某些字符串可能包含html代码,因此就不能用简单的substr来处理。不过由于后台输出的代码都是标准的,因此也少了许多校验的必要。但是,譬如自闭合标签、嵌套标签等等,需要考虑的还是很多。

目前两个版本拼杀中,结果稍后公布……

function subhtml_yy(html, n){
	var str = html.split(/<.+?>/g), dstr;
	var m = 0;
	for (var i = 0, l = str.length; i < l; i++) {
		dstr = str[i].replace(/([^\x00-\xff])/g, '$1 ');
		m += dstr.length;
		if (m > n) {
			str[i] = dstr.substr(0, m - n).replace(/([^\x00-\xff])\s/g, '$1');
			break;
		}
	}
	str.length = i + 1;
	var regexpstr = str.join('(<.+?>)')
	var parts = html.match(new RegExp(regexpstr));
	var unclose = [];
	for (var i = 1, l = parts.length; i < l; i++) {
		if (parts[i].match(/\/>$/))
			continue;
		else if (parts[i].match(/^<\//))
			unclose.pop();
		else
			unclose.push(parts[i]);
	}
	return (parts[0] + unclose.reverse().map(function(tag){
		return '</' + tag.match(/\w+/)[0] + '>';
	}).join(''));
}

function subhtml_army(str, limit) {
	var state = false, tag = [], c = '', i = j = index = index2 = 0;
	str = str.replace(/([^\x00-\xff])/g, '$1 ');
	for(var len = str.length; i < len && j < limit; i++) {
		c = str.charAt(i);
		if(c == '<') {
			if(str.charAt(i + 1) == '/') {
				i += tag.pop().length + 1;
			}
			else {
				index = str.indexOf('>', i + 2);
				if(str.charAt(index - 1) != '/') {
					index2 = str.indexOf(' ', i + 2);
					if(index2 < index && index2 != -1) {
						tag.push(str.slice(i + 1, index2));
					}
					else {
						tag.push(str.slice(i + 1, index));
					}
				}
				i = index;
			}
		}
		else {
			j++;
		}
   }
   str = str.substr(0, i).replace(/([^\x00-\xff])\s/g, '$1');
   if(tag.length) {
		str += '</' + tag.reverse().join('></') + '>';
   }
   return str;
}

测试对象

<p><em style=”color:#f00″>关键词</em>的<br/>的<strong>关键词</strong>的<em>关键词</em></p><p>的<em>关键词</em>关键词关键词</p>

算法1(正则)

结果(14): <p><em style=”color:#f00″>关键词</em>的<br/>的<strong>关键</strong></p>

耗时(1000次): 19

算法2(逐字遍历)

结果(14): <p><em style=”color:#f00″>关键词</em>的<br/>的<strong>关键</strong></p>

耗时(1000次): 13


测试对象2

<em style=”color:#f00″>关键词</em>的<em style=”color:#f00″>关键词</em>的<em style=”color:#f00″>关键词</em>的<em style=”color:#f00″>关键词</em>的<em style=”color:#f00″>关键词</em>的<em style=”color:#f00″>关键词</em>

算法1(正则)

结果(14): <em style=”color:#f00″>关键词</em>的<em style=”color:#f00″>关键词</em>

耗时(1000次): 17

算法2(逐字遍历)

结果(14): <em style=”color:#f00″>关键词</em>的<em style=”color:#f00″>关键词</em>

耗时(1000次): 9


测试对象3

关键词关键词<em>关键词</em>关键词关键词关键词关键词关键词关键词关键词关键词关键词关键词

算法1(正则)

结果(14): 关键词关键词<em>关</em>

耗时(1000次): 13

算法2(逐字遍历)

结果(14): 关键词关键词<em>关</em>

耗时(1000次): 11

今早测试人员发现,新更新的maxthon2.5.13浏览土豆时全乱了,图片不加载js不执行,着实让人吓了一跳。苦心检查半天,才发现是遨游本身的问题……这种情况下看所有网站都会出错,奇怪的居然还是2.5.13正式版,看来遨游的测试这下错大了。

前阵子adobe和乔布斯大战,我作为as的拥护者,自然会导向adobe一方,不过今天发现乔布斯的一些抨击倒并不是空穴来风。

经常出现的那种js切换图片效果,如果变成js切换flash的话,自然也没什么大不了。切换图片时要么是几张图片轮播,要么是直接更改图片的href;切换flash时要么时call一个flash的侦听方法,要么是直接重写这一段html代码。

在第2种方法的情况下,明显能感觉出来几种浏览器的区别,无论是老的flash player也好、还是新的10.1也好,皆是。这里面google不愧和adobe合作,chrome来回切换丝毫没有问题;firefox很偶尔才会在切换时出现问题;而ie则太频繁了。猜测这也和chrome单进程的模型有关,这样切换时上一个遗留的flash不会造成内存泄漏。

五月 17th, 2010

土豆网的死循环

No Comments, 前端开发, by army.

http://blog.notsobad.cn/?p=644

今天内部流传了下这篇,哀悼日的死循环。凑巧那几天土豆的几个前端去北京参加adobe的大会,不知道谁写的这个东西……

其实这个bug做过开发的人都知道,经常会犯的小失误,只是实际使用的时候一下就能发觉,所以在自己测试的环节就能找到。但也由于这个缘故,使得人们经常没在意它……