elleestcrimi-masonry

JavaScript performance comparison

Revision 2 of this test case created

Preparation code

<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js">
</script>
<script src="//raw.github.com/Trustious/Trustious-Alpha/trunk/vendor/assets/javascripts/jquery.masonary.js?login=elleestcrimi&token=c4dc7ff620c6457bddaa548dc6548b10">
</script>
<style>
  .masonary-holder .masonary-item { background: blue; } .masonary-holder-2 .masonary-item
  { background: red; } .masonary-holder-2, .masonary-holder { margin-bottom: 20px;
  border-bottom: 2px solid black } .masonary-item { display: inline-block; width: 198px;
  height: 200px; border: 1px solid #000; } .masonary-item:nth-child(3n) { height: 100px
  } .masonary-item:nth-child(even) { height: 300px; }
</style>
<script>
Benchmark.prototype.setup = function() {
    $('body').append('<div class="masonary-holder"></div>');
    var holder = $('.masonary-holder')
    for (i = 0; i < 1000; i++) holder.append('<div class="masonary-item"')
};

Benchmark.prototype.teardown = function() {
    $('.masonary-holder').remove()
};
</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
Vertical Masonary
$('.masonary-holder').vertical_masonary();
pending…
false
$('.masonary-holder').vertical_masonary();
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