基础 00 前端常见问题01

SPA 和 MPA 的区别？

SPA（single-page application）单页应用，是一种网络应用程序或网站的模型，它通过动态重写当前页面来与用户交互，这种方法避免了页面之间跳转，所有必要的代码（HTML、JavaScript 和 CSS）都通过单个页面的加载而检索，或者根据需要（通常是为响应用户操作）动态装载适当的资源。

MPA（MultiPage-page application）多页应用，即每个页面都是一个主页面，都是独立的。每次访问另一个页面都需要重新加载 html、css、js 等文件。

SPA 优点： 用户体验好、快，内容的改变不需要重新加载整个页面；SPA 缺点： 不利于搜索引擎的抓取、首次渲染速度相对较慢。

SPA 实现 SEO 的三种方式：

• SSR 服务端渲染：将组件或页面通过服务器生成 html，再返回给浏览器，如，nuxt.js。

• 静态化： 目前主流的静态化主要有两种：一种是通过程序将动态页面抓取并保存为静态页面，实际存在于服务器的硬盘中；另外一种是通过 Web 服务器的 URL Rewrite 的方式，其原理是通过 Web 服务器内部模块按一定规则将外部的 URL 请求转化为内部的文件地址，也就是，把外部请求的静态地址转化为实际的动态页面地址，而静态页面实际是不存在的。

• 使用 Phantomjs 针对爬虫处理：原理是通过 Nginx 配置，判断访问来源是否为爬虫，如果是则搜索引擎的爬虫请求会转发到一个 node server，再通过 PhantomJS 来解析完整的 HTML，返回给爬虫。