移动Web应用程序开发 高性能JavaScript篇(二) JavaScript 开发分析工具

1. JavaScript 引擎介绍

这里只介绍主流浏览器的JavaScript引擎。如下图所示:



JS引擎一般作为共享库使用,应用程序调用引擎提供的API函数。引擎API函数大致分为以下几种:数据类型操作、RunTime控制、类与对象的创建和维护、函数与脚本执行、字符串操作、错误处理、安全控制、Debug支持。

上图中测试使用的是Google V8 benchmark。可以看出Chrome V8引擎JavaScript执行各项指标最优。

其中:每款浏览器JavaScript引擎发展历史:

Mozilla

• SpiderMonkey,第一款JavaScript引擎,由Brendan Eich在Netscape Communications时编写,用于Mozilla Firefox 1.0~3.0版本。

• Rhino,由Mozilla基金会管理,开放源代码,完全以Java编写。

• TraceMonkey,基于即时编译的引擎,其中部份程式码取自Tamarin引擎,用于Mozilla Firefox 3.5~3.6版本。

• JaegerMonkey,德文Jäger原意为猎人,结合追踪和组合码技术大幅提高效能,部分技术借凿了V8、JavaScriptCore、WebKit,用于Mozilla Firefox 4.0以上版本。

Google

• V8,开放源代码,由Google丹麦开发,是Google Chrome的一部分。

微软

• Chakra (JScript引擎),中文译名为查克拉,用于Internet Explorer 9的32位版本。

Opera

• Linear A,用于Opera 4.0~6.1版本。

• Linear B,用于Opera 7.0~9.2版本。

• Futhark,用于Opera 9.5~10.2版本。

• Carakan,由Opera软件公司编写,自Opera10.50版本开始使用。

其它

• KJS,KDE的ECMAScript/JavaScript引擎,最初由Harri Porten开发,用于KDE项目的Konqueror网页浏览器中。

• Narcissus,开放源代码,由Brendan Eich编写(他也参与编写了第一个SpiderMonkey)。

• Tamarin,由Adobe Labs编写,Flash Player 9所使用的引擎。

• Nitro(原名SquirrelFish),为Safari 4编写。

2. JavaScript 开发工具

下面介绍几款常用的JavaScript 开发调试工具:

1. Google Chrome Developer Tools

个人觉得目前Chrome开发者工具是所有工具中最好用的JavaScript开发调试工具,其具有非常强大的功能。具体参考:https://developers.google.com/chrome-developer-tools/docs/overview

2. Mozilla Firefox Firebug

Mozilla 在Web开发领域一直是一个领导者,Firebug也是非常方便的开发调试工具。可以分析,查看log, Debug等功能很强大。具体参考:http://getfirebug.com/

3. IE Developer Tools

微软IE也提供了自己的一套开发工具,但是个人觉得用起来不是很方便,可能是不习惯的原因吧。具体信息参考http://www.microsoft.com/download/en/confirmation.aspx?id=18359

再介绍两款JavaScript网页性能分析工具:

1. JavaScript Performance 网站 http://jsperf.com/

用户可以在该网站上面写不同的test case来测试如何写JavaScript代码更加高效。如果需要针对IE做优化,只需要在IE中打开该网站进行测试和分析,如果需要在Chrome中做优化,一样,对应地在Chrome中打开就可以了。点击测试之后,会给出一份很详细的测试报告。



2. Chrome speedtracer 插件。

具体的使用方式参考:https://developers.google.com/web-toolkit/speedtracer/get-started

然后打开你要性能分析的网页,打开这个工具,然后刷新目标网站,刷新完了点击停止分析,就可以查看报告了。



打开每一项之后可以看到很详细的分析报告,如下图:



相关文章

移动Web应用程序开发 高性能JavaScript篇 (一) JavaScript 性能瓶颈

参考文章: WiKi Javascript Engine

在写一篇文章中将给大家结合实例例子及分析工具介绍在加载JavaScript代码时,如何编程可以让Web应用或者网页更加高效。

For more complete information about compiler optimizations, see our Optimization Notice.