reactCompiler

此 API 目前处于实验阶段，可能会发生变化。

Next.js 15 RC 引入了对 React 编译器的支持。编译器通过自动优化组件渲染来提高性能。这减少了开发人员必须通过诸如 useMemo 和 useCallback 之类的 API 进行手动记忆化的次数。

要使用它，请升级到 Next.js 15，安装 babel-plugin-react-compiler

终端

npm install babel-plugin-react-compiler

然后，在 next.config.js 中添加 experimental.reactCompiler 选项

next.config.ts

import type { NextConfig } from 'next'
 
const nextConfig: NextConfig = {
  experimental: {
    reactCompiler: true,
  },
}
 
export default nextConfig

可选地，您可以将编译器配置为以“选择加入”模式运行，如下所示

next.config.ts

import type { NextConfig } from 'next'
 
const nextConfig: NextConfig = {
  experimental: {
    reactCompiler: {
      compilationMode: 'annotation',
    },
  },
}
 
export default nextConfig

注意：React 编译器目前只能通过 Babel 插件在 Next.js 中使用。这将选择退出 Next.js 的默认基于 Rust 的编译器，这可能会导致构建时间变慢。我们正在努力支持 React 编译器作为我们的默认编译器。

详细了解 React 编译器以及可用的 Next.js 配置选项。