fix(perf): exclude /_next/static/* from generated functions

Author: mrstork

src/build/functions/server.ts

@@ -106,6 +106,7 @@ const getHandlerFile = async (ctx: PluginContext): Promise<string> => {
 
  const templateVariables: Record<string, string> = {
  '{{useRegionalBlobs}}': ctx.useRegionalBlobs.toString(),
+ '{{excludeStaticPath}}': join(ctx.buildConfig.basePath || '', '/_next/static/*'),
  }
  // In this case it is a monorepo and we need to use a own template for it
  // as we have to change the process working directory

src/build/templates/handler-monorepo.tmpl.js

@@ -49,4 +49,9 @@ export default async function (req, context) {
 export const config = {
  path: '/*',
  preferStatic: true,
+ excludedPath: [
+ // We use `preferStatic: true` so we already won't run this on *existing* static assets,
+ // but by excluding this entire path we also avoid invoking the function just to 404.
+ '{{excludeStaticPath}}',
+ ],
 }

src/build/templates/handler.tmpl.js

@@ -43,4 +43,9 @@ export default async function handler(req, context) {
 export const config = {
  path: '/*',
  preferStatic: true,
+ excludedPath: [
+ // We use `preferStatic: true` so we already won't run this on *existing* static assets,
+ // but by excluding this entire path we also avoid invoking the function just to 404.
+ '{{excludeStaticPath}}',
+ ],
 }

tests/e2e/page-router.test.ts

@@ -1,6 +1,8 @@
 import { expect } from '@playwright/test'
 import { nextVersionSatisfies } from '../utils/next-version-helpers.mjs'
 import { test } from '../utils/playwright-helpers.js'
+import { join } from 'node:path'
+import { readdir } from 'node:fs/promises'
 
 export function waitFor(millis: number) {
  return new Promise((resolve) => setTimeout(resolve, millis))
@@ -614,6 +616,34 @@ test.describe('Simple Page Router (no basePath, no i18n)', () => {
  /(s-maxage|max-age)/,
  )
  })
+
+ test.describe('static assets and function invocations', () => {
+ test('should return 200 for an existing static asset without invoking a function', async ({
+ page,
+ pageRouter,
+ }) => {
+ // Since assets are hashed, we can't hardcode anything here. Find something to fetch.
+ const [staticAsset] = await readdir(
+ join(pageRouter.isolatedFixtureRoot, '.next', 'static', 'chunks'),
+ )
+ expect(staticAsset).toBeDefined()
+
+ const response = await page.goto(`${pageRouter.url}/_next/static/chunks/${staticAsset}`)
+
+ expect(response?.status()).toBe(200)
+ expect(response?.headers()).not.toHaveProperty('x-nf-function-type')
+ })
+
+ test('should return 404 for a nonexistent static asset without invoking a function', async ({
+ page,
+ pageRouter,
+ }) => {
+ const response = await page.goto(`${pageRouter.url}/_next/static/stale123abcdef.js`)
+
+ expect(response?.status()).toBe(404)
+ expect(response?.headers()).not.toHaveProperty('x-nf-function-type')
+ })
+ })
 })
 
 test.describe('Page Router with basePath and i18n', () => {
@@ -1352,9 +1382,9 @@ test.describe('Page Router with basePath and i18n', () => {
 
  test('requesting a non existing page route that needs to be fetched from the blob store like 404.html', async ({
  page,
- pageRouter,
+ pageRouterBasePathI18n,
  }) => {
- const response = await page.goto(new URL('non-existing', pageRouter.url).href)
+ const response = await page.goto(new URL('non-existing', pageRouterBasePathI18n.url).href)
  const headers = response?.headers() || {}
  expect(response?.status()).toBe(404)
 
@@ -1375,9 +1405,9 @@ test.describe('Page Router with basePath and i18n', () => {
 
  test('requesting a non existing page route that needs to be fetched from the blob store like 404.html (notFound: true)', async ({
  page,
- pageRouter,
+ pageRouterBasePathI18n,
  }) => {
- const response = await page.goto(new URL('static/not-found', pageRouter.url).href)
+ const response = await page.goto(new URL('static/not-found', pageRouterBasePathI18n.url).href)
  const headers = response?.headers() || {}
  expect(response?.status()).toBe(404)
 
@@ -1390,4 +1420,36 @@ test.describe('Page Router with basePath and i18n', () => {
  )
  expect(headers['cache-control']).toBe('public,max-age=0,must-revalidate')
  })
+
+ test.describe('static assets and function invocations', () => {
+ test('should return 200 for an existing static asset without invoking a function', async ({
+ page,
+ pageRouterBasePathI18n,
+ }) => {
+ // Since assets are hashed, we can't hardcode anything here. Find something to fetch.
+ const [staticAsset] = await readdir(
+ join(pageRouterBasePathI18n.isolatedFixtureRoot, '.next', 'static', 'chunks'),
+ )
+ expect(staticAsset).toBeDefined()
+
+ const response = await page.goto(
+ `${pageRouterBasePathI18n.url}/_next/static/chunks/${staticAsset}`,
+ )
+
+ expect(response?.status()).toBe(200)
+ expect(response?.headers()).not.toHaveProperty('x-nf-function-type')
+ })
+
+ test('should return 404 for a nonexistent static asset without invoking a function', async ({
+ page,
+ pageRouterBasePathI18n,
+ }) => {
+ const response = await page.goto(
+ `${pageRouterBasePathI18n.url}/_next/static/stale123abcdef.js`,
+ )
+
+ expect(response?.status()).toBe(404)
+ expect(response?.headers()).not.toHaveProperty('x-nf-function-type')
+ })
+ })
 })

tests/utils/create-e2e-fixture.ts

@@ -21,6 +21,7 @@ export interface DeployResult {
  deployID: string
  url: string
  logs: string
+ isolatedFixtureRoot: string
 }
 
 type PackageManager = 'npm' | 'pnpm' | 'yarn' | 'bun' | 'berry'
@@ -92,6 +93,7 @@ export const createE2EFixture = async (fixture: string, config: E2EConfig = {})
  cleanup: _cleanup,
  deployID: result.deployID,
  url: result.url,
+ isolatedFixtureRoot: result.isolatedFixtureRoot,
  }
  } catch (error) {
  await _cleanup(true)
@@ -292,6 +294,7 @@ async function deploySite(
  url: `https://${deployID}--${siteName}.netlify.app`,
  deployID,
  logs: output,
+ isolatedFixtureRoot,
  }
 }