chore: update benchmark

bundle-test/bench.mjs → bench/bundle-test/bundle.bench.ts

@@ -1,5 +1,6 @@
 /* eslint-disable antfu/no-import-dist */
-/* eslint-disable no-console */
+
+import { bench, describe } from 'vitest'
 import { highlight as highlightA } from './dist/index-lite.min.mjs'
 import { highlight as highlightB } from './dist/index-wasm.min.mjs'
 
@@ -19,30 +20,12 @@ function notify() {
 }
 `
 
-async function run() {
-  // Warn up
-  for (let i = 0; i < 200; i++) {
-    await highlightA(code)
-    await highlightB(code)
-  }
-
-  let tA = 0
-  let tB = 0
-
-  const startA = performance.now()
-  for (let i = 0; i < 1000; i++) {
+describe('bundle', () => {
+  bench('js-precompiled', async () => {
     await highlightA(code)
-  }
-  tA += performance.now() - startA
+  })
 
-  const startB = performance.now()
-  for (let i = 0; i < 1000; i++) {
+  bench('wasm', async () => {
     await highlightB(code)
-  }
-  tB += performance.now() - startB
-
-  console.log('A', tA)
-  console.log('B', tB)
-}
-
-run()
+  })
+})

bundle-test/index-lite.ts → bench/bundle-test/index-lite.ts

@@ -7,12 +7,12 @@ const shiki = createShikiInternal(
       import('@shikijs/langs-precompiled/ts'),
     ],
     themes: [
-      import('@shikijs/themes/nord'),
+      import('@shikijs/themes/vitesse-dark'),
     ],
     engine: createJavaScriptRawEngine(),
   },
 )
 
 export async function highlight(code: string): Promise<string> {
-  return codeToHtml(await shiki, code, { lang: 'ts', theme: 'nord' })
+  return codeToHtml(await shiki, code, { lang: 'ts', theme: 'vitesse-dark' })
 }

bundle-test/index-wasm.ts → bench/bundle-test/index-wasm.ts

@@ -7,12 +7,12 @@ const shiki = createShikiInternal(
       import('@shikijs/langs/ts'),
     ],
     themes: [
-      import('@shikijs/themes/nord'),
+      import('@shikijs/themes/vitesse-dark'),
     ],
     engine: createWasmOnigEngine(import('@shikijs/engine-oniguruma/wasm-inlined')),
   },
 )
 
 export async function highlight(code: string): Promise<string> {
-  return codeToHtml(await shiki, code, { lang: 'ts', theme: 'nord' })
+  return codeToHtml(await shiki, code, { lang: 'ts', theme: 'vitesse-dark' })
 }

bench/bundle-test/package.json

@@ -0,0 +1,6 @@
+{
+  "private": true,
+  "scripts": {
+    "bench:prepare": "rollup -c && du -h dist/*"
+  }
+}

bench/engines.bench.ts → bench/engines/engines.bench.ts

@@ -1,20 +1,22 @@
 /* eslint-disable no-console */
 import type { BundledLanguage } from 'shiki'
-import type { ReportItem } from '../scripts/report-engine-js-compat'
+import type { ReportItem } from '../../scripts/report-engine-js-compat'
 import fs from 'node:fs/promises'
-import { createHighlighter, createJavaScriptRegexEngine, createOnigurumaEngine } from 'shiki'
+import { createJavaScriptRawEngine, createJavaScriptRegexEngine } from '@shikijs/engine-javascript'
+import { createHighlighter, createOnigurumaEngine } from 'shiki'
 import { bench, describe } from 'vitest'
 
 const js = createJavaScriptRegexEngine()
+const jsRaw = createJavaScriptRawEngine()
 const wasm = await createOnigurumaEngine(() => import('shiki/wasm'))
 
 const RANGE = [0, 20]
 
 // Run `npx jiti scripts/report-engine-js-compat.ts` to generate the report first
-const report = await fs.readFile(new URL('../scripts/report-engine-js-compat.json', import.meta.url), 'utf-8').then(JSON.parse) as ReportItem[]
+const report = await fs.readFile(new URL('../../scripts/report-engine-js-compat.json', import.meta.url), 'utf-8').then(JSON.parse) as ReportItem[]
 const langs = report.filter(i => i.highlightMatch === true).map(i => i.lang).slice(...RANGE) as BundledLanguage[]
 // Clone https://github.com/shikijs/textmate-grammars-themes to `../tm-grammars-themes`
-const samples = await Promise.all(langs.map(lang => fs.readFile(`../tm-grammars-themes/samples/${lang}.sample`, 'utf-8')))
+const samples = await Promise.all(langs.map(lang => fs.readFile(new URL(`../../tm-grammars-themes/samples/${lang}.sample`, import.meta.url), 'utf-8')))
 
 console.log('Benchmarking engines with', langs.length, 'languages')
 
@@ -30,14 +32,26 @@ const shikiWasm = await createHighlighter({
   engine: wasm,
 })
 
+const shikiJsPrecompiled = await createHighlighter({
+  langs: await Promise.all(langs.map(lang => import(`@shikijs/langs-precompiled/${lang}`))),
+  themes: ['vitesse-dark'],
+  engine: jsRaw,
+})
+
 for (const lang of langs) {
   describe(lang, () => {
+    const code = samples[langs.indexOf(lang)]
+
     bench('js', () => {
-      shikiJs.codeToTokensBase(samples[langs.indexOf(lang)], { lang, theme: 'vitesse-dark' })
+      shikiJs.codeToTokensBase(code, { lang, theme: 'vitesse-dark' })
+    })
+
+    bench('js-precompiled', () => {
+      shikiJsPrecompiled.codeToTokensBase(code, { lang, theme: 'vitesse-dark' })
     })
 
     bench('wasm', () => {
-      shikiWasm.codeToTokensBase(samples[langs.indexOf(lang)], { lang, theme: 'vitesse-dark' })
+      shikiWasm.codeToTokensBase(code, { lang, theme: 'vitesse-dark' })
     })
   })
 }

package.json

@@ -13,7 +13,7 @@
     "docs": "pnpm -C docs run docs:dev",
     "docs:build": "pnpm -C docs run docs:build",
     "report-engine-js": "esno scripts/report-engine-js-compat.ts",
-    "bench": "vitest bench",
+    "bench": "pnpm -r run bench:prepare && vitest bench",
     "prepare": "simple-git-hooks"
   },
   "devDependencies": {