Javascript parsing: bootleneck?

August 17th, 2007

While hacking on performance and a soon to be released customer site, it occurred to me that parsing the JavaScript we use is a pretty huge bottleneck. For CSS and JavaScript we use minification and compression and we even use domain aliases to parallel image/resource downloads.

We currently haven’t the templates connected to the CMS yet, but the raw time is currently between 700 and 900ms. Maybe it can be justified because the layout isn’t Web 1.0 style (i.e. many round corners, shadows, etc.).

What puzzled me was the “loading time of JavaScript was around 300ms”, see this picture:

Loading and parsing time of JavaScript

That’s quite a long time. It may is not that good visible from the chart, but nearly everything following the JavaScript is hold until it is read, which delays the complete loading of the rest of the page.

Since behind the scenes the actual request is in reality using Minify, it’s not just plain serving (but for this scenario the JavaScript has already been cached).

So I took a look just at the JavaScript loading, see this:

Just loading, like text.

What’s that? Roughly 30ms vs 300ms?

The only realistic guess I’ve at the moment is: parsing the JavaScript.

This single request loads the following libraries:

  • behaviour
  • prototype
  • scriptaculous (+effects)
  • yui: yahoo-dom-event
  • yui: container_core
  • yui: menu.js
  • our own small JavaScript parts

Maybe I’m too optimistic but it hit me a bit that JavaScript parsing still does take so long. Given that the JavaScript is cached (ideally) things such a huge problem, but still. It was frustrating that I could trim down the >1s request to ~700ms but not further and for most of the part just because it takes as long as it needs it.

Entry Filed under: JS

1 Comment Add your own

  • 1. Thomas Kowalski  |  July 30th, 2009 at 8:23

    In case the stop of the processing the files following the JS is bothering you, take a look at steve souders work (cuzillion). It’s possible to create a script tag using js to start downloading an script without blocking.

Leave a Comment

hidden

Some HTML allowed:
<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Trackback this post  |  Subscribe to the comments via RSS Feed


Calendar

August 2007
M T W T F S S
« Jul   Nov »
 12345
6789101112
13141516171819
20212223242526
2728293031  

Most Recent Posts