1. 首页 > 电脑教程 > 怎样为IE的javascript提速

怎样为IE的javascript提速

我们知道,javascript在执行期时是由内到外执行脚本的,那么离我们的脚本最远的全局对象,很可能要跨越几层作用域才能访问到它。不过在IE中,从最内层到最外层要花的时间比其他多出很多。加之,javascript是一种胶水语言,它必须要调用DOM对能完成我们大多数选择。最著名的就是选择元素(document.getElementById,document.getElementsByTagName,docuemnt.evaluate,document.querySelector),创建元素(document.createElement),此外还有document.body,document.defaultView.getComputedStyle等等,频繁地调用document对象,但是document是位于window对象下,因此这路程就更远了。就了提速,我们必须把它们保存在一个本地变量,那么每次就省得它长途跋涉了。这种技术的运用明显体现在jQuery的源码中:

01.(function( window, undefined ) { 02. 03.// Define a local copy of jQuery 04.var jQuery = function( selector, context ) { 05. // The jQuery object is actually just the init constructor 'enhanced' 06. return new jQuery.fn.init( selector, context ); 07. }, 08. 09. // Map over jQuery in case of overwrite 10. _jQuery = window.jQuery, 11. 12. // Map over the $ in case of overwrite 13. _$ = window.$, 14. 15. // Use the correct document accordingly with window argument (sandbox) 16. document = window.document, 17. 18. //====================省================= 19. } 20.// Expose jQuery to the global object 21.window.jQuery = window.$ = jQuery; 22. 23.})(window); 把window传进闭包内,就省得它每次都往外找window了。

再看其他类库

1.//Raphael 2.window.Raphael = (function () { 3. var separator = /[, ]+/, 4. elements = /^(circle|rect|path|ellipse|text|image)$/, 5. doc = document, 6. win = window, 7.//************略************** 1.//dojo 2.d.global = this; 1.//Ext 2.DOC = document, 01.//YUI 02.//************略************ 03. } else if (i == 'win') { 04. c[i] = o[i].contentWindow || o[i]; 05. c.doc = c[i].document; 06.//************略************ 07.Y.config = { 08. 09. win: window || {}, 10. doc: document, 但是如果你没有引入类库,如果让IE的javascript跑得更快些呢?用一个变量把它储存起来?在日本博客看到一种很厉害的劫持技术,偷龙转凤把全局变量document变成一个局部变量。

view sourceprint?1./*@cc_on _d=document;eval('var document=_d')@*/ javascript提速技术 by 司徒正美运行代码

运用提速技术后:

javascript提速技术 by 司徒正美!!!!!!!!运行代码

经测试,用了提速技术后,IE的性能比较

IE6 document document.getElementById document.title 没有使用提速技术 485 1110 1219 使用提速技术后 109 609 656 IE8 document document.getElementById document.title 没有使用提速技术 468 797 843 使用提速技术后 78 328 407

我们看一下实现原理:

view sourceprint?1.document; 2.doc; //很明显,调用这个比直接document快,document还要钻进window内部找一番 如何劫持它呢?

view sourceprint?1.var doc = document; 2.var document = doc; 这样明显不行因为在预编译阶段,var变量会提前,上面代码相当于

view sourceprint?1.var doc 2.var document //这里被劫持了 3.doc = document //注意,document已经变成undefined 4.document = doc //相当于window.undefined = undefined 没有办法,只好在执行期才定义这个document变量,javascript的动态解析技术派上用场了,eval就是其代表之一。

view sourceprint?1.var doc = document; 2.eval('var document = doc'); 为了让IE专用,用了IE特有的条件编译。

view sourceprint?1./*@cc_on 2.var doc = document; 3.eval('var document = doc'); 4.@*/嘛,window的东西其实蛮多,我们一一把它们变成本地变量又如何?

view sourceprint?01./*@cc_on 02.eval((function(props) { 03. var code = []; 04. for (var i = 0 l = props.length;i

view sourceprint?01.if( !+"\v1" ){ 02. var code = [],ri = 0,prop,str = "var "03. for(var a in window) 04. code[ri++] = a; 05. for (var i = 0 ,n = code.length;ijavascript提速技术 by 司徒正美!!!!!!

声明:希维路由器教程网提供的内容,仅供网友学习交流,如有侵权请与我们联系删除,谢谢。ihuangque@qq.com
本文地址:https://www.ctrlcv.com.cn/diannao/169348683111090.html