perf(plugin-rsc): add hook filters (#1094)

Author: hi-ogawa

packages/plugin-rsc/package.json

@@ -39,6 +39,7 @@
     "prepack": "tsdown"
   },
   "dependencies": {
+    "@rolldown/pluginutils": "1.0.0-rc.2",
     "es-module-lexer": "^2.0.0",
     "estree-walker": "^3.0.3",
     "magic-string": "^0.30.21",

packages/plugin-rsc/src/core/plugin.ts

@@ -5,6 +5,7 @@ export default function vitePluginRscCore(): Plugin[] {
     {
       name: 'rsc:patch-react-server-dom-webpack',
       transform: {
+        filter: { code: '__webpack_require__' },
         handler(originalCode, _id, _options) {
           let code = originalCode
           if (code.includes('__webpack_require__.u')) {

packages/plugin-rsc/src/plugin.ts

@@ -4,6 +4,7 @@ import { createRequire } from 'node:module'
 import path from 'node:path'
 import { pathToFileURL } from 'node:url'
 import { createDebug } from '@hiogawa/utils'
+import { exactRegex, prefixRegex } from '@rolldown/pluginutils'
 import * as esModuleLexer from 'es-module-lexer'
 import MagicString from 'magic-string'
 import { toNodeHandler } from 'srvx/node'
@@ -326,6 +327,7 @@ export function vitePluginRscMinimal(
       name: 'rsc:vite-client-raw-import',
       transform: {
         order: 'post',
+        filter: { code: '__vite_rsc_raw_import__' },
         handler(code) {
           if (code.includes('__vite_rsc_raw_import__')) {
             // inject dynamic import last to avoid Vite adding `?import` query
@@ -343,6 +345,7 @@ export function vitePluginRscMinimal(
       name: 'rsc:reference-validation',
       apply: 'serve',
       load: {
+        filter: { id: prefixRegex('\0virtual:vite-rsc/reference-validation?') },
         handler(id, _options) {
           if (id.startsWith('\0virtual:vite-rsc/reference-validation?')) {
             const parsed = parseReferenceValidationVirtual(id)
@@ -824,6 +827,7 @@ export default function vitePluginRsc(
       name: 'rsc:react-server-dom-webpack-alias',
       resolveId: {
         order: 'pre',
+        filter: { id: prefixRegex(`${PKG_NAME}/vendor/react-server-dom/`) },
         async handler(source, importer, options) {
           if (
             hasReactServerDomWebpack &&
@@ -848,6 +852,7 @@ export default function vitePluginRsc(
       // - (build) rewriting to external `import("../<env>/<entry>.js")`
       name: 'rsc:load-environment-module',
       transform: {
+        filter: { code: 'import.meta.viteRsc.loadModule' },
         async handler(code) {
           if (!code.includes('import.meta.viteRsc.loadModule')) return
           const { server } = manager
@@ -996,13 +1001,15 @@ export default function vitePluginRsc(
     {
       name: 'rsc:virtual:vite-rsc/rpc-client',
       resolveId: {
+        filter: { id: exactRegex('virtual:vite-rsc/rpc-client') },
         handler(source) {
           if (source === 'virtual:vite-rsc/rpc-client') {
             return `\0${source}`
           }
         },
       },
       load: {
+        filter: { id: exactRegex('\0virtual:vite-rsc/rpc-client') },
         handler(id) {
           if (id === '\0virtual:vite-rsc/rpc-client') {
             const { server } = manager
@@ -1026,6 +1033,7 @@ export function createRpcClient(params) {
     {
       name: 'rsc:virtual:vite-rsc/assets-manifest',
       resolveId: {
+        filter: { id: exactRegex('virtual:vite-rsc/assets-manifest') },
         handler(source) {
           if (source === 'virtual:vite-rsc/assets-manifest') {
             if (this.environment.mode === 'build') {
@@ -1036,6 +1044,7 @@ export function createRpcClient(params) {
         },
       },
       load: {
+        filter: { id: exactRegex('\0virtual:vite-rsc/assets-manifest') },
         handler(id) {
           if (id === '\0virtual:vite-rsc/assets-manifest') {
             assert(this.environment.name !== 'client')
@@ -1168,6 +1177,7 @@ export default assetsManifest.bootstrapScriptContent;
     {
       name: 'rsc:bootstrap-script-content',
       transform: {
+        filter: { code: 'loadBootstrapScriptContent' },
         async handler(code) {
           if (
             !code.includes('loadBootstrapScriptContent') ||
@@ -1287,6 +1297,7 @@ function globalAsyncLocalStoragePlugin(): Plugin[] {
     {
       name: 'rsc:inject-async-local-storage',
       transform: {
+        filter: { code: 'typeof AsyncLocalStorage' },
         handler(code) {
           if (
             (this.environment.name === 'ssr' ||
@@ -1350,6 +1361,10 @@ function vitePluginUseClient(
     {
       name: 'rsc:use-client',
       transform: {
+        // TODO: cannot use filter because handler has cleanup side effect
+        // (`delete manager.clientReferenceMetaMap[id]`) that must run
+        // even when directive is removed (HMR case)
+        // filter: { code: 'use client' },
         async handler(code, id) {
           if (this.environment.name !== serverEnvironmentName) return
           if (!code.includes('use client')) {
@@ -1456,13 +1471,15 @@ function vitePluginUseClient(
     {
       name: 'rsc:use-client/build-references',
       resolveId: {
+        filter: { id: prefixRegex('virtual:vite-rsc/client-references') },
         handler(source) {
           if (source.startsWith('virtual:vite-rsc/client-references')) {
             return '\0' + source
           }
         },
       },
       load: {
+        filter: { id: prefixRegex('\0virtual:vite-rsc/client-references') },
         handler(id) {
           if (id === '\0virtual:vite-rsc/client-references') {
             // not used during dev
@@ -1543,6 +1560,9 @@ function vitePluginUseClient(
     {
       name: 'rsc:virtual-client-in-server-package',
       load: {
+        filter: {
+          id: prefixRegex('\0virtual:vite-rsc/client-in-server-package-proxy/'),
+        },
         async handler(id) {
           if (
             id.startsWith('\0virtual:vite-rsc/client-in-server-package-proxy/')
@@ -1583,6 +1603,7 @@ function vitePluginUseClient(
         },
       },
       load: {
+        filter: { id: prefixRegex('\0virtual:vite-rsc/client-package-proxy/') },
         async handler(id) {
           if (id.startsWith('\0virtual:vite-rsc/client-package-proxy/')) {
             assert(this.environment.mode === 'dev')
@@ -1764,6 +1785,7 @@ function vitePluginDefineEncryptionKey(
         }
       },
       resolveId: {
+        filter: { id: exactRegex('virtual:vite-rsc/encryption-key') },
         handler(source) {
           if (source === 'virtual:vite-rsc/encryption-key') {
             // encryption logic can be tree-shaken if action bind is not used.
@@ -1772,6 +1794,7 @@ function vitePluginDefineEncryptionKey(
         },
       },
       load: {
+        filter: { id: exactRegex('\0virtual:vite-rsc/encryption-key') },
         handler(id) {
           if (id === '\0virtual:vite-rsc/encryption-key') {
             if (this.environment.mode === 'build') {
@@ -1828,6 +1851,10 @@ function vitePluginUseServer(
     {
       name: 'rsc:use-server',
       transform: {
+        // TODO: cannot use filter because handler has cleanup side effect
+        // (`delete manager.serverReferenceMetaMap[id]`) that must run
+        // even when directive is removed (HMR case)
+        // filter: { code: 'use server' },
         async handler(code, id) {
           if (!code.includes('use server')) {
             delete manager.serverReferenceMetaMap[id]
@@ -2240,6 +2267,8 @@ function vitePluginRscCss(
     {
       name: 'rsc:rsc-css-export-transform',
       transform: {
+        // TODO:
+        // filter: {},
         async handler(code, id) {
           if (this.environment.name !== 'rsc') return
           const filter = getRscCssTransformFilter({ id, code })
@@ -2267,6 +2296,9 @@ function vitePluginRscCss(
       apply: 'serve',
       transform: {
         order: 'post',
+        filter: {
+          id: /\.(css|less|sass|scss|styl|stylus|pcss|postcss|sss)(\?|$)/,
+        },
         handler(_code, id, _options) {
           if (
             this.environment.name === 'client' &&
@@ -2285,13 +2317,15 @@ function vitePluginRscCss(
     {
       name: 'rsc:css-virtual',
       resolveId: {
+        filter: { id: prefixRegex('virtual:vite-rsc/css?') },
         handler(source) {
           if (source.startsWith('virtual:vite-rsc/css?')) {
             return '\0' + source
           }
         },
       },
       load: {
+        filter: { id: prefixRegex('\0virtual:vite-rsc/css?') },
         async handler(id) {
           const parsed = parseCssVirtual(id)
           if (parsed?.type === 'ssr') {
@@ -2334,6 +2368,7 @@ function vitePluginRscCss(
         }
       },
       transform: {
+        filter: { code: 'import.meta.viteRsc.loadCss' },
         async handler(code, id) {
           if (!code.includes('import.meta.viteRsc.loadCss')) return
 
@@ -2401,6 +2436,7 @@ function vitePluginRscCss(
         },
       },
       load: {
+        filter: { id: prefixRegex('\0virtual:vite-rsc/css?') },
         handler(id) {
           const { server } = manager
           const parsed = parseCssVirtual(id)

packages/plugin-rsc/src/plugins/cjs.ts

@@ -18,6 +18,10 @@ export function cjsModuleRunnerPlugin(): Plugin[] {
       apply: 'serve',
       applyToEnvironment: (env) => env.config.dev.moduleRunnerTransform,
       transform: {
+        filter: {
+          id: /\/node_modules\//,
+          code: /\b(require|exports)\b/,
+        },
         async handler(code, id) {
           if (
             id.includes('/node_modules/') &&

packages/plugin-rsc/src/plugins/import-environment.ts

@@ -1,6 +1,7 @@
 import assert from 'node:assert'
 import fs from 'node:fs'
 import path from 'node:path'
+import { exactRegex } from '@rolldown/pluginutils'
 import MagicString from 'magic-string'
 import { stripLiteral } from 'strip-literal'
 import type { Plugin, ResolvedConfig } from 'vite'
@@ -50,6 +51,7 @@ export function vitePluginImportEnvironment(
     {
       name: 'rsc:import-environment',
       resolveId: {
+        filter: { id: exactRegex(ENV_IMPORTS_MANIFEST_PLACEHOLDER) },
         handler(source) {
           // Use placeholder as external, renderChunk will replace with correct relative path
           if (source === ENV_IMPORTS_MANIFEST_PLACEHOLDER) {
@@ -80,6 +82,7 @@ export function vitePluginImportEnvironment(
         }
       },
       transform: {
+        filter: { code: 'import.meta.viteRsc.import' },
         async handler(code, id) {
           if (!code.includes('import.meta.viteRsc.import')) return
 

packages/plugin-rsc/src/plugins/resolved-id-proxy.ts

@@ -1,3 +1,4 @@
+import { prefixRegex } from '@rolldown/pluginutils'
 import type { Plugin } from 'vite'
 
 // Resolved ID proxy plugin
@@ -130,7 +131,7 @@ export function vitePluginResolvedIdProxy(): Plugin {
   return {
     name: 'rsc:resolved-id-proxy',
     resolveId: {
-      // TODO: filter
+      filter: { id: prefixRegex(RESOLVED_ID_PROXY_PREFIX) },
       handler(source) {
         const originalId = fromResolvedIdProxy(source)
         if (originalId !== undefined) {

packages/plugin-rsc/src/plugins/utils.ts

@@ -1,5 +1,6 @@
 import { createHash } from 'node:crypto'
 import path from 'node:path'
+import { exactRegex } from '@rolldown/pluginutils'
 import {
   normalizePath,
   type Plugin,
@@ -41,17 +42,22 @@ export function createVirtualPlugin(
   name: string,
   load: Plugin['load'],
 ): Plugin {
-  name = 'virtual:' + name
+  const virtualId = 'virtual:' + name
+  const resolvedId = '\0' + virtualId
   return {
     name: `rsc:virtual-${name}`,
     resolveId: {
-      handler(source, _importer, _options) {
-        return source === name ? '\0' + name : undefined
+      filter: { id: exactRegex(virtualId) },
+      handler(source) {
+        if (source === virtualId) {
+          return resolvedId
+        }
       },
     },
     load: {
+      filter: { id: exactRegex(resolvedId) },
       handler(id, options) {
-        if (id === '\0' + name) {
+        if (id === resolvedId) {
           return (load as Function).apply(this, [id, options])
         }
       },

packages/plugin-rsc/src/plugins/validate-import.ts

@@ -1,4 +1,5 @@
 import path from 'node:path'
+import { prefixRegex } from '@rolldown/pluginutils'
 import type { DevEnvironment, Plugin, Rollup } from 'vite'
 
 // https://github.com/vercel/next.js/blob/90f564d376153fe0b5808eab7b83665ee5e08aaf/packages/next/src/build/webpack-config.ts#L1249-L1280
@@ -9,6 +10,7 @@ export function validateImportPlugin(): Plugin {
     name: 'rsc:validate-imports',
     resolveId: {
       order: 'pre',
+      filter: { id: /^(client-only|server-only)$/ },
       async handler(source, _importer, options) {
         // optimizer is not aware of server/client boudnary so skip
         if ('scan' in options && options.scan) {
@@ -36,6 +38,7 @@ export function validateImportPlugin(): Plugin {
       },
     },
     load: {
+      filter: { id: prefixRegex('\0virtual:vite-rsc/validate-imports/') },
       handler(id) {
         if (id.startsWith('\0virtual:vite-rsc/validate-imports/invalid/')) {
           // it should surface as build error but we make a runtime error just in case.
@@ -50,6 +53,9 @@ export function validateImportPlugin(): Plugin {
     // for dev, use DevEnvironment.moduleGraph during post transform
     transform: {
       order: 'post',
+      filter: {
+        id: prefixRegex('\0virtual:vite-rsc/validate-imports/invalid/'),
+      },
       async handler(_code, id) {
         if (this.environment.mode === 'dev') {
           if (id.startsWith(`\0virtual:vite-rsc/validate-imports/invalid/`)) {