单页和多页应用(vue.js学习笔记)

1.什么是单页面和多页面？

单页： 单页应用将所有内容放在一个页面中，从而使整个页面更加流畅就用户体验而言，单机导航可以定位锚点，快速定位相应的部分，并轻松上下滚动。单页面应用提供的信息和一些主要内容已经过筛选和控制，可以简单方便地阅读和浏览

多页：是指包含多个独立页面的应用，其中每个页面都必须重复加载JS，CSS等相关资源。多页应用在跳转时，需要刷新整页资源。 

以下是大概的结构图： 

 

二者之间的区别对比： 

 

 

1.SPA（单页面应用）的优缺点

①优点：

· 具有桌面应用的即时性、网站的可移植性和可访问性。

· 用户体验好、快、内容的改变不需要重新加载整个页面。

· 良好的前后端分离，分工更加明显。

· 维护成本相对较底。

②缺点：

· 不利于搜索引擎的捉取。

· 首次渲染速度相对较慢。

· 开发成本相对较高。

2.MPA（多页面应用）的优缺点

①优点：

· 利于搜索引擎的捉取，搜索引擎优化实现方法简易。

· 首次渲染速度相对较快。

· 开发成本相对较低。

②缺点：

· 页面间切换加载慢，不流畅，用户体验差，尤其在移动端。

· 页面重复代码较多。

· 维护成本相对较高。