单页面应用（SPA，Single Page Application）和传统的多页面应用（Multiple Page Application）一样，是一种网页应用程序模型。

多页面应用

在传统的多页面应用中，每个页面都是独立的HTML，每次切换页面时，都会重新加载整个页面，从服务器中下载相应的HTML、JS、CSS文件。

单页面应用

SPA，即单页面应用(Single Page Application)。所谓单页 Web 应用，就是只有一张 Web 页面的应用。单页应用程序 (SPA) 是加载单个 HTML 页面并在用户与应用程序交互时动态更新该页面的 Web 应用程序。浏览器一开始会加载必需的 HTML 、 CSS 和 JavaScript ，所有的操作都在这张页面上完成，都由 JavaScript 来控制。

优点

1. 用户体验好

   只需更新局部的UI，避免整个页面的刷新，提供了更快速、流畅的用户体验

2. 减少服务器负载

   相对于传统的多页面应用，不需要每次切换路由，去服务器下载相同的文件

缺点

1. 初次加载时间会长，浏览器空白时间过长

   路由切换展示UI都是通过JS来实现，当项目越来越大时，导致JS文件过长。

2. SEO不友好

   由于SPA主要使用JavaScript进行页面渲染，搜索引擎在爬取页面时可能无法获取完整的页面内容，影响SEO效果。

解决缺点方式

1. 代码分割（code splitting）

2. 按需加载

3. 文件压缩（HTML、JS、CSS、图片等文件）

4. 页面预取（Prefetching）

   在用户浏览当前页面时，提前预取下一个页面所需要的资源。这样可以利用空闲时间加载后续页面的资源，减少页面切换时的加载延迟。

5. 服务端渲染ssr