Impossible to work out which revision is most authoritative

[SamHasler]

There are currently 628 revisions of this test case:

http://jsperf.com/dom-vs-innerhtml-based-templating

Without looking at a lot of revisions it's hard to work out which revision has the most up-to-date data with the largest browser coverage.

I'd like to be able to immediately see:

• Which revision has the most results.
• What browsers has each revision been tested against.
• What testcases it includes.
• Which has the most comments.
• Which has the most views.
• What is the forking structure; which revision has the most revisions based off it.

[jdalton]

I believe @mathiasbynens has expressed not wanting to complicate jsPerf with a voting system.

[andrewchilds]

I think something like this would be nice:

Crappy CSS for that here:

.browsers-tested {
    float: left;
    left: -26px;
    position: relative;
}

.browsers-tested span {
    display: inline-block;
    margin: 0 2px;
    width: 16px;
    height: 16px;
    opacity: 0.2;
}

.browsers-tested span.tested {
    opacity: 1;
}

.test-count {
    color: #aaa;
    display: inline-block;
    float: left;
    left: -26px;
    margin-right: 12px;
    position: relative;
    text-align: right;
    width: 100px;
}

.browsers-tested .chrome {
    background: url(http://files.softicons.com/download/social-media-icons/favico-icons-by-qishui/png/16x16/Google_Chrome.png) no-repeat scroll 0 0;
}

.browsers-tested .firefox {
    background: url(http://files.softicons.com/download/application-icons/browsers-icons-by-morcha-design/png/16/Firefox.png) no-repeat scroll 0 0;
}

.browsers-tested .internet-explorer {
    background: url(http://megaicons.net/static/img/icons_sizes/57/152/16/internet-ie-icon.png) no-repeat scroll 0 0;
}

.browsers-tested .safari {
    background: url(http://www.noonnoo.com/downloads/browsers/safari\(16x16\).png) no-repeat scroll 0 0;
}

.browsers-tested .other {
    background: url(http://files.softicons.com/download/toolbar-icons/gion-icons-by-silvestre-herrera/png/16x16/apps/internet-web-browser.png) no-repeat scroll 0 0;
}

Crappy JS to generate that template here:

$('h2:contains("Revisions")').parent().find('li a').before('<span class="test-count">123 tests run</span><span class="browsers-tested"><span class="chrome tested"></span><span class="firefox tested"></span><span class="internet-explorer tested"></span><span class="safari tested"></span><span class="other tested"></span></span>');

[mathiasbynens]

@andrewchilds That does look very useful! A problem with this is that the “number of tests completed” is Browserscope data to which we don’t have direct access in our database. We might be able to load it in through their JSON API in the front-end, but that still wouldn’t be ideal, as it would currently take 1 HTTP request for each test revision.