岁月如歌

jQuery 将马上发布 1.4 正式版，代码也从 googlecode 上迁移到了 github. jQuery 是我接触的第一个 JS 类库，俗话说初恋总是让人难以忘记。一年以前，这种难以忘记仅仅是一种纯感觉，说不出来具体原因。前几天重新看了一遍 github 上的源码。从纯功能上说，jQuery 并没有特别出色的地方。究竟是什么让我如此恋恋不舍呢？

昨天搭建 taskspeed, 检查 jQuery 的测试代码时，突然明晓了一个也许大家都已知道的秘密：

jQuery 最出色最让人恋恋不舍的是它的 API 设计。
阅读全文 »

JS 的加载速度，包括下载和运算两部分（参考 JavaScript Library Loading Speed）：

Total_Speed = Time_to_Download + Time_to_Evaluate

运算（evaluate）又可细分为解析（parse）和执行（execute）。考虑加载速度时，一般放在一起考虑。

通常来说，下载时间是影响 JS 加载速度的关键。这方面的优化已经很成熟，比如 Compressor, GZip, Cache 等等。

evaluation 部分，目前主要优化方案是延迟（称之 Deferred Evaluation）。具体策略有：

1. 将 JS 代码以注释的形式下载，需要使用时再 parse. 可以参考 GMail for Mobile Team 的研究。
2. 将 JS 代码以字符串定义的形式下载。可以参考 SproutCore Blog 的分析。
3. 将 JS 代码以闭包的形式下载。

第一种策略能将 evaluation 完全延迟，后两种还存在少量未被延迟的 evaluation, 但和第一种差异很小。下面讨论第三种。
阅读全文 »

经克军提醒，在博客上也搭建了个 TaskSpeed:

http://lifesinger.org/labs/taskspeed/

将感兴趣的框架都更新到最新版本。修改了部分 tests.js, 以保证主流浏览器下所有用例都能得到正确结果。

特别修改了 YUI 2.8 的测试文件：yui-tests.js. 原测试文件大量使用YAHOO.util.Selector这个并不推荐使用的类，不符合 YUI 2 的实际使用情况（一般仅使用 yahoo-dom-event, get, anim 等 utilities）。

从测试结果可以看出：

前三甲是 Dojo 1.4, jQuery 1.4, YUI 2.8
MooTools 在 Safari 下表现优异，其它浏览器下有些惨淡。
Prototype 老矣，尚能饭否？
YUI 3 中规中矩，不出色，但也不糟糕。

这是 2007 年的一篇老文：Faster JavaScript Trim.

测试页面：trim-test.html

感兴趣的几个方法：

function trim1(str) {
    return str.replace(/^\s\s*/, '').replace(/\s\s*$/, '');
}
function trim2(str) {
    return str.replace(/^\s+/, '').replace(/\s+$/, '');
}
function trim4(str) {
    return str.replace(/^\s+|\s+$/g, '');
}
function trim8(str) {
    return str.replace(/^\s*((?:[\S\s]*\S)?)\s*$/, '$1');
}

时至今日，有些结论已经发生变化：
阅读全文 »

测试场景：给 table 的 150 个 tr 添加style="color: #ccc", 重复 20 次。
测试页面：dom-manipulation.html

点击每个测试按钮前，都重新启动浏览器。手工记录 10 * 4 * 4 次无明显偏差的数据，取平均值，可得到以下统计结果：

其它 DOM 操作结果类似。

结论：当页面较复杂，DOM 操作较多时，YUI3 会明显增加脚本执行时间，存在性能隐患。
阅读全文 »