Search within TutorialsPark

Javascript Best Practices : Performance

Learn the Best Practices to increase the performance of your code.

Javascript Performance : Avoidables

The most important way to improve the performace of you code is to avoid using global scopes, since looking for global variables and functions happen to be more expensive then local lookups because it involves a scope chain lookup.

Another Important avoidables is to avoid Null Comparisons , since it may lead to errors due to insufficent type checking.Instead, values should be checked against a value they must satify and not otherwise.

Avoid Using the with statements, since the width statements creates its own scope and hence increases the length of the scope chain for the code.

Example: Javascript Performance : Avoidables.

Javascript Performance: Optimization of Loops

1. Loops are used quite frequently within JavaScript, optimization of loops is very important to increase the efficiency of the overall code, since loops are run repeatedly.

The Steps involved in optimization of loop are as follows:

Decrement interators : Generally, loops begin with iterator value at 0 and then incremented upto the upperlimit, which is in efficient. Instead it should begin with the upper limit and decrement after each loop.

Simplified Test Condition : The test condition of the loop is checked everytime the loop is executed, hence it must avoid global lookups which make the process expensive.

Simplified loop Body : Even the body of the loop must avoid using expensive scope loopup chain.

Use Post loops : Pre loops like for and while must be avoided in favour of post loops like do-while , because pre evalution of the terminal condition slows the process.

2. For finite sized loops, it is more efficient to not use loops at all and instead use multiple function calls.

3. Another way to increase code performance, is to avoid Double Interpretation of the code, i.e when JavaScript code tries to interpret JavaScript code using eval()

Example: JavaScript Performance : Code Optimization

Javascript Performance: Ways to Improve Performance.

Use Native Methods : Use native methods instead of writing them using JavaScript, for Eg: calculation performed using math(), sin() will execute faster than using JavaScript to perform the work.

Switch instead of if-else : Scripts using switch statements execute faster than the same solutions using if-else

Use Bitwise Operators : For performing mathematical operations, bitwise operations execute faster than boolean operations.

Javascript Performance: Reducing the Number of Statements

The speed of execution also depends on the number of statements used, the fewer the number of statement, faster is the execution of code.

For that purpose, instead of multiple variable declarations use a single variable for all declaration.

Iterative values should always be combined in a single statement whenever possible

While creating arrays, is preferrable to use the literal method over constructor method, since use of a constructor leads to more number of statements and hence increasing the execution time.

Example: JavaScript Performance : Reducing Statement Count

Javascript Performance: Optimizing DOM Interaction.

Minimum Live Updates : A live update is performed when you access the DOM of the page displayed currently. It involves the browser to perform multiple thousands of calculations, thus increasing the execution time.

Use innerHTML : For performing DOM changes, it is more preferrable to use innerHTML than createElement() or appendChild(). However, the effects are significant when the the size of program is large

Use Event Delegation : The speed with wich the page reacts to events is dependent on the no of event handlers on the webpage, any delay causes penalties. To overcome this issue always use event delegation where ever possible.

Avoid HTML Collection : Use of HTMLCollection is always very expensive , since its a query on the document. Hence it must be avoided.

Example: JavaScript Performance : Reducing Statement Count