Vue 路由器如何帮助更快地加载页面？

Question

所以我今天才进入Vue路由器的话题。我知道它通过防止整个页面每次都刷新但只带来必要的组件来帮助更快地加载内容。

但是它不是在访问主页时就加载了整个 bundle.js 文件（通过 Webpack）吗？那么既然我们在第一次访问时就已经加载了整个JS文件，那么访问不同页面时是否不需要调用单独的JS文件？

This是我看的课

Answer 1

您所说的主要好处是从一个 URL 导航到另一个。

通常，这需要加载整页，例如

Page1.html   click link   Page2.html
 - JS                           - JS
 - CSS                          - CSS
 - Images                       - Images

但是通过使用组件路由器，您只需要换出页面中已更改的部分，而无需重新加载所有布局。

这实际上是所谓的 Single-page application 的核心，您的应用实际上是一个 HTML 页面，其中包含响应 URL 更改的部分。

URL 无需加载整页即可更改 URI fragment (aka hash) or by using the browser's History API。

在 Vue Router 中，这个选择由 mode configuration 控制。

---

"But didn't it just load the whole bundle.js file"

不一定。参见 Lazy Loading Routes。