feat expose cache (#47)

* expose parts of the cache * changeset
eagerpatch · Apr 14, 2024 · b0976b2 · b0976b2
1 parent 6ba3116
commit b0976b2
Show file tree

Hide file tree

Showing 6 changed files with 48 additions and 8 deletions.
diff --git a/.changeset/slow-pants-eat.md b/.changeset/slow-pants-eat.md
@@ -0,0 +1,8 @@
+---
+"@navita/webpack-plugin": minor
+"@navita/next-plugin": minor
+"@navita/engine": minor
+"@navita/core": minor
+---
+
+This enables more usage of the caches in the rendering engine. It allows external tooling to hook into the navita process to do analysis or extraction for other tools
diff --git a/packages/core/src/createRenderer.ts b/packages/core/src/createRenderer.ts
@@ -69,7 +69,7 @@ export function createRenderer({
       return {
         result: newSource.toString(),
         dependencies,
-        usedIds: engine.getUsedCacheIds([filePath]),
+        usedIds: engine.getCacheIds([filePath]),
         sourceMap: newSource.generateMap(),
       };
     }

diff --git a/packages/engine/src/index.ts b/packages/engine/src/index.ts
@@ -207,7 +207,7 @@ export class Engine {
       fontFace: fontFaceCache,
       static: staticCache,
       rule: ruleCache
-    } = usedIds ?? this.getUsedCacheIds(filePaths ?? Object.keys(this.usedIds));
+    } = usedIds ?? this.getCacheIds(filePaths ?? Object.keys(this.usedIds));
 
     const { atRules, lowPrioRules, rules } = splitStyleBlocks(this.caches.rule.items(ruleCache));
 
@@ -258,8 +258,16 @@ export class Engine {
   }
 
   serialize() {
-    const { caches, usedIds, identifierCount, sourceMapReferences } = this;
-    return JSON.stringify({ caches, usedIds, identifierCount, sourceMapReferences });
+    const { caches, usedIds, identifierCount, sourceMapReferences: sourceMapReferencesData } = this;
+
+    const sourceMapReferences = this.options.enableSourceMaps ? sourceMapReferencesData : undefined;
+
+    return JSON.stringify({
+      caches,
+      usedIds,
+      identifierCount,
+      sourceMapReferences,
+    });
   }
 
   async deserialize(buffer: Buffer | string) {
@@ -284,6 +292,17 @@ export class Engine {
     this.filePath = filePath;
   }
 
+  getUsedFilePaths() {
+    return Object.keys(this.usedIds);
+  }
+
+  getItems(caches: UsedIdCache) {
+    return Object.keys(caches).reduce((acc, key) => ({
+      ...acc,
+      [key]: this.caches[key as CacheKeys].items(caches[key as CacheKeys]),
+    }), {});
+  }
+
   clearUsedIds(filePath: string) {
     if (filePath === undefined) {
       return;
@@ -318,7 +337,7 @@ export class Engine {
     ];
   }
 
-  getUsedCacheIds(filePaths: string[] = []) {
+  getCacheIds(filePaths: string[] = []) {
     return filePaths.reduce((acc, filePath) => ({
       ...acc,
       ...Object.keys(this.usedIds[filePath] || []).reduce((cache, key) => ({

diff --git a/packages/engine/tests/src/index.test.ts b/packages/engine/tests/src/index.test.ts
@@ -328,6 +328,8 @@ describe('Engine', () => {
         static: [1],
       },
     });
+
+    expect(engine.getUsedFilePaths()).toEqual(['file1.ts']);
   });
 
   it('unsets usedIds on clearUsedIds', () => {
@@ -351,11 +353,17 @@ describe('Engine', () => {
       },
     });
 
+    expect(engine.getItems(engine.getCacheIds(engine.getUsedFilePaths()))).toEqual({
+      rule: ['a1'],
+    });
+
     engine.clearUsedIds('file1.ts');
 
     expect(engine['usedIds']).toEqual({
       'file1.ts': {},
     });
+
+    expect(engine.getItems(engine.getCacheIds(engine.getUsedFilePaths()))).toEqual({});
   });
 
   describe('identifiers', () => {

diff --git a/packages/next-plugin/src/index.ts b/packages/next-plugin/src/index.ts
@@ -6,6 +6,7 @@ import type MiniCssExtractPluginType from "mini-css-extract-plugin";
 import type { NextConfig } from "next";
 import NextMiniCssExtractPluginDefault from 'next/dist/build/webpack/plugins/mini-css-extract-plugin';
 
+export type { Renderer };
 import { findPagesDir } from "next/dist/lib/find-pages-dir";
 import type { Configuration } from "webpack";
 import { optimizeCSSOutput } from "./optimizeCSSOutput";
@@ -15,7 +16,7 @@ let lastCache: string;
 
 const MiniCssExtractPlugin = NextMiniCssExtractPluginDefault['default'] as typeof MiniCssExtractPluginType;
 
-interface Config extends Omit<Options, 'useWebpackCache' | 'onRenderInitialized'> {
+interface Config extends Omit<Options, 'useWebpackCache'> {
   singleCssFile?: boolean;
 }
 
@@ -124,6 +125,10 @@ export const createNavitaStylePlugin = (navitaConfig: Config = {}) =>
               // This will happen if the user doesn't have write access to the cache directory.
               // But the same should happen with the webpack cache.
             }
+
+            // If the user has provided their own onRenderInitialized function,
+            // we'll do it after the cache is loaded.
+            return navitaConfig.onRenderInitialized?.(renderer);
           };
 
           config.plugins?.push({
@@ -149,9 +154,9 @@ export const createNavitaStylePlugin = (navitaConfig: Config = {}) =>
           config.plugins?.push(
             new NavitaPlugin({
               useWebpackCache: false,
-              onRenderInitialized,
               outputCss,
               ...navitaConfig,
+              onRenderInitialized,
               optimizeCSSOutput,
             })
           );

diff --git a/packages/webpack-plugin/src/prepareCssOutput.ts b/packages/webpack-plugin/src/prepareCssOutput.ts
@@ -103,7 +103,7 @@ export function prepareCssOutput({
   }
 
   for (const [chunk, value] of map) {
-    value.usedIds = engine.getUsedCacheIds(value.filePaths);
+    value.usedIds = engine.getCacheIds(value.filePaths);
     value.parents = Array.from(chunk.groupsIterable)
       .flatMap((x) => x.getParents())
       .flatMap((x) => x.chunks)