File APIs for Java Developers
Manipulate DOC, XLS, PPT, PDF and many others from your application.
The moose likes HTML, CSS and JavaScript and the fly likes Question: Optimizing JavaScript Big Moose Saloon
  Search | Java FAQ | Recent Topics | Flagged Topics | Hot Topics | Zero Replies
Register / Login
JavaRanch » Java Forums » Engineering » HTML, CSS and JavaScript
Bookmark "Question: Optimizing JavaScript" Watch "Question: Optimizing JavaScript" New topic

Question: Optimizing JavaScript

Vijitha Kumara

Joined: Mar 24, 2008
Posts: 3902

Dear Author,

First of all wellcome to JavaRanch....

Is the book explain about optimizing javascripts with examples? Because javascript which are not properly optimized may cause performance issues of a web applications.

Thanks in Advance,

[ August 25, 2008: Message edited by: Vijitha Kumara ]
[ August 26, 2008: Message edited by: Vijitha Kumara ]

[How to ask questions] [Twitter]
Stoyan Stefanov
Ranch Hand

Joined: Jul 16, 2008
Posts: 61
Hi Vijitha, thanks for the welcome words and the question. Funny thing, my daily job at Yahoo! is in the Exceptional Performance team and web optimization is what we do

In the book, there are scattered hints and best practices about optimization, but there's no section specifically dedicated to this topic.

I would put the javascript optimizations into three categories:

  • delivery
  • DOM manipulations
  • low-level micro optimziations

  • The delivery is how the JavaScript code is served to the browser, this is high impact, low effort optimization. All you need to do is:

  • merge all scripts into one file
  • minify the scripts
  • enable gzip compression
  • implement "never expires" policy - add a far future Expires header
  • put scripts at the bottom of the HTML or use an alternative loading technique

  • These are easy wins that give an instant result. Our team has documented these as performance best practices.

    Then you have DOM manipulations, these tend to be the most expensive things you can do in the browser with javascript. You can cache references to DOM elements, update the part of the DOM tree that you need "offline" before you stick it back to the main tree and so on. A really nice resource is this talk here, slides are available too. Responding to browser events is also something I consider in this category.

    Finally there are micro optimizations which are high effort, relatively low impact activities, such as optimizing loops or string concatenations. These will rarely give a noticeable result, unless there are some extremities in the code . Also browsers tend to improve their engines (Firefox just added a JIT compiler to 3.1, IE8 fixed string concatenation among others), so these improvements get even less important with time and may even become counter-optimizations. And if they come at the price of readability and maintainability, they should definitely be avoided.

    <a href="" target="_blank" rel="nofollow">my OOJS book</a>
    Vijitha Kumara

    Joined: Mar 24, 2008
    Posts: 3902

    Thanks a lot for your explanation.
    I agree. Here's the link:
    subject: Question: Optimizing JavaScript
    It's not a secret anymore!