From this presentation, I picked up a few more tidbits. Never use the with statement. When it’s used, the javascript processor will have to examine the object (up the prototype chain) and the scope (up the scope chain) leading to expensive look-ups.

Never use eval if possible. This includes sending javascript strings to setTimeout and setInterval. Evaluated code must be compiled and interpreted.

Also this post discusses the potential security concerns and memory leaks associated with innerHTML.

Lastly, I want to point out an old tool that I was recently asked about for an IE6 problem. Drip can be useful for detecting those IE6 problems.

Back-end architecture and server-side information:
The site is hosted using the common LAMP software solution stack controlled and maintained via cPanel and ssh access.

It runs Joomla 1.5, a free open source CMS and MVC web application framework.

A modifed version of minify, another PHP tool, optimally delivers the site’s JavaScript and CSS. The site also incorporates most of the YSlow and Google Page Speed best practices.

To futher optimize the ouput, the modified version of minify invokes YUI compressor, a Java tool, a further compresses the JavaScript and CSS using techniques such as local symbol replacement.

User Interface Design Choices:
The front end compromises several interesting features – many from the YUI Library.

Since all page transitions are controlled via Ajax giving a visitor that fastest, most fluid user experience, the browser history manager tracks the state of the application at all times so that the forward and back buttons maintain their functionality across all “A” grade browsers.

As the user hovers over points of interest in the application, the tooltip provides and draws attention to relevant, contextual information.

The local market data is tied to a data store of all the known markets. As the user types, the field offers autocompletion regardless of whether the user searches by city or zip code.

The chart itself is created dynamically using the Google Chart API and then watermarked using the PHP GD library. The results are cached for set intervals.

The tabs of the market data provide convenient views in a small amount of space.

Dialogs and modal panels with shadow overlays engage the user during specific actions to maximize their attention.

The weather module provides useful information about current, local weather from the National Weather Service. PHP parses their freely available XML data feeds and stores the results.

Both the weather and the market data are customized further depending upon how the user enters the page. The site is part of a Google Adwords Campaign and as such, if the visitor enters with certain information in the URL (passed as GET variables based on their Google search), the user will see customized results for both the weather and market data. Compare http://www.c21gt.com/?kw=Springfield to http://www.c21gt.com/?kw=19081. The server will also reverse lookup school district information to location to account for those searches.

The layout of the page is controlled via CSS. Some points of notes are the sprited images and the image-free rounded corners.

For many, more details about the site and several features not discussed, please feel free to contact me. Walk-throughs are available via dimdim