| 开发分类 | 实现方式 | 页面性能 | 开发效率 | 用户体验 | 学习成本 | 首屏加载 | SEO |
|---|---|---|---|---|---|---|---|
| 单页 | 一个html页面 | 按需更新性能高 | 高 | 非常好 | 高 | 慢 | 差 |
| 多页 | 多个html页面 | 整页更新性能低 | 中等 | 一般 | 中等 | 快 | 优 |
场景
单页面应用
- 系统类网站
- 内部网站
- 文档类网站
- 移动端站点
多页面应用
- 公司官网
- 电商类网站
单页面应用（SPA）
在单页面应用中，应用的所有内容都加载在一个 HTML 文件中。用户访问应用后，JavaScript 接管了页面的渲染和导航工作。单页面应用通过使用路由（Vue Router）来在用户进行导航时更新视图，而不需要刷新整个页面。数据和视图之间的关系是动态的，页面的变化是通过异步请求和前端路由的方式来实现的。
多页面应用（MPA）
在多页面应用中，每个页面都是一个独立的 HTML 文件，每个文件都有自己的 JavaScript 文件。这意味着每个页面都有独立的 Vue 实例，它们之间没有直接的联系。用户通过点击链接或者输入 URL 来切换不同的页面，每次切换都会重新加载整个页面。