Wrox Programmer Forums

Need to download code?

View our list of code downloads.

Go Back   Wrox Programmer Forums > Web Programming > JavaScript > BOOK: Professional JavaScript for Web Developers 2nd edition ISBN: 9780470227800
Password Reminder
Register
Register | FAQ | Members List | Calendar | Search | Today's Posts | Mark Forums Read
BOOK: Professional JavaScript for Web Developers 2nd edition ISBN: 9780470227800
This is the forum to discuss the Wrox book Professional JavaScript for Web Developers, 2nd Edition by Nicholas C Zakas; ISBN: 9780470227800
Welcome to the p2p.wrox.com Forums.

You are currently viewing the BOOK: Professional JavaScript for Web Developers 2nd edition ISBN: 9780470227800 section of the Wrox Programmer to Programmer discussions. This is a community of tens of thousands of software programmers and website developers including Wrox book authors and readers. As a guest, you can read any forum posting. By joining today you can post your own programming questions, respond to other developers’ questions, and eliminate the ads that are displayed to guests. Registration is fast, simple and absolutely free .
DRM-free e-books 300x50
 
 
Thread Tools Display Modes
  #1 (permalink)  
Old January 29th, 2009, 10:04 PM
jminatel's Avatar
Wrox Staff
Points: 17,437, Level: 57
Points: 17,437, Level: 57 Points: 17,437, Level: 57 Points: 17,437, Level: 57
Activity: 0%
Activity: 0% Activity: 0% Activity: 0%
 
Join Date: May 2003
Location: Indianapolis, IN, USA.
Posts: 1,933
Thanks: 57
Thanked 128 Times in 97 Posts
Default Article: JavaScript Best Practices: Performance - Be Scope-Aware

This article is exerpted from chapter 20 "Best Practices" of the Wrox book Professional JavaScript for Web Developers, 2nd Edition by Nicholas C Zakas and is reused by permission of the publisher. This may not be reused without publisher permission.Be Scope Aware
Chapter 4 discussed the concept of scopes in JavaScript and how the scope chain works. As the number of scopes in the scope chain increases, so does the amount of time to access variables outside of the current scope. It is always slower to access a global variable than it is to access a local variable because the scope chain must be traversed. Anything you can do to decrease the amount of time spent traversing the scope chain will increase overall script performance.
Avoid Global Lookups
Perhaps the most important thing you can do to improve the performance of your scripts is to be wary of global lookups. Global variables and functions are always more expensive to use than local ones because they involve a scope chain lookup. Consider the following function:
javascript Code:
function updateUI(){
    var imgs = document.getElementsByTagName("img");
    for (var i=0, len=imgs.length; i < len; i++){
        imgs[i].title = document.title + " image " + i;
    }
 
    var msg = document.getElementById("msg");
    msg.innerHTML = "Update complete.";
}
This function may look perfectly fine, but it has three references to the global document object. If there are a large number of images on the page, the document reference in the for loop could get executed dozens or hundreds of times, each time requiring a scope chain lookup. By creating a local variable that points to the document object, you can increase the performance of this function by limiting the number of global lookups to just one:
javascript Code:
function updateUI(){
    var doc = document;
    var imgs = doc.getElementsByTagName("img");
    for (var i=0, len=imgs.length; i < len; i++){
        imgs[i].title = doc.title + " image " + i;
    }
 
    var msg = doc.getElementById("msg");
    msg.innerHTML = "Update complete.";
}
Here, the document object is first stored in the local doc variable. The doc variable is then used in place of document throughout the rest of the code. There’s only one global lookup in this function, compared to the previous version, ensuring that it will run faster.
A good rule of thumb is to store any global object that is used more than once in a function as a local variable.
Avoid the with Statement
The with statement should be avoided where performance is important. Similar to functions, the with statement creates its own scope and therefore increases the length of the scope chain for code executed within it. Code executed within a with statement is guaranteed to run slower than code executing outside, because of the extra steps in the scope chain lookup.
It is rare that the with statement is required, as it is mostly used to eliminate extra characters. In most cases, a local variable can be used to accomplish the same thing without introducing a new scope. Here is an example:
javascript Code:
function updateBody(){
    with(document.body){
        alert(tagName);
        innerHTML = "Hello world!";
    }
}
This code uses a with statement to use document.body more easily. The same effect can be achieved by using a local variable, as follows:
javascript Code:
function updateBody(){
    var body = document.body
    alert(body.tagName);
    body.innerHTML = "Hello world!";
}
Although this code is slightly longer, it reads better than the with statement, ensuring that you know the object to which tagName and innerHTML belong. This code also saves global lookups by storing document.body in a local variable.
__________________
Jim Minatel
Associate Publisher, WROX - A Wiley Brand
Blog: http://p2p.wrox.com/content/blogs/jminatel
Wrox on Twitter: http://twitter.com/wrox
Did someone here help you? Click on their post!
 


Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is Off
HTML code is Off
Trackbacks are Off
Pingbacks are On
Refbacks are Off

Similar Threads
Thread Thread Starter Forum Replies Last Post
New JavaScript DOM article posted jminatel Javascript 0 August 26th, 2006 01:43 PM
Error in BLL.Article.Article.cs drohm BOOK: ASP.NET 2.0 Website Programming Problem Design Solution ISBN: 978-0-7645-8464-0 2 August 14th, 2006 09:56 AM
2nd new article today: JavaScript and the DOM jminatel Javascript 0 March 23rd, 2006 02:58 PM
Javascript Scope of Variables. minhtam Javascript 2 January 7th, 2006 09:27 PM



All times are GMT -4. The time now is 10:40 PM.


Powered by vBulletin®
Copyright ©2000 - 2017, Jelsoft Enterprises Ltd.
© 2013 John Wiley & Sons, Inc.