-
Notifications
You must be signed in to change notification settings - Fork 514
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
perf(netlify,netlify-edge): exclude static paths from SSR function
The netlify preset was already using `preferStatic: true` which lets existing static assets take precedence over the function, but this now also avoids a function invocation for static paths that don't exist, i.e. this avoids an unnecessary dynamic 404 that could be served directly from the CDN. The `netlify-edge` preset wasn't excluding anything, so this addresses both the 404 case and the existing asset case. The 404 case is important because browsers frequently attempt to request hashed assets from previous deploys that have been invalidated. There's no reason for this to go through functions, since we know that the whole parent path is static.
- Loading branch information
Showing
7 changed files
with
212 additions
and
5 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,14 +1,44 @@ | ||
| import { promises as fsp } from "node:fs"; | ||
| import type { Context } from "@netlify/functions"; | ||
| import type { Context as FunctionContext } from "@netlify/functions"; | ||
| import type { Context as EdgeFunctionContext } from "@netlify/edge-functions"; | ||
| import { resolve } from "pathe"; | ||
| import { describe, expect, it } from "vitest"; | ||
| import { getPresetTmpDir, setupTest, testNitro } from "../tests"; | ||
|
|
||
| describe("nitro:preset:netlify", async () => { | ||
| const publicDir = resolve(getPresetTmpDir("netlify"), "dist"); | ||
| const ctx = await setupTest("netlify", { | ||
| config: { | ||
| framework: { | ||
| name: "mock-framework", | ||
| version: "1.2.3", | ||
| }, | ||
| publicAssets: [ | ||
| { | ||
| fallthrough: true, | ||
| baseURL: "foo", | ||
| dir: publicDir, | ||
| }, | ||
| { | ||
| fallthrough: false, | ||
| dir: publicDir, | ||
| }, | ||
| { | ||
| fallthrough: true, | ||
| dir: publicDir, | ||
| }, | ||
| { | ||
| baseURL: "icons", | ||
| dir: publicDir, | ||
| }, | ||
| { | ||
| fallthrough: false, | ||
| baseURL: "nested/fonts", | ||
| dir: publicDir, | ||
| }, | ||
| ], | ||
| output: { | ||
| publicDir: resolve(getPresetTmpDir("netlify"), "dist"), | ||
| publicDir, | ||
| }, | ||
| netlify: { | ||
| images: { | ||
|
|
@@ -22,7 +52,9 @@ describe("nitro:preset:netlify", async () => { | |
| async () => { | ||
| const { default: handler } = (await import( | ||
| resolve(ctx.outDir, "server/main.mjs") | ||
| )) as { default: (req: Request, ctx: Context) => Promise<Response> }; | ||
| )) as { | ||
| default: (req: Request, _ctx: FunctionContext) => Promise<Response>; | ||
| }; | ||
| return async ({ url: rawRelativeUrl, headers, method, body }) => { | ||
| // creating new URL object to parse query easier | ||
| const url = new URL(`https://example.com${rawRelativeUrl}`); | ||
|
|
@@ -31,7 +63,7 @@ describe("nitro:preset:netlify", async () => { | |
| method, | ||
| body, | ||
| }); | ||
| const res = await handler(req, {} as Context); | ||
| const res = await handler(req, {} as FunctionContext); | ||
| return res; | ||
| }; | ||
| }, | ||
|
|
@@ -86,6 +118,24 @@ describe("nitro:preset:netlify", async () => { | |
| } | ||
| `); | ||
| }); | ||
| it("writes server/server.mjs with static paths excluded", async () => { | ||
| const serverFunctionFile = await fsp.readFile( | ||
| resolve(ctx.outDir, "server/server.mjs"), | ||
| "utf8" | ||
| ); | ||
| expect(serverFunctionFile).toEqual( | ||
| ` | ||
| export { default } from "./main.mjs"; | ||
| export const config = { | ||
| name: "server handler", | ||
| generator: "[email protected]", | ||
| path: "/*", | ||
| excludedPath: ["/.netlify/*","/icons/*","/nested/fonts/*","/build/*"], | ||
| preferStatic: true, | ||
| }; | ||
| `.trim() | ||
| ); | ||
| }); | ||
| describe("matching ISR route rule with no max-age", () => { | ||
| it("sets Netlify-CDN-Cache-Control header with revalidation after 1 year and durable directive", async () => { | ||
| const { headers } = await callHandler({ url: "/rules/isr" }); | ||
|
|
@@ -137,3 +187,139 @@ describe("nitro:preset:netlify", async () => { | |
| } | ||
| ); | ||
| }); | ||
|
|
||
| describe("nitro:preset:netlify-edge", async () => { | ||
| const publicDir = resolve(getPresetTmpDir("netlify-edge"), "dist"); | ||
| const ctx = await setupTest("netlify-edge", { | ||
| config: { | ||
| framework: { | ||
| name: "mock-framework", | ||
| version: "1.2.3", | ||
| }, | ||
| publicAssets: [ | ||
| { | ||
| fallthrough: true, | ||
| baseURL: "foo", | ||
| dir: publicDir, | ||
| }, | ||
| { | ||
| fallthrough: false, | ||
| dir: publicDir, | ||
| }, | ||
| { | ||
| fallthrough: true, | ||
| dir: publicDir, | ||
| }, | ||
| { | ||
| baseURL: "icons", | ||
| dir: publicDir, | ||
| }, | ||
| { | ||
| fallthrough: false, | ||
| baseURL: "nested/fonts", | ||
| dir: publicDir, | ||
| }, | ||
| ], | ||
| output: { | ||
| publicDir, | ||
| }, | ||
| netlify: { | ||
| images: { | ||
| remote_images: ["https://example.com/.*"], | ||
| }, | ||
| }, | ||
| }, | ||
| }); | ||
| testNitro( | ||
| ctx, | ||
| async () => { | ||
| const { default: handler } = (await import( | ||
| resolve(ctx.rootDir, ".netlify/edge-functions/server/server.js") | ||
| )) as { | ||
| default: (req: Request, _ctx: EdgeFunctionContext) => Promise<Response>; | ||
| }; | ||
| return async ({ url: rawRelativeUrl, headers, method, body }) => { | ||
| // creating new URL object to parse query easier | ||
| const url = new URL(`https://example.com${rawRelativeUrl}`); | ||
| const req = new Request(url, { | ||
| headers: headers ?? {}, | ||
| method, | ||
| body, | ||
| }); | ||
| const res = await handler(req, {} as EdgeFunctionContext); | ||
| if (!(res instanceof Response)) | ||
| // The Netlify Edge Function handler API allows returning `undefined` but this | ||
| // test helper only supports a Response or this shape. | ||
| return { | ||
| data: undefined, | ||
| status: 404, | ||
| headers: {}, | ||
| }; | ||
| return res; | ||
| }; | ||
| }, | ||
| () => { | ||
| it("adds route rules - redirects", async () => { | ||
| const redirects = await fsp.readFile( | ||
| resolve(ctx.outDir, "../dist/_redirects"), | ||
| "utf8" | ||
| ); | ||
|
|
||
| expect(redirects).toMatchInlineSnapshot(` | ||
| "/rules/nested/override /other 302 | ||
| /rules/redirect/wildcard/* https://nitro.unjs.io/:splat 302 | ||
| /rules/redirect/obj https://nitro.unjs.io/ 301 | ||
| /rules/nested/* /base 302 | ||
| /rules/redirect /base 302 | ||
| " | ||
| `); | ||
| }); | ||
| it("adds route rules - headers", async () => { | ||
| const headers = await fsp.readFile( | ||
| resolve(ctx.outDir, "../dist/_headers"), | ||
| "utf8" | ||
| ); | ||
|
|
||
| expect(headers).toMatchInlineSnapshot(` | ||
| "/rules/headers | ||
| cache-control: s-maxage=60 | ||
| /rules/cors | ||
| access-control-allow-origin: * | ||
| access-control-allow-methods: GET | ||
| access-control-allow-headers: * | ||
| access-control-max-age: 0 | ||
| /rules/nested/* | ||
| x-test: test | ||
| /build/* | ||
| cache-control: public, max-age=3600, immutable | ||
| " | ||
| `); | ||
| }); | ||
| it("writes edge-functions/manifest.json with static paths excluded", async () => { | ||
| const manifestFile = JSON.parse( | ||
| await fsp.readFile( | ||
| resolve(ctx.rootDir, ".netlify/edge-functions/manifest.json"), | ||
| "utf8" | ||
| ) | ||
| ); | ||
| expect(manifestFile).toEqual({ | ||
| version: 1, | ||
| functions: [ | ||
| { | ||
| path: "/*", | ||
| excludedPath: [ | ||
| "/.netlify/*", | ||
| "/icons/*", | ||
| "/nested/fonts/*", | ||
| "/build/*", | ||
| ], | ||
| name: "edge server handler", | ||
| function: "server", | ||
| generator: "[email protected]", | ||
| }, | ||
| ], | ||
| }); | ||
| }); | ||
| } | ||
| ); | ||
| }); | ||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters