什么是服务器端渲染 (SSR)?
所谓的服务端渲染其实并不是上面新奇的东西,顾名思义,就是页面的生成是在服务端完成的。
它自上古以来(很久很久以前)就已经存在了,传统的 jsp 页面、asp.net等页面都可以看做是服务端渲染的页面。
既然如此,为什么会单独拿出来说事儿呢?
单页应用(SPA single-page application)
之所以单独拿服务端渲染说事,就是因为近几年兴起的“单页应用”。
什么是单页应用呢?
单页应用,是一种网络应用程序或网站的模型,它通过动态重写当前页面来与用户交互,而非传统的从服务器重新加载整个新页面。这种方法避免了页面之间切换打断用户体验,使应用程序更像一个桌面应用程序。 —— 维基百科
举例来说,最近几年兴起的,用 vue、react、Angular等技术开发的将传统的 html 开发转变为 js开发,然后在前端生成虚拟 DOM ,并在前端直接通过 js 绘制的页面,而且在前端自己维护的一套前端路由,通过前端路由切换页面的应用就是典型的单页应用。
单页应用的好处多多,能够实现前端页面平滑无刷新切换,能够实现虚拟DOM快速响应用户交互等等
但是,其缺点也有,那就是首次渲染页面相对 ssr 会慢一些,而且,因为其是在前端通过js绘制的页面,这就导致了它对搜索引擎抓取网站内容造成了一些阻碍,对 SEO 不友好。
当然,随着近几年单页应用越来越火热,搜索引擎(如google)也对单页应用做了相应的优化。
为什么使用服务器端渲染 (SSR)?
所以,我们为什么要使用服务端渲染呢?
1、页面首页渲染更快,减少白屏时长
2、SEO 优化
因此,对于某些业务场景,如果需要关注如上两点的,就需要作出相应的优化。
而服务端渲染 SSR 就是为了解决这几个问题的。
这里说的 SSR 相对于传统的 SSR 的优势就在于能够在使用最新技术(vue、react等)的同时做到SSR。
服务端渲染脚手架
这个是本人自己整理的 vue+koa+webpack4的服务端渲染脚手架
https://github.com/zhoushirong/vue-koa-ssr.git