perf: migrate on new API, big perf improvement, you need to have at least webpack 5.52.0 (recommended latest stable)

Author: alexander-akait

.github/workflows/nodejs.yml

@@ -90,16 +90,14 @@ jobs:
 
       - name: Run tests for webpack version ${{ matrix.webpack-version }}
         run: npm run test:coverage -- --ci
-        env:
-          EXPERIMENTAL_USE_IMPORT_MODULE: "false"
 
       - name: Submit coverage data to codecov
         uses: codecov/codecov-action@v1
         with:
           token: ${{ secrets.CODECOV_TOKEN }}
 
-  test-new-api:
-    name: Test - ${{ matrix.os }} - Node v${{ matrix.node-version }}, Webpack latest, experimentalUseImportModule
+  test-old-api:
+    name: Test - ${{ matrix.os }} - Node v${{ matrix.node-version }}, Webpack latest, old API
 
     strategy:
       matrix:
@@ -138,7 +136,7 @@ jobs:
       - name: Run tests for webpack version latest with experimentalUseImportModule
         run: npm run test:coverage -- --ci
         env:
-          EXPERIMENTAL_USE_IMPORT_MODULE: "true"
+          OLD_API: "true"
 
       - name: Submit coverage data to codecov
         uses: codecov/codecov-action@v2

README.md

@@ -88,7 +88,7 @@ module.exports = {
 |                  **[`attributes`](#attributes)**                  |      `{Object}`      |                 `{}`                  | Adds custom attributes to the `link` tag for [non-initial (async)](https://webpack.js.org/concepts/under-the-hood/#chunks) CSS chunks     |
 |                    **[`linkType`](#linkType)**                    | `{String\|Boolean}`  |              `text/css`               | Allows loading asynchronous chunks with a custom link type                                                                                |
 |                     **[`runtime`](#runtime)**                     |     `{Boolean}`      |                `true`                 | Allows to enable/disable the runtime generation                                                                                           |
-| **[`experimentalUseImportModule`](#experimentalUseImportModule)** |     `{Boolean}`      |                `false`                | Use an experimental webpack API to execute modules instead of child compilers                                                             |
+| **[`experimentalUseImportModule`](#experimentalUseImportModule)** |     `{Boolean}`      |              `undefined`              | Use an experimental webpack API to execute modules instead of child compilers                                                             |
 
 #### `filename`
 
@@ -301,13 +301,16 @@ module.exports = {
 
 #### `experimentalUseImportModule`
 
-Use an experimental webpack API to execute modules instead of child compilers.
+Type: `Boolean`
+Default: `undefined`
 
-This improves performance and memory usage a lot, but isn't as stable as the normal approach.
+Enabled by default if not explicitly enabled (i.e. `true` and `false` allow you to explicitly control this option) and new API is available (at least webpack `5.52.0` is required).
+Boolean values are available since version `5.33.2`, but you need to enable `experiments.executeModule` (not required from webpack `5.52.0`).
 
-When combined with `experiments.layers`, this adds a `layer` option to the loader options to specify the layer of the css execution.
+Use a new webpack API to execute modules instead of child compilers.
+This improves performance and memory usage a lot.
 
-You need to have at least webpack 5.33.2.
+When combined with `experiments.layers`, this adds a `layer` option to the loader options to specify the layer of the css execution.
 
 **webpack.config.js**
 
@@ -317,6 +320,9 @@ const MiniCssExtractPlugin = require("mini-css-extract-plugin");
 module.exports = {
   plugins: [
     new MiniCssExtractPlugin({
+      // You don't need this for `>= 5.52.0` due to the fact that this is enabled by default
+      // Required only for `>= 5.33.2 & <= 5.52.0`
+      // Not avaliable/unsafe for `<= 5.33.2`
       experimentalUseImportModule: true,
     }),
   ],