jQuery Performance Guide
There is a very well written guide for jQuery coders that addresses best practice topics for performance. Some key items that I pulled directly from the guide that can be easily integrated into most front end designer's programming habits are:
1. Always Descend From an #id
The fastest selector in jQuery is the ID selector ($('#someid')). This is because it maps directly to a native JavaScript method, getElementById().
2. Use Tags Before Classes
The second fastest selector in jQuery is the Tag selector ($('head')). Again, this is because it maps to a native JavaScript method, getElementsByTagName().
Always prefix a class with a tag name (and remember to descend from an ID):
var active_light = $('#traffic_light input.on');3. Cache jQuery Objects
Get in the habit of saving your jQuery objects to a variable.
save the object to a local variable, and continue your operations:
var $active_light = $('#traffic_light input.on');
$active_light.bind('click', function(){...});
$active_light.css('border', '3px dashed yellow');
$active_light.css('background-color', 'orange');
$active_light.fadeIn('slow');For those of you who want to delve in a little deeper, you should definitely head over to www.artzstudio.com for the complete post. There is a lot of advanced material not covered here with many example code snippets to follow.


0 Comments
Post new comment