jQuery Cloning

jQuery supports cloning – you can use the clone() method to create a clone of any DOM element in your web page. Here is an example:

var cloneObject = $('#divObject').clone();

The $(document).ready function is called during page render, i.e., while the objects are still being downloaded in the web browser. To reduce CPU utilization while a page is being loaded, you can bind your jQuery functions in the $(window).load event. Note that this event is fired after all objects have been downloaded successfully. This would improve the application performance to a considerable extent as the page load time would be minimized. Other common ways to improve jQuery performance are by compressing the scripts and limiting DOM manipulation as much as possible.

Consider the following piece of code that appends a DOM element inside a loop:

for (var ctr=0; ctr<=rows.length; ctr++)
{
$('#tableObject').append(''+rows[ctr]+'');
}

The above code can be replaced by a more efficient piece of code to minimize DOM manipulation and hence improve application performance as shown below:

var str = '';
for (var x=0; x<=rows.length; x++)
{
str += ''+rows[x]+'';
}
$('#tableObject').append(str);