chore: dist file size chekcing with github actions (#2063)

* chore: dist file size chekcing with github actions

* fix: size checking scripts

* fix: add size reporting scripts

* fix: add github action workflows

* fix: tweak workflow name

* fix: add test for size reporting with workflow dispatch

.github/workflows/nightly-release.yml

@@ -1,4 +1,4 @@
-name: nightly release
+name: Nightly release
 on:
   push:
     branches:

.github/workflows/size-data.yml

@@ -0,0 +1,48 @@
+name: Size data
+
+on:
+  push:
+    branches:
+      - master
+  pull_request:
+    branches:
+      - master
+
+permissions:
+  contents: read
+
+jobs:
+  upload:
+    if: github.repository == 'intlify/vue-i18n'
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout codes
+        uses: actions/checkout@v4
+
+      - name: Install pnpm
+        uses: pnpm/[email protected]
+
+      - name: Setup node
+        uses: actions/setup-node@v4
+        with:
+          node-version: 23
+          cache: pnpm
+
+      - name: Install dependencies
+        run: pnpm install --frozen-lockfile
+
+      - name: Check size
+        run: pnpm size
+
+      - name: Save PR number & base branch
+        if: ${{github.event_name == 'pull_request'}}
+        run: |
+          echo ${{ github.event.number }} > ./temp/size/number.txt
+          echo ${{ github.base_ref }} > ./temp/size/base.txt
+
+      - name: Upload Size Data
+        uses: actions/upload-artifact@v4
+        with:
+          name: size-data
+          path: temp/size

.github/workflows/size-report.yml

@@ -0,0 +1,83 @@
+name: Size report
+
+on:
+  workflow_run:
+    workflows: ['Size data']
+    types:
+      - completed
+  workflow_dispatch:
+
+permissions:
+  contents: read
+  pull-requests: write
+  issues: write
+
+jobs:
+  size-report:
+    runs-on: ubuntu-latest
+    if: >
+      github.repository == 'intlify/vue-i18n' &&
+      github.event.workflow_run.event == 'pull_request' &&
+      github.event.workflow_run.conclusion == 'success'
+    steps:
+      - uses: actions/checkout@v4
+
+      - name: Install pnpm
+        uses: pnpm/[email protected]
+
+      - name: Install Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: 23
+          cache: pnpm
+
+      - name: Install dependencies
+        run: pnpm install --frozen-lockfile
+
+      - name: Download Size Data
+        uses: dawidd6/action-download-artifact@v6
+        with:
+          name: size-data
+          run_id: ${{ github.event.workflow_run.id }}
+          path: temp/size
+
+      - name: Read PR Number
+        id: pr-number
+        uses: juliangruber/read-file-action@v1
+        with:
+          path: temp/size/number.txt
+
+      - name: Read base branch
+        id: pr-base
+        uses: juliangruber/read-file-action@v1
+        with:
+          path: temp/size/base.txt
+
+      - name: Download Previous Size Data
+        uses: dawidd6/action-download-artifact@v6
+        with:
+          branch: ${{ steps.pr-base.outputs.content }}
+          workflow: size-data.yml
+          event: push
+          name: size-data
+          path: temp/size-prev
+          if_no_artifact_found: warn
+
+      - name: Prepare report
+        run: npx tsx scripts/size-report.ts > size-report.md
+
+      - name: Read Size Report
+        id: size-report
+        uses: juliangruber/read-file-action@v1
+        with:
+          path: ./size-report.md
+
+      - name: Create Comment
+        uses: actions-cool/maintain-one-comment@v3
+        with:
+          token: ${{ secrets.GITHUB_TOKEN }}
+          number: ${{ steps.pr-number.outputs.content }}
+          body: |
+            ${{ steps.size-report.outputs.content }}
+            <!-- INTLIFY_VUE_I18N_SIZE -->
+          body-include: '<!-- INTLIFY_VUE_I18N_SIZE -->'

package.json

@@ -31,13 +31,13 @@
     "build:sourcemap": "pnpm build --sourcemap",
     "build:type": "./scripts/build.sh",
     "build:typed": "pnpm build core-base vue-i18n-core --withTypes",
-    "check-install": "tsx ./scripts/playwright.ts",
+    "size": "tsx ./scripts/build.ts --size && tsx ./scripts/size.ts",
+    "size:report": "tsx ./scripts/report-size.ts",
     "clean": "run-p clean:*",
     "clean:coverage": "rm -rf ./coverage",
     "clean:dist": "rm -rf ./dist ./packages/**/dist ./docs/.vitepress/dist",
     "clean:docs": "trash './docs/api/!(injection).md'",
     "clean:type": "rm -rf ./temp",
-    "coverage": "opener coverage/index.html",
     "dev": "tsx ./scripts/dev.ts",
     "dev:e2e": "cross-env TZ=UTC vitest -c ./vitest.e2e.config.ts",
     "dev:eslint": "npx @eslint/config-inspector",
@@ -73,6 +73,8 @@
     "preview:size-petite-vue-i18n": "pnpm --filter @intlify/size-check-petite-vue-i18n preview",
     "preview:size-vue-i18n": "pnpm --filter @intlify/size-check-vue-i18n preview",
     "release": "bumpp package.json packages/**/package.json --commit \"release: v\" --push --tag",
+    "check-install": "tsx ./scripts/playwright.ts",
+    "coverage": "opener coverage/index.html",
     "test": "run-s lint test:cover check-install test:e2e",
     "test:cover": "pnpm test:unit --coverage",
     "test:e2e": "cross-env TZ=UTC vitest run -c ./vitest.e2e.config.ts",
@@ -112,6 +114,7 @@
     "jsdom": "^24.0.0",
     "lint-staged": "^15.2.2",
     "listhen": "^1.7.2",
+    "markdown-table": "^3.0.4",
     "mitata": "^1.0.20",
     "npm-run-all2": "^7.0.0",
     "opener": "^1.5.2",

packages/size-check-core/scripts/size.mjs

@@ -0,0 +1,22 @@
+import { brotliCompressSync, gzipSync } from 'node:zlib'
+import { build } from 'vite'
+
+const generated = await build({
+  logLevel: 'silent',
+  build: {
+    minify: true
+  }
+})
+const bundled = generated.output[0].code
+
+const size = bundled.length
+const gzip = gzipSync(bundled).length
+const brotli = brotliCompressSync(bundled).length
+
+const report = {
+  name: '@intlify/core',
+  size,
+  gzip,
+  brotli
+}
+console.log(JSON.stringify(report))

packages/size-check-petite-vue-i18n/scripts/size.mjs

@@ -0,0 +1,22 @@
+import { brotliCompressSync, gzipSync } from 'node:zlib'
+import { build } from 'vite'
+
+const generated = await build({
+  logLevel: 'silent',
+  build: {
+    minify: true
+  }
+})
+const bundled = generated.output[0].code
+
+const size = bundled.length
+const gzip = gzipSync(bundled).length
+const brotli = brotliCompressSync(bundled).length
+
+const report = {
+  name: 'petite-vue-i18n',
+  size,
+  gzip,
+  brotli
+}
+console.log(JSON.stringify(report))

packages/size-check-vue-i18n/scripts/size.mjs

@@ -0,0 +1,22 @@
+import { brotliCompressSync, gzipSync } from 'node:zlib'
+import { build } from 'vite'
+
+const generated = await build({
+  logLevel: 'silent',
+  build: {
+    minify: true
+  }
+})
+const bundled = generated.output[0].code
+
+const size = bundled.length
+const gzip = gzipSync(bundled).length
+const brotli = brotliCompressSync(bundled).length
+
+const report = {
+  name: 'vue-i18n',
+  size,
+  gzip,
+  brotli
+}
+console.log(JSON.stringify(report))

scripts/build.sh

@@ -2,6 +2,6 @@
 
 set -e
 
-pnpm build --withTypes --size
+pnpm build --withTypes
 
 tsx ./scripts/postprocess.ts

scripts/build.ts

@@ -27,6 +27,7 @@ import pc from 'picocolors'
 import {
   targets as allTargets,
   checkSizeDistFiles,
+  displaySize,
   fuzzyMatchTarget,
   readJson
 } from './utils'
@@ -84,20 +85,27 @@ const {
 } = values
 
 const formats = rawFormats?.split(',')
+const sizeDir = path.resolve(__dirname, '../temp/size')
 
 async function main() {
   await run()
 
   async function run() {
+    if (size) {
+      await fs.mkdir(sizeDir, { recursive: true })
+    }
+
     const rtsCachePath = path.resolve(__dirname, './node_modules/.rts2_cache')
     if (isRelease && existsSync(rtsCachePath)) {
       // remove build cache for release builds to avoid outdated enum values
       await fs.rm(rtsCachePath, { recursive: true })
     }
+
     const resolvedTargets = targets.length
       ? await fuzzyMatchTarget(targets, buildAllMatching)
       : await allTargets()
     await buildAll(resolvedTargets)
+
     if (size) {
       await checkAllSizes(resolvedTargets)
     }
@@ -273,17 +281,33 @@ async function main() {
       return
     }
     const file = await fs.readFile(filePath)
-    const minSize = (file.length / 1024).toFixed(2) + 'kb'
+    const filename = path.basename(filePath)
+
     const gzipped = gzipSync(file)
-    const gzippedSize = (gzipped.length / 1024).toFixed(2) + 'kb'
-    const compressed = brotliCompressSync(file)
-    const compressedSize =
-      compressed != null ? (compressed.length / 1024).toFixed(2) + 'kb' : 'N/A'
+    const brotli = brotliCompressSync(file)
     console.log(
-      `📦  ${pc.gray(
+      `📦  ${pc.green(
         pc.bold(path.basename(filePath))
-      )} min:${minSize} / gzip:${gzippedSize} / brotli:${compressedSize}`
+      )} - min: ${displaySize(file.length)} / gzip: ${displaySize(gzipped.length)} / brotli: ${displaySize(brotli.length)}`
     )
+
+    if (size) {
+      const sizeContents = JSON.stringify(
+        {
+          file: filename,
+          size: file.length,
+          gzip: gzipped.length,
+          brotli: brotli.length
+        },
+        null,
+        2
+      )
+      await fs.writeFile(
+        path.resolve(sizeDir, `${filename}.json`),
+        sizeContents,
+        'utf-8'
+      )
+    }
   }
 }