Skip to content

Latest commit

 

History

History
67 lines (54 loc) · 1.53 KB

README.CN.md

File metadata and controls

67 lines (54 loc) · 1.53 KB

vue-ssr-jit

English

一种用于服务端渲染的即时编译技术。在运行时使用 Diff 算法推导动静节点,生成并运行新的渲染树,从而大幅提升渲染性能。

如下 vue 模板:

<template>
  <div>
    <router-link to="/">{{name}}</router-link>
    <router-view></router-view>
  </div>
</template>

<script>
export default {
  data() {
    return {
      name: 'vue-ssr-jit'
    }
  }
}
</script>

官方编译器生成的代码:

_c("div", [
  _c("router-link", {attrs: { to: "/" }}, [
    _vm._v(_vm._s(_vm.name))
  ]),
  _c("router-view")
], 1)

使用 vue-ssr-jit 生成的代码:

_c("div", [
  _vm._ssrNode(
    "<a href=\"/\" class=\"router-link-active\">vue-ssr-jit</a>"
  ),
  _c("router-view")
], 1);

用法

npm install --save vue-ssr-jit
const { createBundleRenderer } = require('vue-ssr-jit')

createBundleRenderer 与官方同名函数接口一致,参考 vue ssr 指南

推荐使用 serverPrefetch 预取数据,也支持使用 asyncData 预取数据,参考 demo

实现原理

Vue SSR 即时编译技术

注意

这项技术目前处于试验阶段

License

MIT