面向引擎——编写高效率JS
- 2. Briefing What's this topic about 杨琦 UCWEB 浏览器研发部
- 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. Variable Scope Management Scope Chain Matters?
- 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 ?
- 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 Data accessing Matters?
- 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. Loop & Functions What Matters?
- 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. ASMJS Not ready!
- 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. Q&A
- 20. THANKS FOR YOUR LISTENING