xhr image embedding

JavaScript performance comparison

Test case created by Broofa

Preparation code

<img id="dst" />
<script>
Benchmark.prototype.setup = function() {
    xhr = new XMLHttpRequest();
    img = document.getElementById('dst');
    urlBase = 'https://2.gravatar.com/avatar/b072fc2897196b3bafcd337bc9c91e2d?s=140?foo=';
};
</script>

Preparation code output

Test runner

Warning! For accurate results, please disable Firebug before running the tests. (Why?)

Java applet disabled.

Testing in unknown unknown
Test Ops/sec
set to remote url
// async test
var url = urlBase + Math.random();
xhr.open('GET', url);
xhr.onreadystatechange = function() {
  if (xhr.readyState == 4) {
    img.src = url;
    deferred.resolve();
  }
}
xhr.send();
pending…
set to data url
// async test
var url = urlBase + Math.random();
xhr.open('GET', url);
xhr.onreadystatechange = function() {
  if (xhr.readyState == 4) {
    img.src = 'data:image/jpeg;base64,' + btoa(unescape(encodeURIComponent(xhr.response)));
   deferred.resolve();
  }
}
xhr.send();
pending…

Compare results of other browsers

Revisions

You can edit these tests or add even more tests to this page by appending /edit to the URL. Here’s a list of current revisions for this page:

0 comments

Add a comment