« Site name change already! | Main| Email Widget Download fixed »

Optimization and Performance with Dojo

Category    
Bookmark : del.icio.us  Technorati  Digg This  Add To Furl  Add To YahooMyWeb  Add To Reddit  Add To NewsVine 

A future entry will elaborate on this more fully, but here's a quick note about optimizing a page/site for Dojo-based apps. When you build a dojo page like the email widget example with defaults, here's what happens at the browser level.
  1. The dojo.js file gets downloaded from the server. This is a compressed file, but it's also a "good balance" file that the Dojo team put together that incorporates some key functionality. It doesn't have everything in the Dojo library, it isn't a barebones file either. It's about 148KB in size.
  2. The example has a dojo.require statement that downloads the Textbox widget. This is an uncompressed file, and while Dojo gets it for you automatically, it involves a synchronous trip to the server to get this file. It's a 2KB file.
  3. The Textbox widget has its own dependencies declared inside it, including: HtmlWidget, Parse, Manager among others.
  4. and so on...All in all, there are 18 files needed for rendering this email validation widget.
Optimization best practices show us that it's better to go get 1 larger file than a bunch of smaller files. Especially when that one larger file can be made smaller than the total of the smaller files, and when the page can't render anything until all of the file content is downloaded anyway.

So, the Dojo team created a process by which you can do a custom Ant build that will get only the dojo files you need, bundle them all up into 1 dojo.js file and compress it. The next article will compare the default implementation with the optimized one.

In the meantime, here's a couple of good links for how to perform the optimization for your own projects:

Post A Comment

:-D:-o:-p:-x:-(:-):-\:angry::cool::cry::emb::grin::huh::laugh::lips::rolleyes:;-)