Improve the performance of our code jQuery

I've always found interesting article, and any discussion of how to make the code more efficient.
I have always informed each time that I found myself facing a new language, prior to PHP, then Java and then with the jQuery framework. It is not only to optimize response times, or only to make the user experience faster and more engaging.
Learn how to optimize your code is also reflected on the quality of the code itself, something to which I have always held.
I think it's necessary to think of work as a programmer to that of the craftsman, our product is an artifact and as such, may be more or less refined.
There are many ways to achieve the same result, but some are better than others, though not for all projects is vital to be attentive to the performance, always use a good approach, it will be useful in times of need.
There are many online resources on the optimization of jQuery, some tips are ubiquitous, other academics, others seem contradictory, then we do a little order and the second list also signed the direct experience of best practices that we can not give up.

Use the latest version of the framework

Do not be afraid to go to the new version of jQuery, backward compatibility is guaranteed and each release brings significant improvements in performance with the rewriting of sections of the core and perceptible improvements in the most used functions. Only one release to the next for some functions of time talking about executions reduced to 50%. Take a look at the illustration below:

Use the shortcut to the DOM Ready

Instead of:

 



 $ (Document). Ready (function () {/ * logic * /})

 

save some bytes by using its shortcut:

 



 $ (Function () {/ * logic * /});

 

Referring to the logic window load

It is not necessary to write everything in the document ready. Delegates of the logic to perform the loading of the window. For example, binding the click of a button at the end of a long form can relax and wait to be defined.

 $ (Function () {



  



 / / # The logic here







 });







 $ (Window). Load (function () {



  



 $ ("ButtonID"). Click (function () {



    



 / / # This logic to bind the button



  



 });







 });

Minificare scripts

First, I suggest that you install on your Firefox (as addon FireBug ) and the plugin on your Google Chrome Speed ​​Page that you find here . This useful tools as well as give general advice to improve the performance of your page has a valuable feature: minificata version offers all the scripts that you find inside. It also does for CSS and also provides optimized versions of the images, but let us reflect on our heavy jQuery, I attach two screenshots below explain better than a thousand words, what you do:

Google page speed as it appears in firebug:

Clicking on save as minificata get the version of the script:

Minificare each of the scripts on the page that you can take to save tens of KB to download.

• <<
• 1
• 2
• >>