JSFiddle - React, Tailwind, and code Playground
by understore
HTML
<!DOCTYPE html>
<html>
<head>
<title>TodoMVC Benchmark</title>
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script src="https://lhorie.github.io/todomvc-perf-comparison/todomvc-benchmark/resources/benchmark-runner.js" defer></script>
<script defer>
var numberOfItemsToAdd = 100;
var Suites = [];
Suites.push({
name: 'Vue',
url: 'lhorie.github.io/todomvc-perf-comparison/todomvc-benchmark/todomvc/vue/index.html',
version: '0.10.0',
prepare: function (runner, contentWindow, contentDocument) {
return runner.waitForElement('#new-todo').then(function (element) {
element.focus();
return element;
});
},
tests: [
new BenchmarkTestStep('Adding' + numberOfItemsToAdd + 'Items', function (newTodo, contentWindow, contentDocument) {
var app = contentWindow.app;
for (var i = 0; i < numberOfItemsToAdd; i++) {
var keyupEvent = document.createEvent('Event');
keyupEvent.initEvent('keyup', true, true);
keyupEvent.keyCode = 13;
app.newTodo = 'Vue ----------- Something to do ' + i;
newTodo.dispatchEvent(keyupEvent)
}
}),
new BenchmarkTestStep('CompletingAllItems', function (newTodo, contentWindow, contentDocument) {
var checkboxes = contentDocument.querySelectorAll('.toggle');
for (var i = 0; i < checkboxes.length; i++)
checkboxes[i].click();
}),
new BenchmarkTestStep('DeletingAllItems', function (newTodo, contentWindow, contentDocument) {
var deleteButtons = contentDocument.querySelectorAll('.destroy');
for (var i = deleteButtons.length - 1; i > -1; i--)
deleteButtons[i].click();
})
]
});
shuffle(Suites);
</script>
<style>
body {
font-family: 'Lucida Grande','Trebuchet MS','Bitstream Vera Sans',Verdana,Helvetica,sans-serif;
...