Skip to content

Commit 59d82f6

Browse files
yangxiuxiu1115yangxiuxiu1115
committed
Merge branch 'fix/slots' of github.com:yangxiuxiu1115/core-vapor into fix/slots
2 parents b2abdfb + 1c32405 commit 59d82f6

File tree

20 files changed

+747
-105
lines changed

20 files changed

+747
-105
lines changed

‎.github/workflows/ci.yml

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -62,8 +62,6 @@ jobs:
6262
run: pnpm run test-dts
6363

6464
release:
65-
concurrency:
66-
group: release
6765
runs-on: ubuntu-latest
6866
needs: [unit-test, lint-and-test-dts]
6967
permissions:

‎benchmark/.gitignore

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
results/*

‎playground/src/bench/App.vue renamed to ‎benchmark/client/App.vue

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,10 @@
1-
<script setup lang="ts">
2-
import { ref, shallowRef } from 'vue'
1+
<script setup lang="ts" vapor>
2+
import { ref, shallowRef } from '@vue/vapor'
33
import { buildData } from './data'
44
import { defer, wrap } from './profiling'
55
6+
const isVapor = !!import.meta.env.IS_VAPOR
7+
68
const selected = ref<number>()
79
const rows = shallowRef<
810
{
@@ -75,14 +77,14 @@ async function bench() {
7577
</script>
7678

7779
<template>
78-
<h1>Vue.js Vapor Benchmark</h1>
80+
<h1>Vue.js ({{ isVapor ? 'Vapor' : 'Virtual DOM' }}) Benchmark</h1>
7981
<div
8082
id="control"
8183
style="display: flex; flex-direction: column; width: fit-content; gap: 6px"
8284
>
8385
<button @click="bench">Benchmark mounting</button>
8486
<button id="run" @click="run">Create 1,000 rows</button>
85-
<button id="runlots" @click="runLots">Create 10,000 rows</button>
87+
<button id="runLots" @click="runLots">Create 10,000 rows</button>
8688
<button id="add" @click="add">Append 1,000 rows</button>
8789
<button id="update" @click="update">Update every 10th row</button>
8890
<button id="clear" @click="clear">Clear</button>

‎playground/src/bench/data.ts renamed to ‎benchmark/client/data.ts

File renamed without changes.

‎benchmark/client/index.html

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
<!doctype html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
6+
<title>Vue Vapor Benchmark</title>
7+
<style>
8+
html {
9+
color-scheme: light dark;
10+
}
11+
</style>
12+
</head>
13+
<body>
14+
<div id="app"></div>
15+
<script type="module" src="./index.ts"></script>
16+
</body>
17+
</html>

‎benchmark/client/index.ts

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
if (import.meta.env.IS_VAPOR) {
2+
import('./vapor')
3+
} else {
4+
import('./vdom')
5+
}

‎benchmark/client/profiling.ts

Lines changed: 79 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,79 @@
1+
/* eslint-disable no-console */
2+
/* eslint-disable no-restricted-syntax */
3+
/* eslint-disable no-restricted-globals */
4+
5+
declare module globalThis {
6+
let doProfile: boolean
7+
let recordTime: boolean
8+
let times: Record<string, number[]>
9+
}
10+
11+
globalThis.recordTime = true
12+
globalThis.doProfile = false
13+
14+
export const defer = () => new Promise(r => requestIdleCallback(r))
15+
16+
const times: Record<string, number[]> = (globalThis.times = {})
17+
18+
export function wrap(
19+
id: string,
20+
fn: (...args: any[]) => any,
21+
): (...args: any[]) => Promise<void> {
22+
return async (...args) => {
23+
if (!globalThis.recordTime) {
24+
return fn(...args)
25+
}
26+
27+
document.body.classList.remove('done')
28+
29+
const { doProfile } = globalThis
30+
await defer()
31+
32+
doProfile && console.profile(id)
33+
const start = performance.now()
34+
fn(...args)
35+
36+
await defer()
37+
const time = performance.now() - start
38+
const prevTimes = times[id] || (times[id] = [])
39+
prevTimes.push(time)
40+
41+
const { min, max, median, mean, std } = compute(prevTimes)
42+
const msg =
43+
`${id}: min: ${min} / ` +
44+
`max: ${max} / ` +
45+
`median: ${median}ms / ` +
46+
`mean: ${mean}ms / ` +
47+
`time: ${time.toFixed(2)}ms / ` +
48+
`std: ${std} ` +
49+
`over ${prevTimes.length} runs`
50+
doProfile && console.profileEnd(id)
51+
console.log(msg)
52+
const timeEl = document.getElementById('time')!
53+
timeEl.textContent = msg
54+
55+
document.body.classList.add('done')
56+
}
57+
}
58+
59+
function compute(array: number[]) {
60+
const n = array.length
61+
const max = Math.max(...array)
62+
const min = Math.min(...array)
63+
const mean = array.reduce((a, b) => a + b) / n
64+
const std = Math.sqrt(
65+
array.map(x => Math.pow(x - mean, 2)).reduce((a, b) => a + b) / n,
66+
)
67+
const median = array.slice().sort((a, b) => a - b)[Math.floor(n / 2)]
68+
return {
69+
max: round(max),
70+
min: round(min),
71+
mean: round(mean),
72+
std: round(std),
73+
median: round(median),
74+
}
75+
}
76+
77+
function round(n: number) {
78+
return +n.toFixed(2)
79+
}

‎benchmark/client/vapor.ts

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
import { createVaporApp } from '@vue/vapor'
2+
import App from './App.vue'
3+
4+
createVaporApp(App as any).mount('#app')

‎benchmark/client/vdom.ts

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
import { createApp } from 'vue'
2+
import App from './App.vue'
3+
4+
createApp(App).mount('#app')

0 commit comments

Comments
 (0)