docs: add docs for splitChunks.usedExports

tests/webpack-test/__snapshots__/StatsTestCases.basictest.js.snap

@@ -175,23 +175,27 @@ multiple-vendors:
   multiple-vendors (Rspack x.x.x) compiled successfully
 
 all:
-  chunk (runtime: main) all/async-c.js (async-c) (id hint: vendors) 116 bytes [rendered]
-    > ./c ./index.js 3:0-47
-    ./c.js 116 bytes [built] [code generated]
-  chunk (runtime: main) all/async-a.js (async-a) (id hint: vendors) 185 bytes [rendered]
-    > ./a ./index.js 1:0-47
-    dependent modules 20 bytes [dependent] 1 module
-    ./a.js 165 bytes [built] [code generated]
-  chunk (runtime: main) all/async-b.js (async-b) (id hint: vendors) 116 bytes [rendered]
+  Entrypoint main 10.5 KiB = all/605.js 762 bytes all/main.js 9.8 KiB
+  Entrypoint a 10.3 KiB = all/272.js 501 bytes all/a.js 9.8 KiB
+  Entrypoint b 4.25 KiB = all/726.js 262 bytes all/b.js 3.99 KiB
+  Entrypoint c 4.24 KiB = all/29.js 261 bytes all/c.js 3.99 KiB
+  chunk (runtime: main) all/199.js (id hint: vendors) 116 bytes [rendered] split chunk (cache group: vendors)
     > ./b ./index.js 2:0-47
     ./b.js 116 bytes [built] [code generated]
+  chunk (runtime: a) all/272.js (id hint: vendors) 165 bytes [initial] [rendered] split chunk (cache group: vendors)
+    > ./a a
+    ./a.js 165 bytes [built] [code generated]
+  chunk (runtime: c) all/29.js (id hint: vendors) 116 bytes [initial] [rendered] split chunk (cache group: vendors)
+    > ./c c
+    ./c.js 116 bytes [built] [code generated]
   chunk (runtime: main) all/310.js (id hint: vendors) 20 bytes [rendered] split chunk (cache group: vendors)
     > ./a ./index.js 1:0-47
     > ./b ./index.js 2:0-47
     ./node_modules/y.js 20 bytes [built] [code generated]
-  chunk (runtime: main) all/416.js (id hint: vendors) 20 bytes [rendered] split chunk (cache group: defaultVendors)
+  chunk (runtime: main) all/364.js (id hint: vendors) 136 bytes [rendered] split chunk (cache group: vendors)
     > ./c ./index.js 3:0-47
-    ./node_modules/z.js 20 bytes [built] [code generated]
+    dependent modules 20 bytes [dependent] 1 module
+    ./c.js 116 bytes [built] [code generated]
   chunk (runtime: main) all/457.js (id hint: vendors) 40 bytes [rendered] split chunk (cache group: vendors)
     > ./a ./index.js 1:0-47
     > ./b ./index.js 2:0-47
@@ -203,21 +207,27 @@ all:
     > ./c ./index.js 3:0-47
     > ./g ./a.js 6:0-47
     ./f.js 20 bytes [built] [code generated]
-  chunk (runtime: a) all/a.js (a) (id hint: vendors) 165 bytes (javascript) 6.98 KiB (runtime) [entry] [rendered]
-    > ./a a
-    ./a.js 165 bytes [built] [code generated]
-  chunk (runtime: b) all/b.js (b) (id hint: vendors) 116 bytes [entry] [rendered]
+  chunk (runtime: main) all/605.js (id hint: vendors) 147 bytes [initial] [rendered] split chunk (cache group: vendors)
+    > ./ main
+    ./index.js 147 bytes [built] [code generated]
+  chunk (runtime: b) all/726.js (id hint: vendors) 116 bytes [initial] [rendered] split chunk (cache group: vendors)
     > ./b b
     ./b.js 116 bytes [built] [code generated]
-  chunk (runtime: c) all/c.js (c) (id hint: vendors) 116 bytes [entry] [rendered]
+  chunk (runtime: a) all/a.js (a) 8.03 KiB [entry] [rendered]
+    > ./a a
+  chunk (runtime: b) all/b.js (b) 2.58 KiB [entry] [rendered]
+    > ./b b
+  chunk (runtime: c) all/c.js (c) 2.58 KiB [entry] [rendered]
     > ./c c
-    ./c.js 116 bytes [built] [code generated]
-  chunk (runtime: main) all/main.js (main) (id hint: vendors) 147 bytes (javascript) 7.03 KiB (runtime) [entry] [rendered]
-    > ./ main
-    ./index.js 147 bytes [built] [code generated]
-  chunk (runtime: a, main) all/async-g.js (async-g) (id hint: vendors) 45 bytes [rendered]
+  chunk (runtime: a, main) all/889.js (id hint: vendors) 45 bytes [rendered] split chunk (cache group: vendors)
     > ./g ./a.js 6:0-47
     ./g.js 45 bytes [built] [code generated]
