vue 服务器渲染

vue 服务器渲染
做用:css

  1. 能够加快首屏渲染速度。
  2. 有利于搜索引擎的seo。

原理:

本身的粗浅理解:html

  1. node端和浏览器端都能运行js。当打开浏览器, 输入项目地址,首先访问node服务器,node服务器渲染 出来返回到浏览器的 只有html文档 和相应的js、css注入,还有node端从api服务器端获取的数据, 通常放在全局的变量里。列window.vueStore = api服务器数据。而后在浏览器端, 当vue 根实例第一次初始化的时候,把数据注入到全局状态管理 vuex里。做为浏览器端相应路由里的数据,给路由级组件 提供 相应的数据状态,而后渲染出相应的虚拟dom, 同时复用node端 返回的已生成的dom节点。由于例如户端渲染的虚拟dom == node端渲染返回的的dom节点。此后浏览器端行为 与node端几乎再也不相关。
  2. 作到两端对路由响应的统一,两端 须要 对同一个路由 响应一样的函数, 如尤大官网上 asyncData,你也能够指定 其余的函数。node端当进入路由 就会解析 配备当前路由的路由组件,而后 把他们(asyncData) 都 找出来, 放在promise.all 里面,等拉去api 服务器端的数据获取完后, 放入全局状态管理 vuex里面。浏览器端 一种实现就是路由hook 里 beforeResolve 里面 完成相似 node端获取数据的方式, 第二种是在路由组件里的 beforeMounted 里面去触发路由组件的this.$options.asyncData.

    详细介绍(尤大官方文档
    开发移动端项目 提供本身改良的nuxt
    nuxt官方文档vue

相关文章
相关标签/搜索