美文网首页马文的地下室SSR
学习笔记《Vue 的 SSR》

学习笔记《Vue 的 SSR》

作者: 马文Marvin | 来源:发表于2017-05-06 02:36 被阅读113次

Server-side rendering (SSR) is a design concept for full-stack web apps that provides a rendered page to the browser. The idea is that the page can be shown while the user waits for scripts to be downloaded and run.

同一个地址,当用户在 Url 中直接访问的时候,就直接 SSR 输出,当用户点击站内链接访问的时候,则正常 SPA 载入数据,SSR 这种代码设计的概念,就是为了满足这一需求,一套代码,实现两种载入方式,这个想法真的是挺美的~

Vue 有详细的 SSR 使用的文档:
https://ssr.vuejs.org/

Pre-rendering 的局限:

Pre-rendering 也是一种 SEO 问题的解决方案,但是局限也非常明显:

Some pages, like the front page of your site, will probably contain general content i.e. content that all users will view the same. But other pages, like admin pages, will contain user-specific content, for example a user’s name and birth date.

The limitation of PR is that it can’t be used for pages that contain such content. As I just said, the pre-rendered templates are only made once and can’t be customised. SSR does not have this limitation.

SSR 前后的比较:

传统模式 SSR
缺点 SEO问题 增加了复杂度
代码运行环境 各种浏览器 服务器(V8)
优化方向 文件合并压缩 CPU内存使用
技术侧重 传统前端技术 Node.js

问题:

根据 SSR 的原来,PHP 是否可以做 SSR 呢?比如将所有前端路由所需要使用到的 ajax 接口提前配置好,然后 CURL 到数据后送给一个 ssrData 的对象,再通过 Vue 操作 ssrData 将数据导入到 Vuex 呢?

因为自己做的产品是工具类的,所以不特别具有 SSR 的需求,后续在实际运用的时候,会进一步的补充这篇文档

相关文章

  • Vue SSR 学习笔记

    什么是服务器端渲染(SSR)? Vue.js是构建客户端应用程序的框架。默认情况下,可以在浏览器中输出Vue组件...

  • Vue SSR 学习笔记

    这是一篇各处抄来的流水账 为什么ssr ssr目的从来不是争论的焦点:SEO & 首屏加载时间SEO很容易理解,全...

  • 学习笔记《Vue 的 SSR》

    Server-side rendering (SSR) is a design concept for full-...

  • VUE SSR

    VUE SSR 官方文档: Vue SSR 指南 一、什么是SSR, 为什么要做SSR 什么是SSRVue.js ...

  • Vue-SSR学习笔记

    1. 导航链接,超链接的书写形式,类似router-link 2. 基础路由的展示 pages下的目录结构: 这时...

  • vue ssr笔记

    bsr:浏览器渲染ssr:服务端渲染。更好的seo(特别是有些信息平台类的站点,更需要被搜索引擎优先搜到);更好的...

  • 详解Vue SSR服务端渲染

    Vue SSR介绍[https://ssr.vuejs.org/zh/] SSR Github Demo[http...

  • 使用 Vue SSR 渲染一个 Vue 实例

    Vue SSR 介绍 官方文档:https://ssr.vuejs.org/[https://ssr.vuejs....

  • Vue.js学习系列七——Vue服务器渲染Nuxt学习

    我又回来啦~这次我们来学习Vue的服务器渲染SSR。 关于SSR的文章网上很多,一开始看得我云里雾里。然后去Vue...

  • SSR介绍-2: 传统SSR实现

    此篇文章将结合vue来简单介绍如何实现传统的SSR,为后续实现现今流行的SSR打个基础。参考vue ssr官网:h...

网友评论

    本文标题:学习笔记《Vue 的 SSR》

    本文链接:https://www.haomeiwen.com/subject/arnjtxtx.html