[sgmb id=3]
By following the below you can optimize the Javascript code for performance. For more insight follow the links mentioned in the article.
Minimize DOM access, and try to work as much as possible in JavaScript code.
Use local variables to store DOM references you’ll access repeatedly.
Be careful when dealing with HTML collections because they represent the live, underlying document.
Cache the collection length into a variable and use it when iterating, and make a copy of the collection into an array for heavy work on collections.
Read more about DOM minimization here,
https://www.learnsteps.com/javascript-increase-performance-by-handling-dom-with-care/
We must always try to load JS at the end as it will not hinder the loading of other resources and made the page more responsive.
Minimize the script tags and write them where they require of do the dynamic loading. Its all up to you how you tame the monster.
Read about dynamic loading here.
https://www.learnsteps.com/javascript-increasing-performance-using-dynamic-loading/
Literal values and local variables are faster to accessible than Array and objects.
Local variables are faster to access as they are in first level of scope chain and Global are slowest as they exist in last level.
Avoid with and try catch exception as they are put local variables in second level of scope chain.
Nested object members incur significant performance impact and should be minimized.
The deeper into the prototype chain that a property or method exists, the slower it is to access.
Read more about scopes and performance below.
https://www.learnsteps.com/javascript-increasing-performance-by-handling-scopes-smartly/
We must not make browser calculate reflow and repaint.
This increases the performance and make your web app more responsive. Be mindful of repaints and reflows.
Batch style changes , manipulate the DOM tree “offline,” and cache and minimize access to layout informations.
Read more about repaint reflow and DOM below.
https://www.learnsteps.com/javascript-understanding-repaint-and-reflow-of-dom-for-increasing-performance/
These were few points by following which you can increase the performance of you web applications. Please mention in comment if you want to suggest more.
