加速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 相关文章推荐
模仿jQuery each函数的链式调用
Jul 22 Javascript
iframe的onload在Chrome/Opera中执行两次Bug的解决方法
Mar 17 Javascript
JS写的贪吃蛇游戏(个人练习)
Jul 08 Javascript
jQuery焦点图轮播插件KinSlideshow用法分析
Jun 08 Javascript
Node.js编写CLI的实例详解
May 17 Javascript
Node学习记录之cluster模块
May 31 Javascript
Vue filters过滤器的使用方法
Jul 14 Javascript
Bootstrap Table 在指定列中添加下拉框控件并获取所选值
Jul 31 Javascript
详解Node.js模板引擎Jade入门
Jan 19 Javascript
微信小程序如何实现精确的日期时间选择器
Jan 21 Javascript
openlayers 3实现车辆轨迹回放
Sep 24 Javascript
详解CocosCreator项目结构机制
Apr 14 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
php 信息采集程序代码
2009/03/17 PHP
PHP定时执行计划任务的多种方法小结
2011/12/19 PHP
wordpress自定义url参数实现路由功能的代码示例
2013/11/28 PHP
PHP与SQL语句常用大全
2016/12/10 PHP
PHP实现的常规正则验证helper公共类完整实例
2017/04/27 PHP
解决tp5在nginx下修改配置访问的问题
2019/10/16 PHP
jQuery html()等方法介绍
2009/11/18 Javascript
jQuery用unbind方法去掉hover事件及其他方法介绍
2013/03/18 Javascript
JavaScript前端开发之实现二进制读写操作
2015/11/04 Javascript
jQuery中serializeArray()与serialize()的区别实例分析
2015/12/09 Javascript
AngualrJS中每次$http请求时的一个遮罩层Directive
2016/01/26 Javascript
原生JS实现平滑回到顶部组件
2016/03/16 Javascript
Bootstrap轮播插件中图片变形的终极解决方案 使用jqthumb.js
2016/07/10 Javascript
JavaScript实现使用Canvas绘制图形的基本教程
2016/10/27 Javascript
Vue 进阶教程之v-model详解
2017/05/06 Javascript
vue2.0中vue-cli实现全选、单选计算总价格的实例代码
2017/07/18 Javascript
javascript计算渐变颜色的实例
2017/09/22 Javascript
使用Vue开发一个实时性时间转换指令
2018/01/17 Javascript
js input输入百分号保存数据库失败的解决方法
2018/05/26 Javascript
vue中设置、获取、删除cookie的方法
2018/09/21 Javascript
Vue官方推荐AJAX组件axios.js使用方法详解与API
2018/10/09 Javascript
[02:13] 完美世界DOTA2联赛PWL DAY5集锦
2020/11/03 DOTA
python常见数制转换实例分析
2015/05/09 Python
sublime text 3配置使用python操作方法
2017/06/11 Python
python Selenium实现付费音乐批量下载的实现方法
2019/01/24 Python
nginx黑名单和django限速,最简单的防恶意请求方法分享
2019/08/09 Python
Django User 模块之 AbstractUser 扩展详解
2020/03/11 Python
HTML5 Canvas鼠标与键盘事件demo示例
2013/07/04 HTML / CSS
基于MUI框架使用HTML5实现的二维码扫描功能
2018/03/01 HTML / CSS
美国购买体育、音乐会和剧院门票网站:SelectATicket
2019/09/08 全球购物
副校长竞聘演讲稿
2014/09/01 职场文书
2014年安置帮教工作总结
2014/12/11 职场文书
个人典型事迹材料
2014/12/30 职场文书
给老师的保证书怎么写
2015/05/09 职场文书
亲戚关系证明
2015/06/24 职场文书
2016年重阳节慰问信
2015/12/01 职场文书