reactCompiler

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

¥Next.js 15 RC introduced support for the React Compiler. The compiler improves performance by automatically optimizing component rendering. This reduces the amount of manual memoization developers have to do through APIs such as useMemo and useCallback.

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

¥To use it, upgrade to Next.js 15, install the babel-plugin-react-compiler:

npm install babel-plugin-react-compiler

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

¥Then, add experimental.reactCompiler option in next.config.js:

import type { NextConfig } from 'next'

const nextConfig: NextConfig = {
  experimental: {
    reactCompiler: true,
  },
}

export default nextConfig

/** @type {import('next').NextConfig} */
const nextConfig = {
  experimental: {
    reactCompiler: true,
  },
}

module.exports = nextConfig

或者，你可以将编译器配置为在 "opt-in" 模式下运行，如下所示：

¥Optionally, you can configure the compiler to run in "opt-in" mode as follows:

import type { NextConfig } from 'next'

const nextConfig: NextConfig = {
  experimental: {
    reactCompiler: {
      compilationMode: 'annotation',
    },
  },
}

export default nextConfig

/** @type {import('next').NextConfig} */
const nextConfig = {
  experimental: {
    reactCompiler: {
      compilationMode: 'annotation',
    },
  },
}

module.exports = nextConfig

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

¥Note: The React Compiler is currently only possible to use in Next.js through a Babel plugin. This will opt-out of Next.js's default Rust-based compiler, which could result in slower build times. We are working on support for the React Compiler as our default compiler.

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

¥Learn more about the React Compiler, and the available Next.js config options.