Taro v3.5: Supercharging Build Speed with Webpack 5, Module Federation, and React 18 Support

1. Build Speed Improvements

Taro v3.5 refactors the compilation system and adds Webpack 5 support to accelerate builds. Key enhancements include:

Native Webpack 5 integration

Dependency pre‑bundling using Module Federation

JS compression with esbuild and CSS compression with esbuild or @parcel/css Replacing @babel/register with @swc/register for faster transpilation

Webpack 5’s persistent caching is disabled by default; developers can enable it after defining a cache strategy (see mini.cache documentation).

Dependency Pre‑bundling

Inspired by UmiJS mfsu, Taro uses Module Federation to pre‑bundle node_modules into a remote app, eliminating repeated dependency compilation. The process consists of three steps:

Collect dependencies (via esbuild)

Bundle the collected dependencies

Package the bundle as a Module Federation remote application

During development, the remote app is used as a Webpack entry, allowing subsequent builds to compile only application code.

Dependency pre‑bundling flowchart:

Performance Results

Using the NutUI component library as a benchmark, the following observations were made:

In dev mode, Taro’s default pre‑bundling makes Webpack 5 slightly faster than Webpack 4; in prod mode, speeds are comparable because pre‑bundling is disabled.

When the cache is fully hit, Webpack 5 dramatically outperforms Webpack 4, even after partial cache invalidation.

To enable these features, upgrade the project and modify config/index.js:

/** config/index.js */
const config = {
  // Choose compiler: 'Webpack4' or 'Webpack5'
  compiler: {
    type: 'webpack5',
    // Enable dependency pre‑bundling
    prebundle: {
      enable: true
    }
  },
  // Enable persistent cache
  cache: {
    enable: true
  }
}

2. React 18 Compatibility

Taro now supports React 18’s new features (Automatic Batching, Transitions, Concurrent rendering). By default it runs in legacy mode; to switch to concurrent mode, adjust the React plugin configuration:

/** config/index.js */
const config = {
  plugins: [
    ['@tarojs/plugin-framework-react', { reactMode: 'concurrent' }]
  ]
}

Remember to upgrade the project’s React version to v18.

3. Server‑Side Rendering (SSR) Support

Taro’s open architecture allows plugins to add new platforms. A Next.js plugin ( SyMind/tarojs-plugin-platform-nextjs) enables SSR. The plugin is early‑stage and not recommended for production.

Installation & Usage

# Using npm
npm install tarojs-plugin-platform-nextjs next

# Using pnpm
pnpm install tarojs-plugin-platform-nextjs next

Add the plugin to the Taro compile configuration:

const config = {
  plugins: [
    'tarojs-plugin-platform-nextjs'
  ]
}

Build the Next.js target:

npx taro build --type nextjs --watch

4. Multi‑Page Application (MPA) Support

Taro re‑introduces MPA by adjusting taro-loader and taro-router. Enable it with:

module.exports = {
  h5: {
    router: {
      mode: 'multi'
    }
  }
}

Note the limitations: duplicated TabBar loading, repeated App lifecycle, no route animations, and extra routing configuration are required.

5. Expo‑Based React Native Modules

Expo modules replace the older unimodules system. Taro v3.5+ uses the new system; developers can select the react-native template via taro init or switch to the 0.67.0-expo branch for existing shell projects.

6. Upgrade Guide

Install the beta CLI: npm i -g @tarojs/cli@beta Update project dependencies to 3.5.0@beta and apply framework‑specific breakings:

Vue2: add @vue/babel-preset-jsx Vue3: add @vue/babel-plugin-jsx React: add @pmmmwh/react-refresh-webpack-plugin and react-refresh PReact: add @prefresh/webpack and @prefresh/babel-plugin Remove old runner packages ( @tarojs/mini-runner, @tarojs/webpack-runner) and add @tarojs/webpack5-runner.

Set compiler: 'webpack5' in the build config and enable the desired features (persistent cache, pre‑bundle, etc.).

Future Plans

Subsequent iterations will bring Vite support in v3.6 and further runtime optimizations.

Community contributors are encouraged to join the open‑source effort via the newly clarified participation and honor mechanisms.