GitHub
/
Vue.js
7
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

make reorder benchmark valid html

dev
Evan You 9 years ago
parent
959a95999a
commit
caf2828c62
1 changed files with 101 additions and 92 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 61
      benchmarks/reorder-list/index.html

61
benchmarks/reorder-list/index.html
View File

@ -1,12 +1,19 @@
<script src="https://cdn.jsdelivr.net/lodash/4.10.0/lodash.min.js"></script> <!DOCTYPE html>
<script src="../../dist/vue.min.js"></script> <html lang="en">
<style> <head>
.danger { <meta charset="utf-8">
<title>Vue benchmark</title>
</head>
<body>
<script src="https://cdn.jsdelivr.net/lodash/4.10.0/lodash.min.js"></script>
<script src="../../dist/vue.min.js"></script>
<style>
.danger {
background-color: red; background-color: red;
} }
</style> </style>
<script type="text/x-template" id="t"> <script type="text/x-template" id="t">
<div> <div>
<h1>{{ total }} Components</h1> <h1>{{ total }} Components</h1>
<p>{{ action }} took {{time}}ms.</p> <p>{{ action }} took {{time}}ms.</p>
@ -21,9 +28,9 @@
</row> </row>
</table> </table>
</div> </div>
</script> </script>
<script type="text/x-template" id="row"> <script type="text/x-template" id="row">
<tr> <tr>
<td class="col-md-1">{{item.id}}</td> <td class="col-md-1">{{item.id}}</td>
<td class="col-md-4"> <td class="col-md-4">
@ -33,24 +40,24 @@
<button @click="$emit('remove')">remove</button> <button @click="$emit('remove')">remove</button>
</td> </td>
</tr> </tr>
</script> </script>
<div id="el"> <div id="el">
</div> </div>
<script> <script>
var total = 1000 var total = 1000
var items = [] var items = []
for (var i = 0; i < total; i++) { for (var i = 0; i < total; i++) {
items.push({ items.push({
id: i, id: i,
label: String(Math.random()).slice(0, 5) label: String(Math.random()).slice(0, 5)
}) })
} }
var s = window.performance.now() var s = window.performance.now()
console.profile('render') console.profile('render')
var vm = new Vue({ var vm = new Vue({
el: '#el', el: '#el',
template: '#t', template: '#t',
data: { data: {
@ -83,13 +90,13 @@ var vm = new Vue({
template: '#row' template: '#row'
} }
} }
}) })
setTimeout(function () { setTimeout(function () {
vm.time = window.performance.now() - s vm.time = window.performance.now() - s
console.profileEnd('render') console.profileEnd('render')
}, 0) }, 0)
function monitor (action, fn) { function monitor (action, fn) {
return function () { return function () {
var s = window.performance.now() var s = window.performance.now()
fn.apply(this, arguments) fn.apply(this, arguments)
@ -98,5 +105,7 @@ function monitor (action, fn) {
vm.time = window.performance.now() - s vm.time = window.performance.now() - s
}) })
} }
} }
</script> </script>
</body>
</html>

Write Preview
Loading…
Cancel
Save