1. 什么是ssr（Server-Side Rendering）

    前端的页面都是后端将html拼接好，然后将它返回给前端完整的html文件，浏览器拿到这个文件就可以直接显示了。

    1. 服务端渲染(ssr)的优缺点

    优点：

    • 首屏渲染的话比较快。
    • 有利于SEO

    缺点：

    • 不容易维护，比如说前端调整了部分样式css或者html，那么后端也要对应的修改。
    • 项目整体的复杂度比较高，前后端耦合，相互依赖，学习成本比较高。
    • 服务器的负荷比较大。
    • 开发效率低，开发调试困难。
      1. 客户端渲染的优缺点

    优点：

    • 网络传输的数据量相对较少，服务器负荷小。
    • 耦合性低，前后分离，局部刷新交互较好。
    • 项目复杂度相对较低，学习成本低。

    缺点：

    • 不利于SEO，搜索引擎爬虫获取不到完整的程序源码。
    • 首屏渲染慢，第一次加载的时候需要加载一堆资源。
      1. 目前常见的三大框架（angularJS，react，vue）

    巧了这个几个都是SPA框架的。SPA是什么呢！：
    SPA全称single page application，是一种网络应用程序（WebAPP）模型，在传统网站中，不同的页面之前的切换都是直接从服务器加载一整个新的页面，而在SPA这个模型中，是通过动态图地重写页面的部分与用户交互，避免了过多的重复交互，响应速度自然相对较高。

    SPA的优缺点：

    • csr有的优点SPA都有，还有就是，页面切换非常快，服务器的压力也相对较小
    • 最大的两个缺点就是首屏加载慢，和SEO困难

    SEO全称Search Engine Optimization：

    • 搜索引擎的优化，就是用过了解搜索引擎的运作规则（如何抓取网站页面，如何索引以及根据特定的关键字展现搜索结果排序）来调整网站，以提高网站在搜索引擎中的关键字搜索排名。

    常用技术就是大概两种：

    • 描述,即HTML标签的description，例如百度百科的一个词条的 description,
    • 关键字, 即HTML标签的keywords， 例如:
    1. SPA与SEO的冲突

    前面我们谈到的SPA不利于SEO，因为就目前而言，部分搜索引擎如Google、bing等，它们的爬虫虽然已经支持执行JS甚至是通过AJAX获取数据了，但是对于异步数据的支持也还不足(也可能是搜索引擎提供商觉得没必要)。
    前面也谈到过SPA应用中，通常通过AJAX获取数据，而这里就难以保证我们的页面能被搜索引擎正常收录到。并且有一些搜索引擎不支持执行JS和通过AJAX获取数据，那就更不用提SEO了。
    对于有些网站而言，SEO显得至关重要，那么ssr应运而生了。

    ssr搭配：
    React —> Next
    vue —> Nuxt

    本文的resource：
    ssr(服务端渲染)和csr客户端渲染.xmind