PPT模板下载：www.1ppt.com/moban/

Performance on JSPerformance on JS

What's this topic about

Briefing

杨琦 UCWEB 浏览器研发部

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

Scope Chain Matters?

Variable Scope Management

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 ?

Scope Chain ?

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

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)

Data accessing Matters?

Data accessing

Ways of data accessing

Data variables for accessing

– Literal value

– Variable

– Object property

– Array item

The old report

Data variables for accessing

– Literal value

– Variable

– Object property

– Array item

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.

What Matters?

Loop & Functions

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

Functions

Arguments/ Prameters

– args vs params

– Please using parameters.

Function Costs

– Function cost

嗗Creating stackframes.

嗗Maintaining local variables.

嗗GC.

– Try to inline something

Not ready!

ASMJS

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!

Rock & Roll

Write simple code !

Do not use asmjs now!

Use more hint to ignite the v8/squirrelfish !

Q&A

THANKS FOR YOUR LISTENING