Performance Tips on Javascript

Presentation on webrebuild

Transcript

1. PPT模板下载：www.1ppt.com/moban/ Performance on JS
2. What's this topic about Briefing
3. Topics Scope: – Single-page application – Ajax and Web 2.0 – Download and execute more code as you interact Topics: – Variable Scope Management – Data accessing – Loops & Functions – ASMJS
4. Scope Chain Matters? Variable Scope Management
5. Scope Chain ? How to find out a variable ? – Variable inside javascript: Data Reference. – How to locate a variable in functions: From Local to Global – What does the VM do before execution a function? • Create a stackframe before getting into functions • Reference all the outer function variables by pointers to array in stackframe • Referencing local variables in stackframe • Push stackframe into vm's execution context • All the stackframes => Scope Chain – What does the VM do during execution ?
6. Scope Chain ?
7. Matters ? It really matters? – Testing cases: • scope chain lookups • Scope Chain • Simple Test – ResuIt: It does NOT matter ! Special cases – try/catch – try/catch with fail
8. Scope Chain ? Why ? – Just in time compiler! • All the variables is looked up inside the scope chain as less times as possible. • Once referenced, cached it! • Check the type & avaibilities on the fly with minus cost (usually assembly code) – The state of art javascript vm supporting jit! What matters ? – Calling slower routings (exception blow up) – Variable type changed during executions (delete a.b)
9. Data accessing Matters? Data accessing
10. Ways of data accessing Data variables for accessing – Literal value – Variable – Object property – Array item
11. The old report Data variables for accessing – Literal value – Variable – Object property – Array item
12. The latest report Data variables for accessing – Variable vs Object property • Nearly the same. Thanks to hidden class and jit. • A hidden class is some hint that provide the jit how to access the property data inside a object. – Array item vs Object property • Object is faster than array in dealing with sparse data.
13. What Matters? Loop & Functions
14. Loops for (a in b) / forEach – Loops tests – for (A in B )? • Same: – Pickout A from B each loop – Create reference on the fly • Diff: – foreach use iterator & generator – for-in track whether this property is enumable. – Using normal while/for loop will be better. For / While – For vs While – It is nearly the same
15. Functions Arguments/ Prameters – args vs params – Please using parameters. Function Costs – Function cost • Creating stackframes. • Maintaining local variables. • GC. – Try to inline something
16. Not ready! ASMJS
17. ASMJS ASMJS ? – an extraordinarily optimizable, low-level subset of JavaScript Performance Boost? – fib normal vs asm • Using asmjs slower! (Due to compilation overhead) • DFG etc is enough to find out the data types. – asm vs no-asm Conclusion – Better NOT use it now!
18. Rock & Roll Write simple code ! Do not use asmjs now! Use more hint to ignite the v8/squirrelfish !
19. THANKS FOR YOUR LISTENING