usage-size.ts 2.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114
  1. import { mkdir, writeFile } from 'node:fs/promises'
  2. import path from 'node:path'
  3. import { rollup } from 'rollup'
  4. import nodeResolve from '@rollup/plugin-node-resolve'
  5. import { minify } from 'terser'
  6. import replace from '@rollup/plugin-replace'
  7. import { brotliCompressSync, gzipSync } from 'node:zlib'
  8. const sizeDir = path.resolve('temp/size')
  9. const vue = path.resolve('./packages/vue/dist/vue.runtime.esm-bundler.js')
  10. const vapor = path.resolve(
  11. './packages/vue-vapor/dist/vue-vapor.runtime.esm-bundler.js',
  12. )
  13. interface Preset {
  14. name: string
  15. imports: '*' | string[]
  16. from: string
  17. }
  18. const presets: Preset[] = [
  19. { name: 'createApp', imports: ['createApp'], from: vue },
  20. { name: 'createSSRApp', imports: ['createSSRApp'], from: vue },
  21. {
  22. name: 'defineCustomElement',
  23. imports: ['defineCustomElement'],
  24. from: vue,
  25. },
  26. { name: 'vapor', imports: '*', from: vapor },
  27. {
  28. name: 'overall',
  29. imports: [
  30. 'createApp',
  31. 'ref',
  32. 'watch',
  33. 'Transition',
  34. 'KeepAlive',
  35. 'Suspense',
  36. ],
  37. from: vue,
  38. },
  39. ]
  40. main()
  41. async function main() {
  42. const tasks: ReturnType<typeof generateBundle>[] = []
  43. for (const preset of presets) {
  44. tasks.push(generateBundle(preset))
  45. }
  46. const results = Object.fromEntries(
  47. (await Promise.all(tasks)).map(r => [r.name, r]),
  48. )
  49. await mkdir(sizeDir, { recursive: true })
  50. await writeFile(
  51. path.resolve(sizeDir, '_usages.json'),
  52. JSON.stringify(results),
  53. 'utf-8',
  54. )
  55. }
  56. async function generateBundle(preset: Preset) {
  57. const id = 'virtual:entry'
  58. const exportSpecifiers =
  59. preset.imports === '*'
  60. ? `* as ${preset.name}`
  61. : `{ ${preset.imports.join(', ')} }`
  62. const content = `export ${exportSpecifiers} from '${preset.from}'`
  63. const result = await rollup({
  64. input: id,
  65. plugins: [
  66. {
  67. name: 'usage-size-plugin',
  68. resolveId(_id) {
  69. if (_id === id) return id
  70. return null
  71. },
  72. load(_id) {
  73. if (_id === id) return content
  74. },
  75. },
  76. nodeResolve(),
  77. replace({
  78. 'process.env.NODE_ENV': '"production"',
  79. __VUE_PROD_DEVTOOLS__: 'false',
  80. __VUE_PROD_HYDRATION_MISMATCH_DETAILS__: 'false',
  81. __VUE_OPTIONS_API__: 'true',
  82. preventAssignment: true,
  83. }),
  84. ],
  85. })
  86. const generated = await result.generate({})
  87. const bundled = generated.output[0].code
  88. const minified = (
  89. await minify(bundled, {
  90. module: true,
  91. toplevel: true,
  92. })
  93. ).code!
  94. const size = minified.length
  95. const gzip = gzipSync(minified).length
  96. const brotli = brotliCompressSync(minified).length
  97. return {
  98. name: preset.name,
  99. size,
  100. gzip,
  101. brotli,
  102. }
  103. }