保存成功
订阅成功
保存失败,请重试
提交成功

Vue 全站服务器渲染 SSR 实践

掘金创始人
查看本场Chat

掘金从 0.12.X 版本开始使用 Vue.js 开发产品,途经了掘金及 Vue.js 的高速发展,我们也不断迭代产品经历了 3 次大的重构。2017 过年后我们也经历了有史以来最大的一次重构。这篇文章我会着重讲述重构过程中对于 Vue.js 后端服务器渲染的掘金团队实践。

这里我就不再赘述什么是 Vue.js 了,请需要了解的同学前往:

  1. vuejs.org中文文档

  2. GitHub

  3. 掘金

查看相关资源信息。

服务器端渲染定义

服务器端渲染 Server-Side Rendering 也常被人写作 SSR 是 Vue.js 2.0 版本发布的时候同时推出的功能,Virtual-DOM 的实现让 DOM 生成被 JavaScript 来描述也就给了前后端在 JavaScript 环境下都可以生成页面内容,而其最主要的业务 vue-server-renderer 也包含在了 Vue.js 核心库中。

Why SSR

  1. SEO:除了 Google 和 Bing 比较完美地实现了对于 SPA(Single-Page Application)的爬虫渲染及内容抓取,大多数搜索引擎包括百度都没有支持。因而,包含丰富内容的产品并需要 SEO 流量的产品也就自然需要 SSR 实现。

互动评论
评论
刘雄风7 个月前
内容有点失望
评论
寧采茞8 个月前
内容有些失望。
评论
魏棋棋2 年前
内容有些失望。
评论
Anne2 年前
有点失望。。。。。。
评论
朱元雯 Nina3 年前
项目中有backend文件夹,这里面是后端的代码么?这是代表前后端不分离吗?
评论
candy3 年前
异步请求获得的内容数据怎么等他在服务器抓完,再发回前端。
评论
candy3 年前
当然我用的是react,但原理差不多。为了对同一component不同请求得到的内容的ssr,目前我只能在rendertostring前持续检查props的是否准备好,好了在render,实际上还是很麻烦,因为没有async life cycle。不知道你们怎么处理的,有没有更好的办法。
评论
Server3 年前
晕~ 依然云里雾里
评论
寒霭3 年前
怎么区分开服务器渲染必须请求和浏览器端请求的?看了掘金未登录状态下的SSR很好,可是登陆后基本就没内容,有办法解决么?
评论
阴明(作者)3 年前
我们的业务现在还是未登录状态下触发 ssr,登陆后是前端渲染的
评论
我叫张小咩3 年前
感觉,,挺水的?
评论
SeeYouAgain3 年前
确实
评论
Server3 年前
一头雾水
评论
Server3 年前
请问最佳实践是什么? 要注意什么? 性能怎么优化?
评论
王文斌3 年前
SSR这么贵,我们公司日活500万,是不是可以直接抛弃了。
评论
Server3 年前
分布式咯 搞多几台 前台加个网关负载
评论
查看更多