zoukankan      html  css  js  c++  java
  • 基于Vue的SSR

    一、什么是ssr?

      - server side render 服务端渲染

      基于 Vue/React 单页面应用 实现的服务器端渲染

      1、传统的vue纯浏览器端渲染 - 浏览器端执行 js

            

    优点

    1、局部刷新,用户体验优

    2、富交互

    3、节约服务器成本

    缺点

    1、不利于Seo 爬取返回的html页面,搜索引擎只能收录静态页面,不执行js

    2、浏览器任务重,一直在执行js,内存占用高

    3、首屏加载问题,需要等js运行才能展示

      2、ssr - 执行 js,除了浏览器还有node

            

           怎么把vue实例用node渲染成html字符串?

           核心库:

              · vue

              · vue-server-renderer

            ssr需要哪些东西?

              

              · 纯浏览器渲染的入口有哪些?main.js

              · ssr 需要两个入口:客户端+服务端,生成的bundle也是两个

      

    二、自己手动搭建一个vue+ssr项目

      特性:

        1、每一次访问必须新建一个vue实例

        2、只会触发组件的 beforeCreate 和 created 钩子,所以需要客户端 js

       手动改造的源码见 :https://gitlab.com/pfSlight/vue-ssr-test.git 

    三、ssr框架Nuxt

      vue - Nuxt

      react - next

       1、创建项目: vue init nuxt-community/starter-template vue-ssr-nuxt

       2、查看创建的项目:https://gitlab.com/pfSlight/vue-ssr-nuxt.git

  • 相关阅读:
    css3阴影效果
    应该了解的9种CSS技巧
    position
    MyEclipse设置Java代码注释模板
    Struts2 常用的常量配置
    CSS 中文字体对应英文和Unicode编码
    MyEclipse使用前优化与配置
    MyEclipse 快捷键收集
    Ajax 调用WebServices之一 基本应用
    C#控制台显示进度条
  • 原文地址:https://www.cnblogs.com/slightFly/p/15104861.html
Copyright © 2011-2022 走看看