CSS load event

Benchmark created by Daniel on


Description

Testing the ability to load a link tag of type CSS with load event support.

Preparation HTML

<script>
  var colors = ['#000000', '#000001', '#000002', '#000003', '#000004', '#000005'];
  
  var loadCSS = function(url, callback) {
   var link = document.createElement('link');
   link.type = 'text/css';
   link.rel = 'stylesheet';
   link.href = url;
  
   document.getElementsByTagName('head')[0].appendChild(link);
  
   var img = document.createElement('img');
   img.onerror = function() {
    var bk = document.body.style.backgroundColor;
    var litmus = callback();
    console.log(bk == litmus, bk, litmus);
    document.head.removeChild(img);
   }
  
   document.head.appendChild(img);
   img.src = url;
  }
</script>

Test runner

Ready to run.

Testing in
TestOps/sec
iterations
var index = Math.floor(Math.random() * 6);
loadCSS('http://www.backalleycoder.com/thinkery/css/' + index + '.css', function() {
 return colors[index];
})
ready
blank
//blank
ready

Revisions

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