doing TODAY and not getting caught in the HYPE of tomorrow

Alan Williamson

Subscribe to Alan Williamson: eMailAlertsEmail Alerts
Get Alan Williamson: homepageHomepage mobileMobile rssRSS facebookFacebook twitterTwitter linkedinLinkedIn


AJAXWorld RIA Conference - Speaker Mike Girouard's JavaScript Design Patterns, #2

Load Time Configuration - also known as load time branching

Mike Girouard's Blog

Load time configuration is the process where a JavaScript application configures itself as it is being loaded. This pattern is most commonly found in libraries in which they configure themselves at load time to be optimized for a particular browser.

Load time configuration is also known as load time branching.


The primary motivation behind load time configuration is to optimize conditional operations such as generating XMLHttpRequest instances or adding event listeners. Since both operations vary amongst clients, specific conditions must be checked before proceeding. The load time configuration pattern runs once at load time and sets the resulting value so that it doesn’t need to be checked again.


The most common technique for implementing load time configuration is by way of a Self-invoking function which returns the correctly configured value.

The example below demonstrates how load time configuration can be used to normalize getting an XMLHttpRequest object.

var getXHR = (function () {
if (window.XMLHttpRequest) {
return function () {
return new XMLHttpRequest;
else if (window.ActiveXObject) {
return function () {
/* Msxml2 and Msxml3 checkes have been omitted
* for simplicity's sake */

return new ActiveXObject('Microsoft.XMLHTTP');

First, a getXHR variable is declared and it’s value is being assigned by the self-invoking function that follows. Upon execution, a conditional is run which determines the correct method of obtaining an XMLHttpRequest object. When a match is found, a wrapper function is returned and stored as the value for getXHR variable.


The load time conditional pattern is used to configure a conditional value at load time. The result is a fully optimized value, specific to the the environment in which it is to be used.

More Stories By Michael Girouard

Mike Girouard is a front-end web developer living in New York City. As the Sr. Developer at the creative agency Magnani Caruso Dutton, he takes pride in his ability to introduce web standards and beautiful code to industry giants such as Discover and AT&T. In his offtime, Girouard goes right back to his editor and codes toward his latest open-source baby, Panda PHP Components. You can read more about him and his other projects on his blog,

Comments (0)

Share your thoughts on this story.

Add your comment
You must be signed in to add a comment. Sign-in | Register

In accordance with our Comment Policy, we encourage comments that are on topic, relevant and to-the-point. We will remove comments that include profanity, personal attacks, racial slurs, threats of violence, or other inappropriate material that violates our Terms and Conditions, and will block users who make repeated violations. We ask all readers to expect diversity of opinion and to treat one another with dignity and respect.