i18n: chunk strings based on the key

vite.config.ts

@@ -5,6 +5,50 @@ import suid from "@suid/vite-plugin";
 import { VitePWA } from "vite-plugin-pwa";
 import version from "vite-plugin-package-version";
 import manifest from "./manifest.config";
+import { GetManualChunk } from "rollup";
+
+/**
+ * Put all strings (/i18n/{key}.<json|js|ts>) into separated chunks based on the key.
+ */
+const chunkStrs: GetManualChunk = (id, { getModuleInfo }) => {
+  const match = /.*\/i18n\/(.*)\.[jt]s.*$/.exec(id);
+  if (match) {
+    const key = match[1];
+
+    const dependentEntryPoints = [];
+
+    // we use a Set here so we handle each module at most once. This
+    // prevents infinite loops in case of circular dependencies
+    const idsToHandle = new Set(getModuleInfo(id)!.dynamicImporters);
+
+    for (const moduleId of idsToHandle) {
+      const { isEntry, dynamicImporters, importers } = getModuleInfo(moduleId)!;
+      if (isEntry || dynamicImporters.length > 0)
+        dependentEntryPoints.push(moduleId);
+
+      // The Set iterator is intelligent enough to iterate over
+      // elements that are added during iteration
+      for (const importerId of importers) idsToHandle.add(importerId);
+    }
+
+    // If there is a unique entry, we put it into a chunk based on the
+    // entry name
+    if (dependentEntryPoints.length === 1) {
+      return `${key}.${
+        dependentEntryPoints[0].split("/").slice(-1)[0].split(".")[0]
+      }.strings`;
+    }
+    // For multiple entries, we put it into a "shared" chunk
+    if (dependentEntryPoints.length > 1) {
+      return `${key}.shared.strings`;
+    }
+  }
+};
+
+
+const manualChunks: GetManualChunk = (id, meta) => {
+  return chunkStrs(id, meta);
+};
 
 export default defineConfig(({ mode }) => ({
   plugins: [
@@ -48,5 +92,10 @@ export default defineConfig(({ mode }) => ({
   build: {
     target: ["firefox98", "safari15.4", "ios15.4", "chrome84", "edge87"],
     sourcemap: true,
+    rollupOptions: {
+      output: {
+        manualChunks,
+      },
+    },
   },
 }));