reactCompiler

Next.js 15 RC는 React 컴파일러에 대한 지원을 도입했습니다. 이 컴파일러는 컴포넌트 렌더링을 자동으로 최적화하여 성능을 향상시킵니다. 이를 통해 개발자가 useMemo와 useCallback 같은 API를 통해 수동으로 메모이제이션을 해야 하는 양을 줄일 수 있습니다.

사용하려면 Next.js 15로 업그레이드하고 babel-plugin-react-compiler를 설치하세요:

Terminal

npm install babel-plugin-react-compiler

그런 다음 next.config.js에 experimental.reactCompiler 옵션을 추가하세요:

next.config.js

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

선택적으로 컴파일러가 "opt-in" 모드에서 실행되도록 다음과 같이 구성할 수 있습니다:

next.config.ts

const nextConfig = {
  experimental: {
    reactCompiler: {
      compilationMode: "annotation",
    },
  },
};
 
module.exports = nextConfig;

참고: React 컴파일러는 현재 Next.js에서 Babel 플러그인을 통해서만 사용할 수 있습니다. 이는 Next.js의 기본 Rust 기반 컴파일러를 opt-out하게 되어 빌드 시간이 더 느려질 수 있습니다. 우리는 React 컴파일러를 기본 컴파일러로 지원하기 위해 노력하고 있습니다.

React 컴파일러와 사용 가능한 Next.js 구성 옵션에 대해 자세히 알아보세요.

productionBrowserSourceMaps reactMaxHeadersLength