Skip to content

Support Next.js 16 Turbopack (optimize-locales-plugin) #9213

@FelixK-Witt

Description

@FelixK-Witt

Provide a general summary of the feature here

Next.js 16 has been released and now uses Turbopack as the default bundler for both development (next dev) and production builds (next build).

Currently, @react-aria/optimize-locales-plugin relies entirely on Webpack to tree-shake unused locales. Because Turbopack does not support Webpack plugins, this optimization cannot be applied when using the default Next.js 16 build setup.

Consequently, users migrating to Next.js 16 must choose between:

  1. Fast Builds (Turbopack): Accepting a significantly larger bundle size (shipping all 30+ React Aria locales to production).
  2. Optimized Bundles (Webpack): Opting out of the new default by running next build --webpack and losing the build performance benefits.

🤔 Expected Behavior?

When using Next.js 16 with Turbopack (the default next build), I should be able to configure the build to include only the specific locales I need (e.g., ['en-US']), similar to how the existing Webpack plugin works.

The goal is to achieve the same bundle size savings (stripping unused locale strings) without being forced to opt-out of Turbopack.

😯 Current Behavior

Currently, next build (which defaults to Turbopack in v16) ignores the webpack configuration in next.config.js.

There is no equivalent plugin or documented configuration for Turbopack to handle locale tree-shaking. As a result, the production bundle includes the string definitions for all supported locales, increasing the initial download size for all users.

To get the optimization back, we currently have to force Webpack usage:

"scripts": {
  "build": "next build --webpack"
}

💁 Possible Solution

Since Turbopack does not yet have a public plugin API identical to Webpack's, possible solutions might include:

  1. Alias Configuration: Providing a guide or helper to use Next.js experimental.turbo.resolveAlias to map unused locale files to empty modules manually.
  2. Build Adapters: Utilizing the new Next.js 16 Build Adapters API (Alpha) to hook into the build process.

🔦 Context

We are migrating our application to Next.js 16 and want to leverage the significant build speed improvements provided by Turbopack.

However, we cannot afford the performance regression on the client side caused by shipping unused languages. We are stuck using the legacy Webpack build pipeline specifically because of this missing optimization for React Aria.

💻 Examples

Current Webpack Config (Works):

// next.config.js
const optimizeLocales = require('@react-aria/optimize-locales-plugin');

module.exports = {
  webpack(config) {
    config.plugins.push(
      optimizeLocales.webpack({
        locales: ['en-US', 'fr-FR']
      })
    );
    return config;
  }
};

Desired Turbopack Config (Concept)

module.exports = {
  turbopack: {
    // Potentially using resolveAlias or a new property to exclude specific react-aria/i18n paths
  }
};

🧢 Your Company/Team

No response

🕷 Tracking Issue

No response

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions