Video tutorial illustrating simple tweaks which help optimize / improve the performance of jQuery Applications.
To Optimize
1. Write all javascript programs in an external file and embed it into the html pages.
2. Whenever possible, embed the javascript file at the end of body tag. i.e., just before the closing body tag.
3. It’s also good practice to separate CSS coding to an external file and then embed it to the web pages.
How it helps ?
1. i. If you have thousands of web pages, writing the same code on all the pages and maintaining it and/or modifying it is a touch job.
Having it in an external file helps in re-usability and maintainability.
ii. It only loads the javascript files once and do not load the same files again and again for all other pages, hence saving a lot of bandwidth. Also highly optimizing the load time of web pages.
2. When the parser encounters these javascript files, they stop loading all other elements and allocate all its bandwidth to load javascript file. So writing it at the end of body tag helps. Since all other important elements like images, content will be loaded before these time-consuming javascript files.
Video Tutorial: Optimize / Improve Performance of jQuery Applications
Above video uses Animation of Text and Image: jQuery code to illustrate the optimization concept. If you have not already seen the video, we highly encourage you to watch it and practice it.
In our future tutorials we will be writing most of our javascript code in external file and will be embedding them at the end of body tag. With this tutorial you know why we would do that!