This document discusses performance considerations when writing JavaScript code. It covers variable scope management, data accessing, loops and functions, and ASMJS. Regarding variable scope, the scope chain matters less now due to just-in-time compilers. For data accessing, object properties and array items perform similarly. For loops, for-in loops should be avoided and while loops are preferred. When calling functions, using parameters rather than arguments is better. ASMJS is not recommended currently due to compilation overhead outweighing performance benefits. Overall, simple code that provides type hints is best for performance.

1. PPT 模板下载： www.1ppt.com/moban/
Performance on 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 ?

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
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