Programmers should strive to make their code run fast when possible.
The exact same result in JavaScript can take vastly different amounts of
time when achieved by different means. In order to help out JavaScript
programmers everywhere, I have set up this demo page. You will see
different versions of code and the amount of time each one takes. These
times are calculated live by your browser. A quick pass will calculate
really rough numbers, then they will be updated by a second loop that takes
longer and calculates a somewhat more accurate average.
One key aspect of this page that will likely set it apart from others
along the same vein is that this one is actually performing the good and bad
versions of the code and will give you the live results of the tests as they
are performed.
Dereferencing
If you are looking at document.my_form.some_input_element.value often, it
will be best to store the value to a local variable. This tip was given to
me by a reader of my Huffman
JavaScript Compression page. He said that my code would be sped up by a
factor of 10 when I made this change. He was right. This particular
example is similar and you can obviously tell that using a local variable is
far more efficient.
for (var i = 0; i < 100; i ++) {
a = document.testform.testtext.value;
b = document.testform.testtext.value.length;
c = document.testform.testtext.value.substr(2, 1);
} |
No results yet |
v = document.testform.testtext.value;
for (var i = 0; i < 100; i ++) {
a = v;
b = v.length;
c = v.substr(2, 1);
} |
No results yet |
| Browser | Operating System | Result |
|---|
| Firefox 2.0.0.1 | Windows XP | 5x faster |
| Internet Explorer 7 | Windows XP | 5x to 25x faster |
| Opera 9.10 | Windows XP | 6x faster |
|
Internet Explorer usually provided me with a 20-25x speed increase, but
sometimes it plummetted down to a mere 4 or 5x speed increase. No matter
what, it is clear that it is far faster to use a local variable.
String Concatenation
One other tip that I get a lot is that I should avoid lots of little
string concatenations. I also read that string concatenations get worse
with the size of the string being concatenated. Instead, the little
substrings should be placed into an array and then joined together to make
one big string in the end.
a = '';
b = 'abcdefghijklmnopqrstuvwxyz';
b += 'ABCDEFGHIJKLMNOPQRSTUVWXYZ';
for (var i = 0; i < 500; i ++) {
a += b + b + b + b + b;
} |
No results yet |
a = new Array();
b = 'abcdefghijklmnopqrstuvwxyz';
b += 'ABCDEFGHIJKLMNOPQRSTUVWXYZ';
for (var i = 0; i < 500; i ++) {
a.push(b);
a.push(b);
a.push(b);
a.push(b);
a.push(b);
}
a = a.join(''); |
No results yet |
| Browser | Operating System | Result |
|---|
| Firefox 2.0.0.1 | Windows XP | Questionable |
| Internet Explorer 7 | Windows XP | 6x faster |
| Opera 9.10 | Windows XP | 2x faster |
|
You will notice that FireFox says "Questionable" for the speed increase.
For littler string concatenations, it is actually slower to put the strings
into an array and concatenate them. For larger strings, the speed savings
are negligable.
Server Status: Upgrade went relatively well, but I had issues with the IP & DNS changes. Would you like to know
more?
For all of you experiencing a 502 error when downloading files to your phone, could you
send me a detailed report (phone model, provider, exact error message, type of file you are sending)? I believe that the problem is due to my recent IP change and that it will clear up in a couple days, but I'd rather start collecting information a little earlier in case I need it.