@modern-js/main-doc 2.68.8 → 2.68.10

package/docs/en/guides/advanced-features/page-performance/optimize-bundle.mdx

@@ -96,9 +96,23 @@ See details in [plugin-image-compress](https://github.com/rspack-contrib/rsbuild
 
 ## Split Chunk
 
-A great chunk splitting strategy is very important to improve the loading performance of the application. It can make full use of the browser's caching mechanism to reduce the number of requests and improve the loading speed of the application.
-
-A variety of [chunk splitting strategies](https://rsbuild.rs/guide/optimization/split-chunk) are built into Modern.js, which can meet the needs of most applications. You can also customize the chunk splitting config according to your own business scenarios.
+A great code splitting strategy is very important to improve the loading performance of the application. It can make full use of the browser's caching mechanism to reduce the number of requests and improve the loading speed of the application.
+
+Modern.js provides the same [Code Splitting](https://rsbuild.rs/zh/guide/optimization/code-splitting) as Rsbuild. But there are some differences in the default strategy `split-by-experience`.
+
+When the project installs `antd`, `@arco-design/web-react`, or `@douyinfe/semi-ui` packages, it will automatically add the corresponding group. The implementation reference is as follows:
+
+```ts
+if (isPackageInstalled('antd', rootPath)) {
+  groups.antd = ['antd'];
+}
+if (isPackageInstalled('@arco-design/web-react', rootPath)) {
+  groups.arco = [/@?arco-design/];
+}
+if (isPackageInstalled('@douyinfe/semi-ui', rootPath)) {
+  groups.semi = [/@(ies|douyinfe)[\\/]semi-.*/];
+}
+```
 
 For example, split the `axios` library under node_modules into `axios.js`:
 

package/docs/zh/guides/advanced-features/page-performance/optimize-bundle.mdx

@@ -98,9 +98,23 @@ export default {
 
 良好的拆包策略对于提升应用的加载性能是十分重要的，可以充分利用浏览器的缓存机制，减少请求数量，加快页面加载速度。
 
-在 Modern.js 中内置了[多种拆包策略](https://rsbuild.rs/zh/guide/optimization/split-chunk)，可以满足大部分应用的需求，你也可以根据自己的业务场景，自定义拆包配置。
+Modern.js 提供了与 Rsbuild 相同的[拆包策略](https://rsbuild.rs/zh/guide/optimization/code-splitting)，但在默认策略 `split-by-experience` 上有些许差异。
+
+当项目中安装了 `antd`、`@arco-design/web-react` 或 `@douyinfe/semi-ui` 包时，会自动添加对应的分组。具体实现参考：
+
+```ts
+if (isPackageInstalled('antd', rootPath)) {
+  groups.antd = ['antd'];
+}
+if (isPackageInstalled('@arco-design/web-react', rootPath)) {
+  groups.arco = [/@?arco-design/];
+}
+if (isPackageInstalled('@douyinfe/semi-ui', rootPath)) {
+  groups.semi = [/@(ies|douyinfe)[\\/]semi-.*/];
+}
+```
 
-比如将 node_modules 下的 `axios` 库拆分到 `axios.js` 中：
+内置的策略可以满足大部分应用的需求，你也可以根据自己的业务场景，自定义拆包配置。比如将 node_modules 下的 `axios` 库拆分到 `axios.js` 中：
 
 ```js
 export default {

package/package.json

@@ -15,14 +15,14 @@
     "modern",
     "modern.js"
   ],
-  "version": "2.68.8",
+  "version": "2.68.10",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/",
     "access": "public"
   },
   "dependencies": {
     "mermaid": "^11.4.1",
-    "@modern-js/sandpack-react": "2.68.8"
+    "@modern-js/sandpack-react": "2.68.10"
   },
   "devDependencies": {
     "@rsbuild/plugin-sass": "1.3.5",

package/rspress.config.ts

@@ -77,6 +77,12 @@ export default defineConfig({
         mode: 'link',
         content: 'https://github.com/web-infra-dev/modern.js',
       },
+      {
+        icon: 'lark',
+        mode: 'link',
+        content:
+          'https://applink.larkoffice.com/client/chat/chatter/add_by_link?link_token=d21hc667-9403-48a9-ba32-bc1440a80279',
+      },
     ],
   },
   route: {