title: Why is this piece of Javascript code so slow?
body: <p>I have this piece of Javascript code, which takes about 600 ms on every call in Internet Explorer. The time taken in other browsers is negligble.</p>
  
  <pre><code>var _nvs_currentTab;
  var _nvs_zoomfield;
  var _nvs_centerfield;
  var _nvs_globsearch;
  var _nvs_category;
  var _nvs_favsonly;
  var _nvs_wishonly;
  var _nvs_friendfavsonly;
  var _nvs_newitemsonly;
  var _nvs_globsearchOld;
  var _nvs_catOld;
  var _nvs_favsonlyOld;
  var _nvs_wishonlyOld;
  var _nvs_friendFavsonlyOld;
  var _nvs_newItemsOnlyOld;
  
  function saveState()
  {
      if (!_nvs_currentTab)
      {
          var f = document.getElementById;
          _nvs_currentTab = f('currentTab');
          _nvs_zoomfield = f('zoomfield');
          _nvs_centerfield = f('centerfield');
          _nvs_globsearch = f("globsearch");
          _nvs_category = f("category");
          _nvs_favsonly = f("favsonly");
          _nvs_wishonly = f("wishonly");
          _nvs_friendfavsonly = f("friendfavsonly");
          _nvs_newitemsonly = f("newitemsonly");
          _nvs_globsearchOld = f("globsearchOld");
          _nvs_catOld = f("categoryOld");
          _nvs_favsonlyOld = f("favsonlyOld");
          _nvs_wishonlyOld = f("wishonlyOld");
          _nvs_friendFavsonlyOld = f("friendFavsonlyOld");
          _nvs_newItemsOnlyOld = f("newItemsOnlyOld");
      }
  
      // get all state vars
      var navState= new Object();
      navState.page = currentPage;
      navState.currentTab = _nvs_currentTab.value;
      navState.zoomfield = _nvs_zoomfield.value;
      navState.centerfield = _nvs_centerfield.value;
      navState.globsearch = _nvs_globsearch.value;
      navState.category = _nvs_category.value;
      navState.favsonly = _nvs_favsonly.checked;
      navState.wishonly = _nvs_wishonly.checked;
      navState.friendfavsonly = _nvs_friendfavsonly.checked;
      navState.newitemsonly = _nvs_newitemsonly.checked;
      navState.globsearchOld = _nvs_globsearchOld.value;
      navState.catOld = _nvs_catOld.value;
      navState.favsonlyOld = _nvs_favsonlyOld.value;
      navState.wishonlyOld = _nvs_wishonlyOld.value;
      navState.friendFavsonlyOld = _nvs_friendFavsonlyOld.value;
      navState.newItemsOnlyOld = _nvs_newItemsOnlyOld.value;
      // build new url with state
      var url = new StringBuffer();
      url.append("#");
      for (var i in navState)
      {
          if (i != "page")
              url.append("&amp;");
          url.append(i).append("=").append(navState[i]);
      }
      // set it
      window.location.href = url.toString();
  }
  </code></pre>
  
  <p>This is what the call tree looks like, from the IE8 profiler:</p>
  
  <pre><code>saveState               1    615,00 ms
    f                    15      1,00 ms
    String.split          1      0,00 ms
      Array               1      0,00 ms
    Object                1      0,00 ms
    StringBuffer          1      0,00 ms
    append               64      0,00 ms
      Array.push         64      0,00 ms
    toString              1      0,00 ms
      Array.join          1      0,00 ms
    Object.valueOf       63      0,00 ms
    Function.toString    63      0,00 ms
  </code></pre>
  
  <p>The StringBuffer implementation I'm using:</p>
  
  <pre><code>function StringBuffer() { 
      this.buffer = []; 
  } 
  
  StringBuffer.prototype.append = function append(string) { 
      this.buffer.push(string); 
      return this; 
  }; 
  
  StringBuffer.prototype.toString = function toString() { 
      return this.buffer.join(""); 
  }; 
  </code></pre>
  
  <p><b>Edit:</b> Updated code, takes 397 ms on average to run.</p>
  
  <pre><code>var _nvs_currentTab;
  var _nvs_zoomfield;
  var _nvs_centerfield;
  var _nvs_globsearch;
  var _nvs_category;
  var _nvs_favsonly;
  var _nvs_wishonly;
  var _nvs_friendfavsonly;
  var _nvs_newitemsonly;
  var _nvs_globsearchOld;
  var _nvs_catOld;
  var _nvs_favsonlyOld;
  var _nvs_wishonlyOld;
  var _nvs_friendFavsonlyOld;
  var _nvs_newItemsOnlyOld;
  
  function saveState()
  {
      if (!_nvs_currentTab)
      {
          var _f = document.guideForm;
          _nvs_currentTab = _f.currentTab;
          _nvs_zoomfield = _f.zoomfield;
          _nvs_centerfield = _f.centerfield;
          _nvs_globsearch = _f.globsearch;
          _nvs_category = _f.category;
          _nvs_favsonly = _f.favsonly;
          _nvs_wishonly = _f.wishonly;
          _nvs_friendfavsonly = _f.friendfavsonly;
          _nvs_newitemsonly = _f.newitemsonly;
          _nvs_globsearchOld = _f.globsearchOld;
          _nvs_catOld = _f.categoryOld;
          _nvs_favsonlyOld = _f.favsonlyOld;
          _nvs_wishonlyOld = _f.wishonlyOld;
          _nvs_friendFavsonlyOld = _f.friendFavsonlyOld;
          _nvs_newItemsOnlyOld = _f.newItemsOnlyOld;
      }
  
      // build new url with state
      var url = new StringBuffer();
      url.append("#");
      url.append('currentPage=').append(currentPage);
      url.append('&amp;currentTab=').append(_nvs_currentTab.value);
      url.append('&amp;zoomfield=').append(_nvs_zoomfield.value);
      url.append('&amp;centerfield=').append(_nvs_centerfield.value);
      url.append('&amp;globsearch=').append(_nvs_globsearch.value);
      url.append('&amp;category=').append(_nvs_category.value);
      url.append('&amp;favsonly=').append(_nvs_favsonly.checked);
      url.append('&amp;wishonly=').append(_nvs_wishonly.checked);
      url.append('&amp;friendfavsonly=').append(_nvs_friendfavsonly.checked);
      url.append('&amp;newitemsonly=').append(_nvs_newitemsonly.checked);
      url.append('&amp;globsearchOld=').append(_nvs_globsearchOld.value);
      url.append('&amp;catOld=').append(_nvs_catOld.value);
      url.append('&amp;favsonlyOld=').append(_nvs_favsonlyOld.value);
      url.append('&amp;wishonlyOld=').append(_nvs_wishonlyOld.value);
      url.append('&amp;friendFavsonlyOld=').append(_nvs_friendFavsonlyOld.value);
      url.append('&amp;newItemsOnlyOld=').append(_nvs_newItemsOnlyOld.value);
      // set it
      window.location.href = url.toString();
  }
  </code></pre>