splitChunks disabled by default in webpack 5

[viyatgandhi]

react version: 18.1.0
webpack version: 5.64.4
react-scripts: 5.0.1

From the docs of react (https://create-react-app.dev/docs/production-build/) it seems logical to have splitChunks enabled by default in webpack config but latest config (https://github.com/facebook/create-react-app/blob/main/packages/react-scripts/config/webpack.config.js) does not have splitChunks enabled.

Is there a reason why it is not set? From performance perspective it seems logical to have vendor chunks separated from main application code.

with default webpack config as above:

npm run build

> [email protected] build
> react-scripts build --stats

Creating an optimized production build...
Compiled successfully.

File sizes after gzip:

  501.55 kB  build/static/js/main.8443ad0a.js
  70.27 kB  build/static/css/main.af43c399.css

After adding below piece of attributes in webpack config (ref from:

create-react-app/packages/react-scripts/config/webpack.config.prod.js

Line 161 in 52449c3

splitChunks: {

)

  optimization: {
      splitChunks: {
        // include all types of chunks
        chunks: 'all',
      },
      minimize: isEnvProduction,
      minimizer: [
        // This is only used in production mode
        new TerserPlugin({...

It generates below files which makes more sense:

npm run build             

> [email protected] build
> react-scripts build --stats

Creating an optimized production build...
Compiled successfully.

File sizes after gzip:

  480.77 kB              build/static/js/704.24d6c80b.js
  67.16 kB               build/static/css/704.9f22c355.css
  30.83 kB (-470.72 kB)  build/static/js/main.ecc21e9c.js
  3.34 kB (-66.93 kB)    build/static/css/main.038da9a8.css

[JeremyGrieshop]

#11763

This PR for adding 5 lines has been sitting there for 9 months.