原PPT链接：
http://www.slideshare.net/nzakas/high-performance-javascript-webdirections-usa-2010
NicholasC.Zakas《Javascript高级程序设计》的作者
摘要如下：
1. The browser UI thread isresponsible for both UI updates and Javascript execution.
Only one can happen at a time.
2. Long-running Javascript = Unresponsive UI
How long is too long?
100ms. Recommendation:50ms
Long UI updates =Unresponsive UI
3. Ways to ensure Javascript doesn’t run away:
A. Timers
B. Web Worker
a. Asynchronous Javascript execution
b. Execution happens outside of UI thread
a) Not on the UI thread = no UI delays
d. Data-driven API
a) Data is serialized when sending data into or out of Worker
b) No access to DOM, BOM
c) Completely separate execution environment
4. Repaint and Reflow
A repaint occurs when a visual change doesn’t require recalculation of layout
Changes to visibility, colors (text / background), background image,etc
e.g.
A reflow occurs when a visual change requires a change in layout
Initial page load, browser resize, DOM structure change, layout style change, layout information retrieved.
e.g.
Repaints and reflows are queued up as Javascript executes and thenexecuted in order.
Limiting repaints / reflows improves overall performance.
Solutions:
A. Perform DOM manipulations off-document
a) Remove element from the document, make changes, insert back into document.
b) Set element’s display to “none”, make changes, set display back to default
c) Build up DOM changes on a DocumentFragment then applay all atonce.
DocumentFragment:
B. Group Style Changes
C. Avoid Accidental Reflow
a) Minimize access to layout information
offsetTop,offsetLeft, offsetWidth, offsetHeight
scrollTop, scrollLeft,scrollWidth, scrollHeight
clientTop, clientLeft, clientWidth, clientHeight
Most computed styles
b) If a value is used more than once, store in local variable
转载于:https://www.cnblogs.com/21gram/archive/2010/11/23/1886023.html
相关资源：High Performance JavaScript(高性能JavaScript)读书笔记分析