diff --git a/.changeset/lovely-rooms-taste.md b/.changeset/lovely-rooms-taste.md new file mode 100644 index 00000000..56ca95f1 --- /dev/null +++ b/.changeset/lovely-rooms-taste.md @@ -0,0 +1,8 @@ +--- +"@opennextjs/cloudflare": patch +--- + +some performance improvements + +- `enableCacheInterception` is now enabled by default, it loads ISR/SSG pages from cache without waiting for the js page bundle to load +- `routePreloadingBehavior` is now set to `withWaitUntil`, which means a single route js will be lazy loaded on cold start, but other routes will be preloaded using `waitUntil` for better performance diff --git a/examples/e2e/app-pages-router/open-next.config.ts b/examples/e2e/app-pages-router/open-next.config.ts index 1276dd09..7b808d32 100644 --- a/examples/e2e/app-pages-router/open-next.config.ts +++ b/examples/e2e/app-pages-router/open-next.config.ts @@ -5,4 +5,5 @@ import memoryQueue from "@opennextjs/cloudflare/overrides/queue/memory-queue"; export default defineCloudflareConfig({ incrementalCache: r2IncrementalCache, queue: memoryQueue, + enableCacheInterception: true, }); diff --git a/examples/e2e/app-router/e2e/isr.test.ts b/examples/e2e/app-router/e2e/isr.test.ts index 72e99c84..732669f0 100644 --- a/examples/e2e/app-router/e2e/isr.test.ts +++ b/examples/e2e/app-router/e2e/isr.test.ts @@ -103,7 +103,9 @@ test.describe("dynamicParams set to true", () => { test("should be HIT on a path that was prebuilt", async ({ page }) => { const res = await page.goto("/isr/dynamic-params-true/1"); expect(res?.status()).toEqual(200); - expect(res?.headers()["x-nextjs-cache"]).toEqual("HIT"); + // TODO: sync this to aws + const cacheHeader = res?.headers()["x-nextjs-cache"] ?? res?.headers()["x-opennext-cache"]; + expect(cacheHeader).toEqual("HIT"); const title = await page.getByTestId("title").textContent(); const content = await page.getByTestId("content").textContent(); expect(title).toEqual("Post 1"); @@ -115,7 +117,9 @@ test.describe("dynamicParams set to true", () => { // We are gonna skip this one for now, turborepo caching can cause this page to be STALE once deployed test.skip("should SSR on a path that was not prebuilt", async ({ page }) => { const res = await page.goto("/isr/dynamic-params-true/11"); - expect(res?.headers()["x-nextjs-cache"]).toEqual("MISS"); + // TODO: sync this to aws + const cacheHeader = res?.headers()["x-nextjs-cache"] ?? res?.headers()["x-opennext-cache"]; + expect(cacheHeader).toEqual("MISS"); const title = await page.getByTestId("title").textContent(); const content = await page.getByTestId("content").textContent(); expect(title).toEqual("Post 11"); @@ -140,7 +144,9 @@ test.describe("dynamicParams set to false", () => { test("should be HIT on a path that was prebuilt", async ({ page }) => { const res = await page.goto("/isr/dynamic-params-false/1"); expect(res?.status()).toEqual(200); - expect(res?.headers()["x-nextjs-cache"]).toEqual("HIT"); + // TODO: sync this to aws + const cacheHeader = res?.headers()["x-nextjs-cache"] ?? res?.headers()["x-opennext-cache"]; + expect(cacheHeader).toEqual("HIT"); const title = await page.getByTestId("title").textContent(); const content = await page.getByTestId("content").textContent(); expect(title).toEqual("Post 1"); diff --git a/examples/e2e/app-router/open-next.config.ts b/examples/e2e/app-router/open-next.config.ts index b202bbb1..f3cee670 100644 --- a/examples/e2e/app-router/open-next.config.ts +++ b/examples/e2e/app-router/open-next.config.ts @@ -14,4 +14,5 @@ export default defineCloudflareConfig({ }, }), queue: doQueue, + enableCacheInterception: true, }); diff --git a/examples/playground14/open-next.config.ts b/examples/playground14/open-next.config.ts index 0f15d530..55acebac 100644 --- a/examples/playground14/open-next.config.ts +++ b/examples/playground14/open-next.config.ts @@ -3,4 +3,5 @@ import kvIncrementalCache from "@opennextjs/cloudflare/overrides/incremental-cac export default defineCloudflareConfig({ incrementalCache: kvIncrementalCache, + enableCacheInterception: true, }); diff --git a/examples/playground15/open-next.config.ts b/examples/playground15/open-next.config.ts index 0f15d530..55acebac 100644 --- a/examples/playground15/open-next.config.ts +++ b/examples/playground15/open-next.config.ts @@ -3,4 +3,5 @@ import kvIncrementalCache from "@opennextjs/cloudflare/overrides/incremental-cac export default defineCloudflareConfig({ incrementalCache: kvIncrementalCache, + enableCacheInterception: true, }); diff --git a/packages/cloudflare/src/api/config.ts b/packages/cloudflare/src/api/config.ts index 143751b7..dab10c7a 100644 --- a/packages/cloudflare/src/api/config.ts +++ b/packages/cloudflare/src/api/config.ts @@ -28,6 +28,13 @@ export type CloudflareOverrides = { * Sets the revalidation queue implementation */ queue?: "direct" | Override; + + /** + * Enable cache interception + * Should be `false` when PPR is used + * @default false + */ + enableCacheInterception?: boolean; }; /** @@ -37,7 +44,7 @@ export type CloudflareOverrides = { * @returns the OpenNext configuration object */ export function defineCloudflareConfig(config: CloudflareOverrides = {}): OpenNextConfig { - const { incrementalCache, tagCache, queue } = config; + const { incrementalCache, tagCache, queue, enableCacheInterception = false } = config; return { default: { @@ -49,12 +56,16 @@ export function defineCloudflareConfig(config: CloudflareOverrides = {}): OpenNe tagCache: resolveTagCache(tagCache), queue: resolveQueue(queue), }, + routePreloadingBehavior: "withWaitUntil", }, // node:crypto is used to compute cache keys edgeExternals: ["node:crypto"], cloudflare: { useWorkerdCondition: true, }, + dangerous: { + enableCacheInterception, + }, }; }