docs: move overview to getting started page

  hash: ae70cd3277ef4a92a4d75b3a029942d245066df5

docs: fix learn more button
  hash: 5eb36c0465f64dfd3e71aafb0447c3a9ca0ceec1

Author: ShenQingchuan

.vitepress/config.js

@@ -56,8 +56,8 @@ module.exports = {
           text: '指引',
           children: [
             {
-              text: '介绍',
-              link: '/guide/introduction'
+              text: '为什么选 Vite',
+              link: '/guide/why'
             },
             {
               text: '开始',

guide/features.md

@@ -320,7 +320,7 @@ Vite 会为入口 chunk 和它们在打包出的 HTML 中的直接引入自动
 
 在实际项目中，Rollup 通常会生成 “共用” chunk —— 被两个或以上的其他 chunk 共享的 chunk。与动态导入相结合，会很容易出现下面这种场景：
 
-![graph](/graph.png)
+![graph](/images/graph.png)
 
 在无优化的情境下，当异步 chunk `A` 被导入时，浏览器将必须请求和解析 `A`，然后它才能弄清楚它首先需要那个共用 chunk `C`。这会导致额外的网络往返：
 

guide/index.md

@@ -1,6 +1,20 @@
 # 开始
 
-如果你有兴趣在尝试之前了解更多关于 Vite 的信息，请移步 [介绍](./introduction) 章节。
+## 总览
+
+Vite (法语意为 "快速的"，发音 `/vit/`) 是一种新型前端构建工具，能够显著提升前端开发体验，它主要由两部分组成：
+
+- 一个针对 [原生 ES Modules](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Modules) 有许多增强功能的开发服务器，并附带 [丰富的内建功能](./features) 和速度快到惊人的 [模块热重载（HMR）](./features#hot-module-replacement)。
+
+- 一套 [构建指令](./build) 使用 [Rollup](https://rollupjs.org) 打包你的代码，预配置输出高度优化的静态资源用于生产。
+
+此外，Vite 通过它的 [插件 API](./api-plugin) 和 [JavaScript API](./api-javascript) 具有高度的可扩展性，并支持全类型。
+
+## 浏览器支持
+
+- 开发环境中：Vite 需要在支持 [原生 ES 模块动态导入](https://caniuse.com/es6-module-dynamic-import) 的浏览器中使用。
+
+- 生产环境中：默认的构建目标浏览器支持 [通过脚本标签来引入原生 ES 模块](https://caniuse.com/es6-module) 。可以通过官方插件 [@vitejs/plugin-legacy](https://github.com/vitejs/vite/tree/main/packages/plugin-legacy) 支持传统浏览器。有关更多细节详见 [构建生产版本](./build)。
 
 ## 第一个 Vite 项目
 

guide/introduction.md renamed to guide/why.md

@@ -1,14 +1,4 @@
-# 介绍
-
-## 总览
-
-Vite (法语意为 "快速的"，发音 `/vit/`) 是一种新型前端构建工具，能够显著提升前端开发体验，它主要由两部分组成：
-
-- 一个针对 [原生 ES Modules](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Modules) 有许多增强功能的开发服务器，并附带 [丰富的内建功能](./features) 和速度快到惊人的 [模块热重载（HMR）](./features#hot-module-replacement)。
-
-- 一套 [构建指令](./build) 使用 [Rollup](https://rollupjs.org) 打包你的代码，预配置输出高度优化的静态资源用于生产。
-
-此外，Vite 通过它的 [插件 API](./api-plugin) 和 [JavaScript API](./api-javascript) 具有高度的可扩展性，并支持全类型。
+# 为什么选 Vite
 
 ## 现实问题
 
@@ -40,7 +30,9 @@ Vite 通过在一开始将应用中的模块区分为两类：**依赖** 和 **
 
 ### 缓慢的更新
 
-当基于打包器启动时，编辑文件后将重新构建文件本身，打包器同时会使其模块图的一部分失活<sup>[[1]](#footnote-1)</sup>并重新整体构建。这样代价很高，并且重新加载页面会消除应用程序的当前状态，所以打包器支持了动态模块热重载（HMR）：允许一个模块 “热替换” 它自己，而对页面其余部分没有影响。这大大改进了开发体验 - 然而，在实践中我们发现，即使是 HMR 更新速度也会随着应用程序规模的增长而显著下降。
+当基于打包器启动时，编辑文件后将重新构建文件本身。很显然我们不应该重新构建整个包，因为这样更新速度会随着应用体积增长而直线下降。
+
+一些打包器的开发服务器将构建内容存入内存，这样它们只需要在文件更改时使模块图的一部分失活<sup>[[1]](#footnote-1)</sup>，但它也仍需要整个重新构建并重载页面。这样代价很高，并且重新加载页面会消除应用程序的当前状态，所以打包器支持了动态模块热重载（HMR）：允许一个模块 “热替换” 它自己，而对页面其余部分没有影响。这大大改进了开发体验 - 然而，在实践中我们发现，即使是 HMR 更新速度也会随着应用程序规模的增长而显著下降。
 
 在 Vite 中，HMR 是在原生 ESM 上执行的。当编辑一个文件时，Vite 只需要精确地使已编辑的模块与其最近的 HMR 边界之间的链失效（大多数时候只需要模块本身），使 HMR 更新始终快速，无论应用程序的大小。
 
@@ -58,12 +50,6 @@ Vite 同时利用 HTTP 头来加速整个页面的加载（再次让浏览器为
 
 虽然 `esbuild` 快得惊人，也已经是一个在构建库方面比较出色的工具，但一些针对构建 _应用_ 的重要功能仍然还在持续开发中 —— 特别是代码分割和 CSS 处理方面。就目前来说，Rollup 在应用打包方面更加成熟和灵活。尽管如此，当未来这些功能稳定后，我们也不排除使用 `esbuild` 作为生产构建器的可能。
 
-## 浏览器支持
-
-- Vite 需要在支持 [原生 ES 模块动态导入](https://caniuse.com/es6-module-dynamic-import) 的浏览器中使用。
-
-- 生产版本通过 [脚本标签来对原生 ES 模块](https://caniuse.com/es6-module) 提供基本支持。Vite 默认情况下 **不** 执行任何兼容性转换。可以通过官方插件支持传统浏览器。有关更多细节，详见 [构建生产版本](./build)。
-
 ## Vite 与 X 的区别是？
 
 你可以查看 [比较](./comparisons) 章节获取更多细节，了解 Vite 与同类工具的异同。

public/graph.png renamed to images/graph.png

@@ -5,7 +5,7 @@ actionText: 开始
 actionLink: /guide/
 
 altActionText: 了解更多
-altActionLink: /guide/introduction
+altActionLink: /guide/why
 
 features:
   - title: 💡 极速的服务启动