Where you store and access data in JavaScript can have a measurable impact on the
overall performance of your code. There are four places to access data from: literal
values, variables, array items, and object members. These locations all have different
performance considerations.
• Literal values and local variables can be accessed very quickly, whereas array items
and object members take longer.
• Local variables are faster to access than out-of-scope variables because they exist
in the first variable object of the scope chain. The further into the scope chain a
variable is, the longer it takes to access. Global variables are always the slowest to
access because they are always last in the scope chain.
• Avoid the with statement because it augments the execution context scope chain.
Also, be careful with the catch clause of a try-catch statement because it has the
same effect.
• Nested object members incur significant performance impact and should be
minimized.
• The deeper into the prototype chain that a property or method exists, the slower
it is to access.
• Generally speaking, you can improve the performance of JavaScript code by storing
frequently used object members, array items, and out-of-scope variables in local
variables. You can then access the local variables faster than the originals.
Scope chain while executing add()
Augmented scope chain in a with statement
Executing the closure
overall performance of your code. There are four places to access data from: literal
values, variables, array items, and object members. These locations all have different
performance considerations.
• Literal values and local variables can be accessed very quickly, whereas array items
and object members take longer.
• Local variables are faster to access than out-of-scope variables because they exist
in the first variable object of the scope chain. The further into the scope chain a
variable is, the longer it takes to access. Global variables are always the slowest to
access because they are always last in the scope chain.
• Avoid the with statement because it augments the execution context scope chain.
Also, be careful with the catch clause of a try-catch statement because it has the
same effect.
• Nested object members incur significant performance impact and should be
minimized.
• The deeper into the prototype chain that a property or method exists, the slower
it is to access.
• Generally speaking, you can improve the performance of JavaScript code by storing
frequently used object members, array items, and out-of-scope variables in local
variables. You can then access the local variables faster than the originals.
Scope chain while executing add()
Augmented scope chain in a with statement
Executing the closure
DOM access and manipulation are an important part of modern web applications. But
every time you cross the bridge from ECMAScript to DOM-land, it comes at a cost. To
reduce the performance costs related to DOM scripting, keep the following in mind:
• Minimize DOM access, and try to work as much as possible in JavaScript.
• Use local variables to store DOM references you’ll access repeatedly.
• Be careful when dealing with HTML collections because they represent the live,
underlying document. Cache the collection length into a variable and use it when
iterating, and make a copy of the collection into an array for heavy work on
collections.
• Use faster APIs when available, such as querySelectorAll() and
firstElementChild.
• Be mindful of repaints and reflows; batch style changes, manipulate the DOM tree
“offline,” and cache and minimize access to layout information.
• Position absolutely during animations, and use drag and drop proxies.
• Use event delegation to minimize the number of event handlers.
every time you cross the bridge from ECMAScript to DOM-land, it comes at a cost. To
reduce the performance costs related to DOM scripting, keep the following in mind:
• Minimize DOM access, and try to work as much as possible in JavaScript.
• Use local variables to store DOM references you’ll access repeatedly.
• Be careful when dealing with HTML collections because they represent the live,
underlying document. Cache the collection length into a variable and use it when
iterating, and make a copy of the collection into an array for heavy work on
collections.
• Use faster APIs when available, such as querySelectorAll() and
firstElementChild.
• Be mindful of repaints and reflows; batch style changes, manipulate the DOM tree
“offline,” and cache and minimize access to layout information.
• Position absolutely during animations, and use drag and drop proxies.
• Use event delegation to minimize the number of event handlers.
913
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
