何为单页面应用？ 何为多页面应用？

英文解释

单页面应用：SinglePage Web Application，简称 SPA

多页面应用：MultiPage Application，简称 MPA

这里我给大家写英文解释的意思不是强迫大家学英语，而是给大家过一眼，这样以后一说到SPA或者MPA大家就能想到单页面或者多页面应用，以后看别人的文章就不会一脸懵逼的问SPA不是脸部护理、音乐按摩、芳香疗法、水疗、泥疗吗？搞得文章作者哭笑不得。

定义区分

（1）单页面应用
只有一个WEB主页面的应用，公共资源(js、css等)仅需加载一次，所有的内容都包含在主页面，对每一个功能模块组件化。单页应用跳转，就是切换相关组件，仅刷新局部资源。常用于PC端官网、购物等网站。

（2）多页面应用
有多个独立的页面的应用，每个公共资源(js、css等)需选择性重新加载，多页面跳转刷新所有资源。常用于 app 或 客户端等。

听完这两种应用的定义是不是有点懵？？

没关系，我举个例子大家就明白了，我用买车来举例吧。比方说我想买一辆汽车，但是买回来之后我觉得颜色不好看，毕竟身为一个猛男，那肯定要选粉色啊，本来想重新换一辆的，但是老板说，那我给你上个漆，这样不就不用重新买了，而且还不用花那么多钱，就补个上漆钱。这里汽车本体相当于公共资源，上漆相当于切换相关组件，然后应用就完成了，而且页面切换快，毕竟上个漆能花多少时间。这个例子就是单页面应用场景，这么说大家应该就能理解了吧。

接下来再举一个例子，又是某一天，我突然发现粉色太幼稚了，而且心情不好，丢了一沓钞票给老板，我要换车跟这个一模一样的，我要黑色的。老板拧不过我，只好安排其他地方的开一辆过来。这里我换了一个黑色的车，不是上漆，而是一整辆换掉，在这里汽车每一个部分都进行了重新加载。这个例子就是多页面应用场景，每换一辆都重新加载，这么说大家应该就能理解了吧。

至于两种应用的优缺点我拿了其中一个大佬的一张图

图来源于这位大佬 www.liangxinghua.com/article/det…