Move browser authentication behind a generated-contract BFF

web/tools/check-bundle.mjs

@@ -0,0 +1,24 @@
+import { readdirSync, statSync } from 'node:fs'
+import { extname, resolve } from 'node:path'
+
+const assets = resolve('dist/assets')
+const limits = new Map([
+  ['.js', 256 * 1024],
+  ['.css', 64 * 1024],
+])
+const totals = new Map()
+for (const entry of readdirSync(assets)) {
+  const extension = extname(entry)
+  if (!limits.has(extension)) continue
+  totals.set(
+    extension,
+    (totals.get(extension) ?? 0) + statSync(resolve(assets, entry)).size,
+  )
+}
+for (const [extension, limit] of limits) {
+  const total = totals.get(extension) ?? 0
+  if (total > limit)
+    throw new Error(
+      `${extension.slice(1).toUpperCase()} bundle is ${total} bytes; limit is ${limit}`,
+    )
+}

web/tools/compress-assets.mjs

@@ -0,0 +1,38 @@
+import { readdir, readFile, writeFile } from 'node:fs/promises'
+import { extname, join } from 'node:path'
+import { promisify } from 'node:util'
+import {
+  brotliCompress as brotli,
+  constants,
+  gzip as gzipCallback,
+} from 'node:zlib'
+
+const brotliCompress = promisify(brotli)
+const gzip = promisify(gzipCallback)
+
+await compressDirectory(new URL('../dist/', import.meta.url))
+
+async function compressDirectory(directory) {
+  for (const entry of await readdir(directory, { withFileTypes: true })) {
+    const path = join(entry.parentPath, entry.name)
+    if (entry.isDirectory()) {
+      await compressDirectory(path)
+      continue
+    }
+    if (!['.css', '.html', '.js', '.json', '.svg'].includes(extname(path)))
+      continue
+    const source = await readFile(path)
+    const [brotliOutput, gzipOutput] = await Promise.all([
+      brotliCompress(source, {
+        params: {
+          [constants.BROTLI_PARAM_QUALITY]: 11,
+        },
+      }),
+      gzip(source, { level: 9 }),
+    ])
+    await Promise.all([
+      writeFile(`${path}.br`, brotliOutput),
+      writeFile(`${path}.gz`, gzipOutput),
+    ])
+  }
+}