vue-ssr

2022-06-06 16:07:07 浏览数 (1)

什么是服务器端渲染 (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

0 人点赞