JavaScript Speed Test 4.0 - The Real World

JavaScript Speed Test 1.0 - All Math, all the time
JavaScript Speed Test 2.0 - Math, Strings, and Arrays ... Oh my!
JavaScript Speed Test 3.0 - Cutting Netscape a break
JavaScript Speed Test 4.0 - The Real World

Alright, I've finally done what I should have done in the first place: built a JavaScript test that simulates some of the langauge's most common uses.

In this version, the script does the following:

makes up email addresses, some valid and some not, validates them against a regular expression, and logs the result
makes up U.S. ZIP codes, some valid and some not, validates them against some simple string functions, and logs the result
checks a text input to make sure it has content, which it sometimes does and sometimes does not, and logs the result
changes the background color of a <div> progressively through the 256 "Web-safe" colors a hundred times or so (we skip this test in Netscape 4.x because it doesn't understand the getElementById() method)
populates a select list with values then empties it 50 times or so
performs an image rollover a couple hundred times

That should do it! This test strives to be realistic by using functions you would find in common Web pages. It also tries to exaggerate the results by looping over the functions hundreds of times in an effort to make it more clear which browsers are faster at interpreting JavaScript.

letters = new Array("a","b","c","d","e","f","g","h","i","j","k","l","m","n","o","p","q","r","s","t","u","v","w","x","y","z");
numbers = new Array(1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26);
colors  = new Array("FF","CC","99","66","33","00");

function doTest()
{
   sob = document.forms[0].timeStart;
   eob = document.forms[0].timeEnd;
   dob = document.forms[0].timeDiff;
   rob = document.forms[0].results;
   iob = document.images["imgRollover"];
   lob = document.forms[0].dynaSel;
   tob = document.forms[0].empty;

   // skip this for netscape 4 because it doesn't understand getElementByID()
   (!document.layers)?vob=document.getElementById("changingDiv"):vob=false;

   // clear values
   sob.value = "";
   eob.value = "";
   dob.value = "";
   rob.value = "";
   tob.value = "";
   endResult = "";

   nob   = new Date();
   start = nob.getTime();
   sob.value = nob.toUTCString();

   // make up email address
   for (k=0;k<100;k++)
   {
      name = makeName(6);
      (k%2)?email=name+"@mac.com":email=name+"(at)mac.com";

      // validate the email address
      var pattern = /^[a-zA-Z0-9\-\._]+@[a-zA-Z0-9\-_]+(\.?[a-zA-Z0-9\-_]*)\.[a-zA-Z]{2,3}$/;

      if(pattern.test(email))
      {
         r = email + " appears to be a valid email address.";
         addResult(r);
      }
      else
      {
         r = email + " does NOT appear to be a valid email address.";
         addResult(r);
      }
   }

   // make up ZIP codes
   for (s=0;s<100;s++)
   {
      zipGood = true;
      zip = makeNumber(4);
      (s%2)?zip=zip+"xyz":zip=zip.concat("7");

      // validate the zip code
      if (zip.indexOf("x")>0)
      {
         zipGood = false;
         r = zip + " contains letters.";
         addResult(r);
      }
      if (zip.length>5)
      {
         zipGood = false;
         r = zip + " is longer than five characters.";
         addResult(r);
      }
      if (zipGood)
      {
         r = zip + " appears to be a valid ZIP code.";
         addResult(r);
      }
   }

   // validate the empty input box
   for (t=0;t<100;t++)
   {
      (t%2)?tob.value="Build your barn on a Wednesday.":tob.value="";
      (tob.value=="")?r="The input box is empty. That's no good.":r="The input box contains a value. Yippee!";
      addResult(r);
   }

   // change the div background color
   for (x=0;x<100;x++)
   {
      for (u=0;u<6;u++)
      {
         for (v=0;v<6;v++)
         {
            for (w=0;w<6;w++)
            {
               bgcol = "#" + colors[u] + colors[v] + colors[w];
               if (vob) vob.style.backgroundColor = bgcol;
            }
         }
      }
   }

   // put values in the select list
   for (n=0;n<10;n++)
   {
      // clear the list, except the first entry
      for (q=1;q<lob.options.length;q++)
      {
         lob.options[q].value = null;
      }

      // add the options to the list
      for (p=1;p<letters.length+1;p++)
      {
         lob.options[p] = new Option(letters[p-1],numbers[p-1]);
      }
   }

   // do image rollovers
   for (m=0;m<201;m++)
   {
      (iob.src.indexOf("_bw")>0)?iob.src="girlatbelur.jpg":iob.src="girlatbelur_bw.jpg";
   }

   rob.value = endResult;
   nob = new Date();
   end = nob.getTime();
   eob.value = nob.toUTCString();

   dob.value = (end - start)/1000;
}

function makeName(n)
{
   tmp = "";
   for (i=0;i<n;i++)
   {
      l = Math.floor(26*Math.random());
      tmp += letters[l];
   }
   return tmp;
}

function makeNumber(n)
{
   tmp = "";
   for (i=0;i<n;i++)
   {
      l = Math.floor(9*Math.random());
      tmp = tmp.concat(l);
   }
   return tmp;
}

function addResult(r)
{
   endResult += "\n" + r;
}