网页教程:如何优化JavaScript脚本的性能
日期:2007年7月6日 作者: 查看:[大字体 中字体 小字体]-
作者:ShiningRay @ Nirvana Studio
随着网络的发展,网速和机器速度的提高,越来越多的网站用到了丰富客户端技术。而现在Ajax则是最为流行的一种方式。javascript是一种解释型语言,所以能无法达到和C/Java之类的水平,限制了它能在客户端所做的事情,为了能改进他的性能,我想基于我以前给JavaScript做过的很多测试来谈谈自己的经验,希望能帮助大家改进自己的JavaScript脚本性能。
语言层次方面
循环
循环是很常用的一个控制结构,大部分东西要依靠它来完成,在JavaScript中,我们可以使用for(;;),while(),for(in)三种循环,事实上,这三种循环中for(in)的效率极差,因为他需要查询散列键,只要可以就应该尽量少用。for(;;)和while循环的性能应该说基本(平时使用时)等价。而事实上,如何使用这两个循环,则有很大讲究。我在测试中有些很有意思的情况,见附录。最后得出的结论是:
如果是循环变量递增或递减,不要单独对循环变量赋值,应该在它最后一次读取的时候使用嵌套的++或—操作符。
如果要与数组的长度作比较,应该事先把数组的length属性放入一个局部变量中,减少查询次数。
局部变量和全局变量
局部变量的速度要比全局变量的访问速度更快,因为全局变量其实是全局对象的成员,而局部变量是放在函数的栈当中的。不使用Eval
使用eval相当于在运行时再次调用解释引擎对内容进行运行,需要消耗大量时间。这时候使用JavaScript所支持的闭包可以实现函数模版(关于闭包的内容请参考函数式编程的有关内容)减少对象查找
因为JavaScript的解释性,所以a.b.c.d.e,需要进行至少4次查询操作,先检查a再检查a中的b,再检查b中的c,如此往下。所以如果这样的表达式重复出现,只要可能,应该尽量少出现这样的表达式,可以利用局部变量,把它放入一个临时的地方进行查询。这一点可以和循环结合起来,因为我们常常要根据字符串、数组的长度进行循环,而通常这个长度是不变的,比如每次查询a.length,就要额外进行一个操作,而预先把var len=a.length,则就少了一次查询。
字符串连接
如果是追加字符串,最好使用s+=anotherStr操作,而不是要使用s=s+anotherStr。如果要连接多个字符串,应该少使用+=,如
s+=a;s+=b;s+=c;
应该写成s+=a + b + c;
而如果是收集字符串,比如多次对同一个字符串进行+=操作的话,最好使用一个缓存。怎么用呢?使用JavaScript数组来收集,最后使用join方法连接起来,如下var buf = new Array();for(var i = 0; i < 100; i++){ buf.push(i.toString());}var all = buf.join("");
类型转换
类型转换是大家常犯的错误,因为JavaScript是动态类型语言,你不能指定变量的类型。1. 把数字转换成字符串,应用"" + 1,虽然看起来比较丑一点,但事实上这个效率是最高的,性能上来说:
("" +) > String() > .toString() > new String()
这条其实和下面的“直接量”有点类似,尽量使用编译时就能使用的内部操作要比运行时使用的用户操作要快。
String()属于内部函数,所以速度很快,而.toString()要查询原型中的函数,所以速度逊色一些,new String()用于返回一个精确的副本。
2. 浮点数转换成整型,这个更容易出错,很多人喜欢使用parseInt(),其实parseInt()是用于将字符串转换成数字,而不是浮点数和整型之间的转换,我们应该使用Math.floor()或者Math.round()。
另外,和第二节的对象查找中的问题不一样,Math是内部对象,所以Math.floor()其实并没有多少查询方法和调用的时间,速度是最快的。
3. 对于自定义的对象,如果定义了toString()方法来进行类型转换的话,推荐显式调用toString(),因为内部的操作在尝试所有可能性之后,会尝试对象的toString()方法尝试能否转化为String,所以直接调用这个方法效率会更高
使用直接量
- [1] [2] [3] [4] [5] 下一页
-
- 网页教程:如何优化JavaScript脚本的性能 相关文章:
- ·网页教程:如何优化JavaScript脚本的性能
- 网页教程:如何优化JavaScript脚本的性能 相关软件
- 特别声明:本站除部分特别声明禁止转载的专稿外的其他文章可以自由转载,但请务必注明出处和原始作
- 者.文章版权归文章原始作者所有.对于被本站转载文章的个人和网站,我们表示深深的谢意。如果本站转
- 载的文章有版权问题请联系编辑人员,我们尽快予以更正. 转载请注明来源:http://www.hackhome.com
上一篇:网页制作实例:用javascript判断录入的日期合法性
下一篇:网站繁简转换解决方案:ASP,JSP,PHP,.Net通用
精品推荐
热点TOP10
- ·如何实现一个表格表头不动tbody区域用滚动条可以滚动
- ·Js之软键盘实现(源码)
- ·javascript实现datagrid客户端checkbox列的全选,反选
- ·用window.location.href实现刷新另个框架页面
- ·用层模拟下拉列表框
- ·判断输入框不为空
- ·用JavaScript刷新框架子页面的方法
- ·JavaScript 经典代码大全
- ·禁用浏览器的后退按钮
- ·Javascript模拟的DOS窗口
- ·获取cpu序列号,硬盘ID,网卡MAC地址
- ·在IE浏览器中正确显示PNG透明图片
- ·JavaScript教程:框架的概念及如何访问
- ·学习JavaScript里面的变量的应用
- ·Javascript强制设为首页的网页代码
- ·汇总:一些不错的使用频率比较高的JS函数
- ·网页两侧浮动广告代码
- ·一个兼容IE、Firefox和Opera浏览器的英文日历脚本
- ·漂浮广告代码完全解析
- ·javascript规定最多输入的字符串长度
特别推荐
- ·网页制作Javascript经典小技巧总结
- ·JavaScript的9个陷阱及评点
- ·简单介绍用JSP来实现文件下载功能的几种方式
- ·网页播放器实现全屏的方法总结
- ·菜鸟学习javascript实例教程
- ·JavaScript 经典代码大全
- ·汇总:一些不错的使用频率比较高的JS函数
- ·Javascript模拟的DOS窗口
- ·Javascript在IE和FireFox中的不同表现
- ·JavaScript仿Windows关机效果
- ·仿windows选项卡效果拾零
- ·JavaScript经典效果集锦
- ·jscript/javascript条件编译
- ·Js之软键盘实现(源码)
- ·innerHTML在Firefox和Opera下的执行特例
- ·弹出窗口window.open()的参数列表
- ·javascript gb2312转utf-8
- ·JavaScript方法和技巧大全
- ·js事件列表
- ·网页屏蔽(左右键,代码等)的非JS方法
