加速IE的Javascript document输出的方法


Posted in Javascript onDecember 02, 2010

将下列代码加在JavaScript的最前面

/*@cc_on _d=document;eval('var document=_d')@*/

加入这样的一行代码IE的document的访问速度至少可以提高5倍以上
下面是加入前和加入后的测试比较代码
// Before 
var date = new Date; 
for (var i = 0; i < 100000; i++) document; 
alert(new Date - date); // 643

/*@cc_on _d=document;eval('var document=_d')@*/ // After 
date = new Date; 
for (var i = 0; i < 100000; i++) document; 
alert(new Date - date); // 145

速度提高了不少吧!

解说:
首先,IE里document就这样直接被调用的话被执行的是window 对象的内部函数,而这个比较低效的。根据这一点,下面的处理可以提高速度:
var doc = document;

document; // 慢
doc; // 这个比上面的(document)快

虽然像上面那么写可以直接使用,但是之前用到document的地方都要去替换,这个有点麻烦了点吧。所以,看下面的:
var doc = document;
var document = doc;
可以实现的话那就太好了……

了解JavaScript的人应该知道,JavaScript的变量是在最开始的时候就生成的,所以这里的document就变成了undefined了。
没关系,继续改进~
var doc = document;
eval('var document = doc');

eval的作用就是在作用域范围内改变变量,这样的话,后面的document就可以被正常使用了。
最后,加上只有在IE内有效的条件,就像下面这样就可以了~

/*@cc_on 
var doc = document; 
eval('var document = doc'); 
@*/

举一反三,像下面这样的写法,document以外的全局变量也可以用上面的方法,起到加速的作用。
/*@cc_on 
eval((function(props) { 
var code = []; 
for (var i = 0 l = props.length;i<l;i++){ 
var prop = props[i]; 
window['_'+prop]=window[prop]; 
code.push(prop+'=_'+prop) 
} 
return ‘var ‘+code.join(','); 
})('document self top parent alert setInterval clearInterval 
setTimeout clearTimeout'.split(' ‘))); 
@*/

下面是Franky的回复:
首先,IE里document就这样直接被调用的话被执行的是window 对象的内部函数,而这个比较低效的。根据这一点,下面的处理可以提高速度:

这个说法 不对..

之所以 你的测试 前后有差异,主要区别在于作用域链查找.
你的代码 是在global 执行环境.所以IE下,会访在global对象去查找 key 为'document'的成员. 而这个对象在ie中是一个com+实现的宿主对象. 他不在global中. global中没有,则去window中再次查找.造成了速度变慢.

同样的全局对象 Math. 就不会带来这个问题.原因是Math 在 Global上. 一次作用域链查找就找到了.

对于优化. 一个建议就是
var win = window, doc = document,undefined;
每层作用域内,如果这个成员使用超过两次,就有意义.

而如果你只在全局作用域 使用一次 ie 条件注释 ,首先 非ie就无法享受到作用域被缩短的好处. 当然非ie 不会存在global->window的 多一次责任链查找.

这里的优化核心,就是缩短作用域链. 虽然opera chrome safarai等较新版本,对作用域链查找做了优化. 但是我们认为的缩短作用域链. 对老的浏览器是有积极作用的.且对具备优化的浏览器,也不会带来过于负的面影响.

Javascript 相关文章推荐
从Ajax到JQuery Ajax学习
Feb 14 Javascript
改善你的jQuery的25个步骤 千倍级效率提升
Feb 11 Javascript
关于JavaScript中var声明变量作用域的推断
Dec 16 Javascript
纯JAVASCRIPT图表动画插件Highcharts Examples
Apr 16 Javascript
node.js 一个简单的页面输出实现代码
Mar 07 Javascript
jQuery数组处理函数整理
Aug 03 Javascript
vue resource post请求时遇到的坑
Oct 19 Javascript
javaScript日期工具类DateUtils详解
Dec 08 Javascript
jQuery插件实现弹性运动完整示例
Jul 07 jQuery
vue添加axios,并且指定baseurl的方法
Sep 19 Javascript
vue-lazyload使用总结(推荐)
Nov 01 Javascript
JavaScript模拟实现网易云轮播效果
Apr 04 Javascript
关于Ext中form移除textfield方法:hide(),setVisible(false),remove()
Dec 02 #Javascript
javascript学习之闭包分析
Dec 02 #Javascript
JavaScript OOP面向对象介绍
Dec 02 #Javascript
JavaScript 字符串处理函数使用小结
Dec 02 #Javascript
改写一个简单的菜单 弹性大小
Dec 02 #Javascript
在Ajax中使用Flash实现跨域数据读取的实现方法
Dec 02 #Javascript
jQuery队列控制方法详解queue()/dequeue()/clearQueue()
Dec 02 #Javascript
You might like
改德生G88 - 加装等响度低音提升电路
2021/03/02 无线电
php skymvc 一款轻量、简单的php
2011/06/28 PHP
thinkphp模板用法和内容输出实例
2014/11/28 PHP
PHP生成压缩文件实例
2015/02/07 PHP
Swoole扩展的6种模式深入详解
2021/03/04 PHP
fancybox1.3.1 基于Jquery的插件在IE中图片显示问题
2010/10/01 Javascript
jQuery学习笔记之jQuery的动画
2010/12/22 Javascript
javascript闭包的高级使用方法实例
2013/07/04 Javascript
Javascript实现多彩雪花从天降散落效果的方法
2015/02/02 Javascript
不定义JQuery插件 不要说会JQuery
2016/03/07 Javascript
JS组件Bootstrap ContextMenu右键菜单使用方法
2016/04/17 Javascript
JavaScript操作选择对象的简单实例
2016/05/16 Javascript
AngularJS API之copy深拷贝详解及实例
2016/09/14 Javascript
JS+canvas动态绘制饼图的方法示例
2017/09/12 Javascript
使用Webpack提升Vue.js应用程序的4种方法(翻译)
2019/10/09 Javascript
vue v-for 点击当前行,获取当前行数据及event当前事件对象的操作
2020/09/10 Javascript
让python json encode datetime类型
2010/12/28 Python
go语言计算两个时间的时间差方法
2015/03/13 Python
详解Python发送邮件实例
2016/01/10 Python
python监控进程脚本
2018/04/12 Python
pyqt5 使用label控件实时显示时间的实例
2019/06/14 Python
利用python求积分的实例
2019/07/03 Python
pytorch 输出中间层特征的实例
2019/08/17 Python
python之列表推导式的用法
2019/11/29 Python
tensorflow实现在函数中用tf.Print输出中间值
2020/01/21 Python
Python表达式的优先级详解
2020/02/18 Python
手把手教你安装Windows版本的Tensorflow
2020/03/26 Python
matplotlib.pyplot.plot()参数使用详解
2020/07/28 Python
Martinelli官方商店:西班牙皮鞋和高跟鞋品牌
2019/07/30 全球购物
网络安全类面试题
2015/08/01 面试题
商场中秋节广播稿
2014/01/17 职场文书
公司门卫管理制度
2014/02/01 职场文书
合作意向协议书范本
2014/03/31 职场文书
5s标语大全
2014/06/23 职场文书
Nginx进程调度问题详解
2021/09/25 Servers
正则表达式拆分url实例代码
2022/02/24 Java/Android