+  chunk (runtime: main) all/main.js (main) 8.03 KiB [entry] [rendered]
+    > ./ main
+  chunk (runtime: main) all/910.js (id hint: vendors) 185 bytes [rendered] split chunk (cache group: vendors)
+    > ./a ./index.js 1:0-47
+    dependent modules 20 bytes [dependent] 1 module
+    ./a.js 165 bytes [built] [code generated]
   all (Rspack x.x.x) compiled successfully"
 `;
 
@@ -530,29 +540,32 @@ Rspack x.x.x compiled with 2 warnings"
 `;
 
 exports[`StatsTestCases should print correct stats for issue-7577 1`] = `
-"asset a-runtime~main-6f980b3fe4e873c8018a.js 3.69 KiB [emitted] [immutable] (name: runtime~main)
-asset a-main-74eb98039f994af619b3.js 323 bytes [emitted] [immutable] (name: main) (id hint: all)
-Entrypoint main 4 KiB = a-runtime~main-6f980b3fe4e873c8018a.js 3.69 KiB a-main-74eb98039f994af619b3.js 323 bytes
+"asset a-runtime~main-c4a0be3dc26f064b4283.js 3.69 KiB [emitted] [immutable] (name: runtime~main)
+asset a-main-b9f0cc0473486a71c3d1.js 387 bytes [emitted] [immutable] (name: main)
+asset a-all-a_js-46301f7a16444535097a.js 128 bytes [emitted] [immutable] (id hint: all)
+Entrypoint main 4.19 KiB = a-runtime~main-c4a0be3dc26f064b4283.js 3.69 KiB a-all-a_js-46301f7a16444535097a.js 128 bytes a-main-b9f0cc0473486a71c3d1.js 387 bytes
 runtime modules 2.59 KiB 3 modules
 ./a.js 18 bytes [built] [code generated]
 Rspack x.x.x compiled successfully in X.23
 
-asset b-runtime~main-841c6f8661ffb8487676.js 4.39 KiB [emitted] [immutable] (name: runtime~main)
-asset b-main-7a912c9e72d35b5ccb33.js 779 bytes [emitted] [immutable] (name: main) (id hint: all)
+asset b-runtime~main-48886b0bb08b3987a553.js 4.39 KiB [emitted] [immutable] (name: runtime~main)
+asset b-all-b_js-242da217bb553f79303f.js 461 bytes [emitted] [immutable] (id hint: all)
+asset b-main-72ac2a7c5326395bcc89.js 420 bytes [emitted] [immutable] (name: main)
 asset b-vendors-node_modules_vendor_js-97d43f84c65cc0e25938.js 173 bytes [emitted] [immutable] (id hint: vendors)
-Entrypoint main 5.32 KiB = b-runtime~main-841c6f8661ffb8487676.js 4.39 KiB b-vendors-node_modules_vendor_js-97d43f84c65cc0e25938.js 173 bytes b-main-7a912c9e72d35b5ccb33.js 779 bytes
+Entrypoint main 5.42 KiB = b-runtime~main-48886b0bb08b3987a553.js 4.39 KiB b-vendors-node_modules_vendor_js-97d43f84c65cc0e25938.js 173 bytes b-all-b_js-242da217bb553f79303f.js 461 bytes b-main-72ac2a7c5326395bcc89.js 420 bytes
 runtime modules 3.17 KiB 5 modules
 cacheable modules 40 bytes
   ./b.js 17 bytes [built] [code generated]
   ./node_modules/vendor.js 23 bytes [built] [code generated]
 Rspack x.x.x compiled successfully in X.23
 
-assets by chunk 1.29 KiB (id hint: all)
-  asset c-main-badd31d63df8ff8ef439.js 833 bytes [emitted] [immutable] (name: main) (id hint: all)
+assets by chunk 870 bytes (id hint: all)
   asset c-all-b_js-a364a38577953cc2ab7c.js 488 bytes [emitted] [immutable] (id hint: all)
-asset c-runtime~main-758a5f5cc29c2a3b8870.js 10.8 KiB [emitted] [immutable] (name: runtime~main)
+  asset c-all-c_js-a54d408465645a2aea4f.js 382 bytes [emitted] [immutable] (id hint: all)
+asset c-runtime~main-13146ab0d777c036e368.js 10.8 KiB [emitted] [immutable] (name: runtime~main)
+asset c-main-4bdbd2cfa296de1ab23e.js 643 bytes [emitted] [immutable] (name: main)
 asset c-vendors-node_modules_vendor_js-97d43f84c65cc0e25938.js 173 bytes [emitted] [immutable] (id hint: vendors)
-Entrypoint main 11.6 KiB = c-runtime~main-758a5f5cc29c2a3b8870.js 10.8 KiB c-main-badd31d63df8ff8ef439.js 833 bytes
+Entrypoint main 11.8 KiB = c-runtime~main-13146ab0d777c036e368.js 10.8 KiB c-all-c_js-a54d408465645a2aea4f.js 382 bytes c-main-4bdbd2cfa296de1ab23e.js 643 bytes
 runtime modules 9.38 KiB 13 modules
 cacheable modules 101 bytes
   ./c.js 61 bytes [built] [code generated]

website/docs/en/plugins/webpack/split-chunks-plugin.mdx

@@ -227,6 +227,56 @@ If the `splitChunks.name` matches an [entry point](/config/entry) name, the entr
 
 :::
 
+### splitChunks.usedExports
+
+<ApiMeta addedVersion="1.0.0" />
+
+- **Type:** `boolean`
+- **Default:** Value of [optimization.usedExports](/config/optimization#optimizationusedexports)
+
+Enabling this configuration, the splitting of chunks will be grouped based on the usage of modules exports in different runtimes, ensuring the optimal loading size in each runtime.
+
+For example, if there are three entry points named `foo`, `bar`, and `baz`, they all depend on the same module called `shared`. However, `foo` and `bar` depend on the export `value1` from `shared`, while `baz` depends on the export `value2` from `shared`.
+
+```js title=foo.js
+import { value1 } from 'shared';
+value1;
+```
+
+```js title=bar.js
+import { value1 } from 'shared';
+value1;
+```
+
+```js title=baz.js
+import { value2 } from 'shared';
+value2;
+```
+
+In the default strategy, the `shared` module appears in 3 chunks. If it meets the [minSize for splitting](plugins/webpack/split-chunks-plugin#splitchunksminsize), then the `shared` module should be extracted into a separate chunk.
+
+```
+chunk foo, chunk bar
+      \
+      chunk shared (exports value1 and value2)
+      /
+chunk baz
+```
+
+However, this would result in none of the three entry points having the optimal loaded size. Loading the `shared` module from the `foo` and `bar` entries would unnecessarily load the export `value2`, while loading from the `baz` entry would unnecessarily load the export `value1`.
+
+When the `splitChunks.usedExports` optimization is enabled, it analyzes which exports of the `shared` module are used in different entries. It finds that the exports used in `foo` and `bar` are different from those in `baz`, resulting in the creation of two distinct chunks, one corresponding to the entries `foo` and `bar`, and the other corresponding to the entry `baz`.
+
+```
+chunk foo, chunk bar
+        \
+      chunk shared-1 (exports only value1)
+
+chunk baz
+        \
+      chunk shared-2 (exports only value2)
+```
+
 ### splitChunks.cacheGroups
 
 Cache groups can inherit and/or override any options from `splitChunks.*`; but `test`, `priority` and `reuseExistingChunk` can only be configured on cache group level. To disable any of the default cache groups, set them to `false`.

website/docs/zh/plugins/webpack/split-chunks-plugin.mdx

@@ -217,6 +217,56 @@ module.exports = {
 
 :::
 
+### splitChunks.usedExports
+
+<ApiMeta addedVersion="1.0.0" />
+
+- **类型：** `boolean`
+- **默认值：** 默认值为 [optimization.usedExports](/config/optimization#optimizationusedexports)
+
+开启该配置后，在拆分 chunk 将根据 module 在不同 runtime 中导出的使用情况进行分组，保持在不同 runtime 中都是最优的加载体积。
+
+举个例子，如果一次构建中有 3 个入口分别名为 foo, bar 和 baz，他们都依赖了一个相同的模块 shared，但 foo 和 bar 依赖 shared 中的导出 value1，而 baz 依赖了 shared 中的导出 value2。
+
+```js title=foo.js
+import { value1 } from 'shared';
+value1;
+```
+
+```js title=bar.js
+import { value1 } from 'shared';
+value1;
+```
+
+```js title=baz.js
+import { value2 } from 'shared';
+value2;
+```
+
+默认的策略中 shared 模块由于同时出现在 3 个 chunk 中，如果它满足了[最小拆分体积](plugins/webpack/split-chunks-plugin#splitchunksminsize)，那么 shared 本该被抽离到一个单独 chunk 中。
+
+```
+chunk foo, chunk bar
+      \
+      chunk shared (exports value1 and value2)
+      /
+chunk baz
+```
+
+但这样会导致 3 个入口都不满足最佳的加载体积，从 foo 和 bar 入口加载 shared 会多加载并不需要的导出 value2，而从 baz 入口加载 shared 会多加载并不需要的导出 value1。
+
+当开启 `splitChunks.usedExports` 优化后，会分析 shared 模块分别在不同入口中用到的导出，发现在 foo 和 bar 中用到的导出和 baz 中不一样，会产生 2 个不同的 chunk，其中一个对应入口 foo 和 bar，另一个对应入口 baz。
+
+```
+chunk foo, chunk bar
+        \
+      chunk shared-1 (exports only value1)
+
+chunk baz
+        \
+      chunk shared-2 (exports only value2)
+```
+
 ### splitChunks.cacheGroups
 
 缓存组可以继承和/或覆盖来自 `splitChunks.*` 的任何选项。但是 `test`、`priority` 和 `reuseExistingChunk` 只能在缓存组级别上进行配置。将它们设置为 `false` 以禁用任何默认缓存组。