Global Storage vs jQuery w/Cache

Benchmark created by Buzzedword on May 20, 2011

Description

Preparation HTML

<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<div id="data">
Lorizzle ipsizzle daahng dawg sit amet, break it down adipiscing fo shizzle. Nullizzle sapizzle velit, i saw beyonces tizzles and my pizzle went crizzle fo shizzle mah nizzle fo rizzle, mah home g-dizzle, suscipizzle nizzle, black vizzle, things. Pellentesque pot tortizzle. Sed erizzle. Fusce izzle dolor i'm in the shizzle pizzle da bomb crackalackin. Maurizzle bow wow wow nibh shit fo shizzle. Mammasay mammasa mamma oo sa izzle tortizzle. Pellentesque stuff rhoncus bow wow wow. In hizzle shut the shizzle up platea fo shizzle. Donec dapibus. Fo shizzle boom shackalack boom shackalack, pretizzle eu, mattizzle get down get down, eleifend bow wow wow, nunc. Fizzle suscipit. Integizzle sheezy daahng dawg things purus.

Hizzle fizzle dizzle quis break yo neck, yall aliquam mollis. Crazy mah nizzle. Ass odio. Vivamus neque. Dizzle break yo neck, yall. Crizzle maurizzle gizzle, interdizzle a, phat fo shizzle gizzle, mofo izzle, pede. Pellentesque boom shackalack. Vestibulizzle black mi, volutpizzle break it down, boom shackalack sizzle, adipiscing semper, i'm in the shizzle. Dang uhuh ... yih! ipsizzle. Da bomb volutpizzle ma nizzle boofron gangster. Crizzle i saw beyonces tizzles and my pizzle went crizzle justo in purizzle pot ornare. Mofo venenatis justo izzle mammasay mammasa mamma oo sa. Nunc urna. Go to hizzle venenatizzle placerat the bizzle. Curabitizzle fizzle ante. Nunc pharetra, black crazy ass izzle, crunk felis gangsta sizzle, nizzle aliquizzle own yo' felis away pede. Black a nisl. Class aptent taciti sociosqu ad litora torquent per conubia shiz, per bling bling away. Shiznit interdizzle, neque nec elementizzle nonummy, sheezy fizzle check out this leo, in sempizzle mah nizzle arcu get down get down gangsta.

Sizzle ullamcorper. Check it out sagittizzle sure its fo rizzle mauris. Boom shackalack ante ipsizzle gangsta izzle faucibus fo shizzle shizzle my nizzle crocodizzle et phat posuere cubilia Curae; You son of a bizzle get down get down. Fo shizzle mah nizzle fo rizzle, mah home g-dizzle bling bling da bomb mammasay mammasa mamma oo sa senectus izzle hizzle et malesuada stuff ac fizzle black. Donizzle check it out hendrerizzle dang. Aliquizzle erizzle volutpizzle. Vivamizzle black enim, boom shackalack, boofron a, yo vel, arcu. Pot elizzle. Donec fermentizzle, est at fo aliquizzle, go to hizzle daahng dawg sizzle go to hizzle, break it down ullamcorpizzle dope dolizzle pimpin' nibh. Gizzle tellizzle neque, hizzle ut, ornare at, vulputate fizzle, leo. Own yo' purus owned, bibendum sizzle amet, interdum mammasay mammasa mamma oo sa, boom shackalack malesuada, mah nizzle. Aenean eget owned shizzlin dizzle est ullamcorpizzle tincidunt. Donec quizzle. Owned ligula that's the shizzle, tempor mofo, scelerisque nizzle, shut the shizzle up nizzle, felis. Etizzle gravida.

Vestibulum ante gangsta pimpin' izzle faucibizzle black luctizzle izzle ultricizzle posuere ma nizzle Curae; Sizzle vitae nulla quis neque yippiyo aliquizzle. Phasellizzle dope yo mamma. Praesent gangsta accumsizzle . Praesent shizzle my nizzle crocodizzle the bizzle, stuff vitae, gravida sed, fo shizzle i saw beyonces tizzles and my pizzle went crizzle, you son of a bizzle. Etizzle things bibendum mauris. Gizzle yo elizzle et dang laorizzle. Nizzle sed augue. My shizz sagittizzle. Praesent phat funky fresh quis pot posuere adipiscing. Uhuh ... yih! izzle tellus its fo rizzle felizzle tincidunt black. Integer odio. Nizzle scelerisque. Quisque magna erizzle, fizzle vitae, shizznit ac, da bomb gangster, fo. Integer gangsta sodalizzle dang. Etizzle yippiyo gangster sizzle. I saw beyonces tizzles and my pizzle went crizzle fo shizzle my nizzle daahng dawg, izzle, pellentesque vizzle, stuff in, nibh. erat maurizzle, facilisis eu, sollicitudizzle eu, aliquet a, yippiyo. Fusce things risus, away molestie, get down get down izzle, phat sit amet, enizzle.

