jsPerf.app is an online JavaScript performance benchmark test runner & jsperf.com mirror. It is a complete rewrite in homage to the once excellent jsperf.com now with hopefully a more modern & maintainable codebase.
jsperf.com URLs are mirrored at the same path, e.g:
https://jsperf.com/negative-modulo/2
Can be accessed at:
https://jsperf.app/negative-modulo/2
Compared Mustache.js, Handlebars.js and templayed.js without template caching.
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script src="https://raw.github.com/janl/mustache.js/master/mustache.js"></script>
<script src="http://cloud.github.com/downloads/wycats/handlebars.js/handlebars-1.0.0.beta.6.js"></script>
<script src="https://raw.github.com/archan937/templayed.js/master/releases/0.1.1/templayed.js"></script>
<script id="template" type="text/template">
<tr valign="top">
<td width="580px">
<div identifier="iden1" class="kung_foo tribute dropdown" style="padding-top: 7px">
<div class="bar">
<label for="for1" class="name">Hallo * </label>
<div class="foo_bar">
<select name="name1" identifier="iden1" id="id">
<option></option>
{{#options}}
<option value="{{id}}">{{value}}</option>
{{/options}}
</select>
</div>
</div>
</div>
</td>
</tr>
<tr valign="top">
<td width="580px">
<div identifier="iden1" class="kung_foo tribute yesno">
<div class="bar">
<label for="for1" class="name">Hi </label>
<div class="foo_bar">
<ul class="horizontal">
<li class="first">
<input type="radio" value="Yes" name="name1" id="id"> Yes way
</li>
<li class="">
<input type="radio" value="No" name="name1" id="id"> No way
</li>
</ul>
</div>
</div>
</div>
</td>
</tr>
<tr valign="top">
<td width="580px">
<div identifier="iden1" class="kung_foo tribute something">
<div class="bar">
<label for="for1" class="name">Alo * </label>
<div class="foo_bar">
<input type="things" value="" size="255" name="name1" maxlength="255" identifier="iden1" id="id1" class="things">
</div>
</div>
</div>
</td>
</tr>
<tr valign="top">
<td width="580px">
<div identifier="iden1" class="kung_foo tribute something">
<div class="bar">
<label for="for1" class="name">Bonjour </label>
<div class="foo_bar">
<input type="things" value="" size="255" name="name1" maxlength="255" id="id1" class="things">
</div>
</div>
</div>
</td>
</tr>
<tr valign="top">
<td width="580px">
<div identifier="iden1" class="kung_foo tribute something">
<div class="bar">
<label for="for1" class="name">Oi * </label>
<div class="foo_bar">
<input type="things" value="" size="255" name="name1" maxlength="255" id="id1" class="things">
</div>
</div>
</div>
</td>
</tr>
<tr valign="top">
<td width="580px">
<div identifier="iden1" class="kung_foo tribute date_things_field">
<div class="bar">
<label for="for1" class="name">Bye * </label>
<div class="foo_bar">
<input type="things" value="" style="width: 30px" placeholder="dd" name="name1" maxlength="2" id="id">
<input type="things" value="" style="width: 30px" placeholder="mm" name="name1" maxlength="2" id="id">
<input type="things" value="" style="width: 42px" placeholder="jjjj" name="name1" maxlength="4" id="id">
</div>
</div>
</div>
</td>
</tr>
<tr valign="top">
<td width="580px">
<div identifier="iden1" class="kung_foo tribute email">
<div class="bar">
<div class="foo_bar">
<label for="" class="name">Dag * </label> <input type="things" value="" size="30" name="name1" id="id">
</div>
</div>
</div>
</td>
</tr>
<tr valign="top">
<td width="580px">
<div identifier="iden1" class="kung_foo tribute postcode">
<div class="bar">
<label for="for1" class="name">Doei * </label>
<div class="foo_bar">
<input type="things" style="width: 40px" size="4" name="name1" maxlength="4" identifier="iden1" id="id1" class="things">
<input type="things" style="width: 30px" size="2" name="name1" maxlength="2" identifier="iden1" id="id1" class="things">
</div>
</div>
</div>
</td>
</tr>
<tr valign="top">
<td width="580px">
<div identifier="iden1" class="kung_foo tribute combined_something">
<div class="bar">
<label for="for1" class="name">Later </label>
<div class="foo_bar">
<input type="things" style="width: 50px" size="255" name="name1" maxlength="255" identifier="iden1" id="id1" class="things">
<input type="things" value="" style="width: 40px" size="255" name="name1" maxlength="255" identifier="iden1" id="id1" class="things">
</div>
</div>
</div>
</td>
</tr>
<tr valign="top">
<td width="580px">
<div identifier="iden1" class="kung_foo tribute something">
<div class="bar">
<label for="for1" class="name">Toodles * </label>
<div class="foo_bar">
<input type="things" value="" size="255" name="name1" maxlength="255" id="id1" class="things">
</div>
</div>
</div>
</td>
</tr>
<tr valign="top">
<td width="580px">
<div identifier="iden1" class="kung_foo tribute something">
<div class="bar">
<label for="for1" class="name">Cya * </label>
<div class="foo_bar">
<input type="things" value="" size="255" name="name1" maxlength="255" id="id1" class="things">
</div>
</div>
</div>
</td>
</tr>
<tr valign="top">
<td width="580px">
<div identifier="iden1" class="kung_foo tribute something">
<div class="bar">
<label for="for1" class="name">Au revoir </label>
<div class="foo_bar">
<input type="things" value="" size="255" name="name1" maxlength="255" id="id1" class="things">
</div>
</div>
</div>
</td>
</tr>
<tr valign="top">
<td width="580px">
<div identifier="iden1" class="kung_foo tribute something">
<div class="bar">
<label for="for1" class="name">Groetjes </label>
<div class="foo_bar">
<input type="things" value="" size="255" name="name1" maxlength="255" id="id1" class="things">
</div>
</div>
</div>
</td>
</tr>
<tr valign="top">
<td width="580px">
<div identifier="iden1" class="kung_foo tribute something">
<div class="bar">
<label for="for1" class="name">Greetings </label>
<div class="foo_bar">
<input type="things" size="255" name="name1" maxlength="255" id="id1" class="things">
</div>
</div>
</div>
</td>
</tr>
<tr valign="top">
<td width="580px">
<div identifier="iden1" class="kung_foo tribute something">
<div class="bar">
<label for="for1" class="name">Greets </label>
<div class="foo_bar">
<input type="things" value="" size="255" name="name1" maxlength="255" id="id1" class="things">
</div>
</div>
</div>
</td>
</tr>
<tr valign="top">
<td width="580px">
<div identifier="iden1" class="kung_foo tribute things">
<div class="bar">
<label for="for1" class="name">Bye bye * </label>
<div class="foo_bar">
<thingsarea rows="20" name="name1" id="id1" cols="40" class="normal"></thingsarea>
</div>
</div>
</div>
<div style="clear:both"></div>
</td>
</tr>
</script>var template = document.getElementById("template").innerHTML;
var variables = {"options": [{id: 1, value: "Hello world!"}]};
Mustache.clearCache();Ready to run.
| Test | Ops/sec | |
|---|---|---|
| Mustache.js | | ready |
| Handlebars.js | | ready |
| templayed.js | | ready |
You can edit these tests or add more tests to this page by appending /edit to the URL.