美文网首页
渲染方式

渲染方式

作者: YQY_苑 | 来源:发表于2020-07-02 21:20 被阅读0次

BSR 客户端渲染

只在浏览器上执行的渲染
例如常用到的 Js, Vue ,React 等 创建HTML

  • 缺点
  1. 白屏:在ajax得到响应前,页面中白屏或者展示展位数据
  2. 对SEO不友好
image.png
  • 图中的静态内容,由后端返回,但一共渲染两次。第一次是后端返回是渲染,然后前端在进行一次渲染进行对比并且添加事件监听,以确保全后端渲染结果一致。

在后端renderToString() 在前端hydrate() , 文档

SSG (静态页面生成)Static Site Generators

动态内容静态化,后端直接把数据放置渲染好,然后以静态方式传给前端直接渲染,前端无需再请求ajax

  • 优点
  1. 解决白屏,请求多问题
  • 缺点
  1. 内容无法定制化,每个用户看到的页面都是统一的

SSR 服务端渲染 (server side render)

相关文章

  • 渲染方式

    BSR 客户端渲染 只在浏览器上执行的渲染例如常用到的 Js, Vue ,React 等 创建HTML 缺点 白...

  • Android 图形渲染应用层简述

    一. 图形渲染方式 Android 图像渲染有两种方式一是 CPU 渲染, 另一种是 GPU 渲染 一) CPU ...

  • Paint高级用法

    渲染 Shader 着色器 Shader有5中渲染方式 BitmapShader 位图渲染 LinearGradi...

  • Vue渲染方式

    前言 所有代码运行Vue版本:2.5.16 Vue中的渲染方式个人总结可分为4种: 原有模板语法,挂载渲染 使用r...

  • NO.6 - 离屏渲染

    1.什么是离屏渲染 1.1渲染方式一:当前屏幕渲染 On-Screen Rendering意为当前屏幕渲染,指的是...

  • iOS离屏渲染原理

    1.什么是离屏渲染 说到离屏渲染,那我们就要说一下苹果的渲染方式有哪些,首先苹果这边渲染方式主要有两种On-S...

  • 三、iOS离屏渲染

    iOS离屏渲染 圆角不一定会造成离屏渲染 GPU屏幕渲染方式 On-Screen Rendering 当前屏幕渲染...

  • Vue&React条件渲染

    声明: 条件渲染的方式 条件渲染也有两种方式: 以Vue为代表的模板语言式的条件渲染,比如特殊的控制标签,特殊的控...

  • iOS-离屏渲染详解

    屏幕渲染 OpenGL中,GPU屏幕渲染有两种方式. On-Screen Rendering (当前屏幕渲染)指的...

  • vue 渲染函数 & JSX

    渲染函数 render 通过渲染函数渲染组件 渲染后: JSX 通过以上方式创建虚拟DOM,语法比较繁琐。可以使用...

网友评论

      本文标题:渲染方式

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