For sure facilisi. Etiam away pharetra shut the shizzle up. Boofron vulputate sheezy id mauris. Crizzle odio boom shackalack ipsizzle. Curabitur phat nibh ass shiz. Black laoreet, mi gangsta eleifend break it down, dolor sizzle bibendizzle shizzlin dizzle, eu check it out the bizzle mauris egizzle my shizz. Etizzle adipiscing, dang get down get down aliquet , tellizzle nisl lacinia phat, a yo nulla fo shizzle izzle purus. Suspendisse crackalackin mattizzle pede. In crunk mah nizzle. Praesent phat enim, tempor nizzle, crunk nizzle, laorizzle yippiyo, sem. Maurizzle check it out massa quis mammasay mammasa mamma oo sa blandizzle dictum. Dang ullamcorper cool izzle sem tincidunt lobortis. Phasellizzle quis bow wow wow. Bizzle lacinia. Bizzle fermentizzle consequizzle enim. Fo shizzle my nizzle mi. Go to hizzle ipsizzle dolor own yo' amet, bling bling its fo rizzle elit. Maurizzle urna sheezy, convallizzle shizznit, sagittis , shiz , the bizzle. Ma nizzle ipsizzle dolizzle sizzle amet, i saw beyonces tizzles and my pizzle went crizzle fizzle elizzle.

Break yo neck, yall dignissim shut the shizzle up quizzle gangster molestie sizzle. Fo shizzle mah nizzle fo rizzle, mah home g-dizzle hizzle black, dapibus izzle, lobortis daahng dawg, ass izzle, nisl. Sed fo shizzle mah nizzle fo rizzle, mah home g-dizzle. Suspendisse fizzle. Morbi izzle erizzle, boom shackalack sed, bibendizzle nec, fo shizzle my nizzle at, dang. My shizz brizzle dolizzle. The bizzle vizzle crazy. Boom shackalack izzle nibh. Shizznit consequizzle. Donec fo shizzle my nizzle da bomb vizzle phat. Ut things sem my shizz sizzle eleifend eleifend. Fusce pulvinizzle, nibh nizzle vestibulum that's the shizzle, neque libero that's the shizzle brizzle, daahng dawg elementizzle augue nunc lacinia crackalackin. Quisque vestibulizzle sodales phat. Mofo erat volutpat. In sagittis, dui ultricies , massa fo shizzle gravida elizzle, at enizzle metizzle sizzle nibh.
</div>
<script>
  (function($, unknown) {
   // Usage: Instead of $(elem).data('key'), you use $.storage.get('key') for retrieval.
   // Usage: Instead of $(elem).data('key', 'value'), you use $.storage.set('key', 'value') for set.
   $.storage = {
    get: function(key) {
     if (typeof $.storage.db == 'undefined') {
      $.storage.db = document.createDocumentFragment();
     }
     if (typeof $.storage.cache == 'undefined') {
      $.storage.cache = {};
     }
  
     $($.storage.db).data($.storage.cache);
     $.storage.cache = {};
  
     if (typeof key == 'undefined') {
      return $($.storage.db).data();
     } else {
      return $($.storage.db).data(key);
     }
    },
    set: function(key, value) {
     if (typeof $.storage.db == 'undefined') {
      $.storage.db = document.createDocumentFragment();
     }
     if (typeof $.storage.cache == 'undefined') {
      $.storage.cache = {};
     }
  
     if (typeof key == 'undefined' || typeof value == 'undefined') {
      return undefined;
     } else {
      $.storage.cache[key] = value;
      return value;
     }
    }
   };
  }(jQuery));
</script>

Test runner

$('#data').data('key', 'val');
$('#data').data('key');

$.storage.set('key', 'val');
$.storage.get('key');

$('#data').data('key', 'val');
$('#data').data('Key', 'val');
$('#data').data('KEy', 'val');
$('#data').data('keY', 'val');
$('#data').data('KEY', 'val');
$('#data').data();

$.storage.set('key', 'val');
$.storage.set('Key', 'val');
$.storage.set('KEy', 'val');
$.storage.set('keY', 'val');
$.storage.set('KEY', 'val');
$.storage.get();

Revisions

You can edit these tests or add more tests to this page by appending /edit to the URL.

• Revision 1: published by Buzzedword on May 20, 2011