加速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源码分析-03构造jQuery对象-源码结构和核心函数
Nov 14 Javascript
解决JS中乘法的浮点错误的方法
Jan 03 Javascript
js弹出确认是否删除对话框
Mar 27 Javascript
jquery幻灯片插件bxslider样式改进实例
Oct 15 Javascript
window.location.reload 刷新使用分析(去对话框)
Nov 11 Javascript
jquery if条件语句的写法
May 19 Javascript
js正则表达式惰性匹配和贪婪匹配用法分析
Dec 26 Javascript
js中小数向上取整数,向下取整数,四舍五入取整数的实现(必看篇)
Feb 13 Javascript
解决vue单页使用keep-alive页面返回不刷新的问题
Mar 13 Javascript
微信小程序遍历Echarts图表实现多个饼图
Apr 25 Javascript
jquery+ajax实现上传图片并显示上传进度功能【附php后台接收】
Jun 06 jQuery
vue 实现把路由单独分离出来
Aug 13 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 中的类
2006/10/09 PHP
PHP return语句的另一个作用
2014/07/30 PHP
一个经典的PHP文件上传类分享
2014/11/18 PHP
PHP简单读取PDF页数的实现方法
2016/07/21 PHP
Laravel向公共模板赋值方法总结
2019/06/25 PHP
什么是JavaScript
2009/08/13 Javascript
js replace替换所有匹配的字符串
2014/02/13 Javascript
JQuery选择器绑定事件及修改内容的方法
2015/01/23 Javascript
JavaScript截取、切割字符串的技巧
2016/01/07 Javascript
Bootstrap Paginator分页插件与ajax相结合实现动态无刷新分页效果
2016/05/27 Javascript
基于jquery插件编写countdown计时器
2016/06/12 Javascript
JS跳转手机站url的若干注意事项
2017/10/18 Javascript
微信小程序使用scroll-view标签实现自动滑动到底部功能的实例代码
2018/11/09 Javascript
微信小程序实现通过js操作wxml的wxss属性示例
2018/12/06 Javascript
Python中获取对象信息的方法
2015/04/27 Python
python3 shelve模块的详解
2017/07/08 Python
基于Django用户认证系统详解
2018/02/21 Python
Python-OpenCV基本操作方法详解
2018/04/02 Python
详解python Todo清单实战
2018/11/01 Python
python通用读取vcf文件的类(复制粘贴即可用)
2020/02/29 Python
python使用Thread的setDaemon启动后台线程教程
2020/04/25 Python
CSS3 @font-face属性使用指南
2014/12/12 HTML / CSS
HTML5新增加标签和功能概述
2016/09/05 HTML / CSS
家长对小学生的评语
2014/01/28 职场文书
毕业生写求职信的要点
2014/03/04 职场文书
承诺书怎么写
2014/03/26 职场文书
优秀毕业生就业推荐信
2014/05/22 职场文书
项目经理任命书
2014/06/04 职场文书
创先争优活动党员公开承诺书
2014/08/29 职场文书
科级干部群众路线教育实践活动个人对照检查材料
2014/09/19 职场文书
2015员工年度考核评语
2015/03/25 职场文书
承诺书的签字人,需不需要承担相应的责任?
2019/07/09 职场文书
详解python的异常捕获
2022/03/03 Python
漫画《催眠麦克风-Dawn Of Divisions》第二卷PV公开
2022/04/05 日漫
使用refresh_token实现无感刷新页面
2022/04/26 Javascript
Mybatis 一级缓存和二级缓存原理区别
2022/09/23 Java/Android