Home > Developer > JavaScript
We know that JavaScript executes scripts from inside to outside at run time, so the global object farthest from our script is likely to be accessed across several layers of scope. However, in IE, from the most to the outermost layer of time to spend a lot more than the other. Plus, JavaScript is a glue language that must be called DOM pairs to accomplish most of our choices. The most famous is the selection element (Document.getelementbyid,document.getelementsbytagname,docuemnt.evaluate, Document.queryselector), creating elements (Document.createelement), in addition to Document.body,document.defaultview.getcomputedstyle, and so on, frequently calling Docum The Ent object, but the document is located under the Window object, so the journey is further away. We have to keep them in a local variable, so it saves them a long journey. The use of this technology is clearly embodied in the jquery Source:
(function (window, undefined) {
02.
03.//Define A local copy of jquery
04.var J Query = function (selector, context) {
05.
///The JQuery object is actually just the Init constructor ' Enhanced '
06.
Return to New JQuery.fn.init (selector, context);
07.
},
08.&NBSP
09.
//Map over JQuery (case of overwrite
10.
_jquery = window.jquery,& nbsp
11.
12.
//Map over the $ in case of overwrite
13.
_$ = window.$, < br> 14.
15.
//Use the correct document accordingly with Window argument (sandbox)
16.& nbsp
Document = window.document,
17.
18.
//==================== province =================& nbsp
19.
}
20.//expose JQuery to the global object
21.window.jquery = window.$ = Jquery;&nb Sp
22.&nbsP
(window);
Passes the window into the closure, which saves it from looking out for Windows every time.
Look at other class libraries
1.//raphael
2.window. Raphael = (function () {
3.
var separator =/[,]+/,
4.
elements =/^ (circle|rect|path|ellipse|text|image) $/,
5.
Doc = document,
6.
Win = window,
7.//************ slightly ************** 1.//dojo
2.d.global = this; 1.//ext
2.DOC = document, 01.//yui
02.//************ slightly ************
03.
else if (i = = ' win ') {
04.
C[i] = O[i].contentwindow | | O[i];
05.
C.doc = c[i].document;
06.//************ slightly ************
07.y.config = {
08.
09.
Win:window | | {},
10.
Doc:document,
But if you didn't introduce the class library, what if IE's JavaScript ran faster? Use a variable to store it? In Japan, a blog to see a very powerful hijacking technology, steal Dragon turn Phoenix to the global variable document into a local variable.
View sourceprint?1./* @cc_on _d=document;eval (' var document=_d ') @*/
<!doctype html>
<meta charset= "Utf-8"/>
<title>javascript speed-up Technology by Masaki </title>
<script type= "Text/javascript" >
var date = new Date;
for (var i = 0; i < 100000; i++) document;
Alert (new date-date);
</script>
<body>
</body>
Run code
After using speed-increasing technology:
<!doctype html>
<meta charset= "Utf-8"/>
<title>javascript speed-up Technology by Masaki </title>
<script type= "Text/javascript" >
/* @cc_on _d=document;eval (' var document=_d ') @*/
var date = new Date;
for (var i = 0; i < 100000; i++) document;
Alert (new date-date);
</script>
<body>
!!!!!!!!
</body>
Run code
After testing, using the speed-increasing technology, IE performance comparison
IE6
Document document.getElementById Document.title
No use speed-up technology 485 1110 1219
109 609 656 After using speed-up technology
IE8
Document document.getElementById Document.title
No use speed-up technology 468 797 843
78 328 407 After using speed-up technology
Let's look at the implementation principle:
View Sourceprint?1.document;
2.doc; Obviously, the call was faster than the direct document, and document had to get inside the window to find a
How do you hijack it?
View Sourceprint?1.var doc = document;
2.var document = doc;
That's obviously not going to work. Because in the precompilation phase, the Var variable is in advance, and the code above is equivalent
View Sourceprint?1.var doc
2.var Document//was hijacked here.
3.doc = document/Note that document has become undefined
4.document = doc//equivalent window.undefined = undefined
There is no way to define this document variable during the execution period, and JavaScript's dynamic parsing technology comes in handy, and Eval is one of its representatives.
View Sourceprint?1.var doc = document;
2.eval (' var document = Doc ');
In order to make IE special, use IE specific conditions to compile.
View sourceprint?1./* @cc_on
2.var doc = document;
3.eval (' var document = Doc ');
4.@*/
Well, window stuff is actually quite a lot, so how about we turn them into local variables?
View sourceprint?01./* @cc_on
02.eval ((function (props) {
03.
var code = [];
04.
for (var i = 0 L = props.length;i<l;i++) {
05.
var prop = Props[i];
06.
Window[' _ ' +prop]=window[prop];
07.
Code.push (prop+ ' =_ ' +prop)
08.
}
09.
Return ' var ' +code.join (', ');
(' Document event body location title self Top parent alert setinterval clearinterval settimeout cleartimeout '. Split (' ')));
11.@*/
We can expand it to allow more global variables or global methods to be localized. However, the experience, FF use it will be an error, chrome is slow, other browsers are not obvious.
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;i<n;i+ +) {
06.
var prop = code[i]
07.
window[' _ ' +prop] = window[prop];
08.& nbsp
str = prop+ ' =_ ' +prop+ ', '
09.
}
10.
str = Str.slice (0,-1);
11.
Eval (str)
12.} &NBSP
<!doctype html>
<meta charset= "Utf-8" />
<title>javascript speed-up Technology by Masaki </title>
<script type= "Text/javascript"
var __ Chrome = Navigator.userAgent.indexOf ("Chrome")!==-1;
var __firefox =!!window.components
if (!__chrome &!__firefox) {
var code = [],ri = 0,prop,str = "var"
For (var a in window)
code[ri++] = A;
for (var i = 0, n = code.length;i<n;i++) {
var prop = Code[i]
Window[' _ ' +prop] = Window[prop];
str = prop+ ' =_ ' +prop+ ', '
}
str = Str.slice (0,-1);
eval (str)
}
var date = new Date;
for (var i = 0; i < 100000; i++)
Document
Alert (new date-date);
</script>
<body>
!!!!!!
</body>
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
