什么是DOM渲染:

  DOM渲染是浏览器展现给用户的DOM文档的生成的过程。

DOM渲染的演化过程:

  ①纯后端渲染

  ②纯前端渲染

  ③服务端的js渲染结合前端渲染

  纯后端渲染:DOM树的生成完全是在后端服务器中完成,服务器的程序会把各种的数据拼成一个DOM树。采用这样的渲染方式,就是每一个页面中,在Chrome中展开得到的DOM,和服务器返回的DOM基本一致。这个过程会有少部分js代码,不过这并不影响DOM的主体是服务器返回的。

  纯前端渲染:后端只返回一个DOM框架,DOM生成的主体逻辑在前端,js代码将页面的主体渲染到前端。

  服务端的js渲染结合前端渲染:前面两种渲染中有一些任务,交给纯后端DOM渲染逻辑分离的不好,交给纯前端DOM渲染会造成较长的延迟,所以分离出来了一个独立DOM渲染阶段。从SEO角度来说很友好,但是加大了开发难度。

传统的DOM渲染方式的更多相关文章

  1. 传统的DOM渲染方式?

    1.什么是DOM渲染? 所谓的DOM渲染是指的是对于浏览器中展现给用户的DOM文档的生成的过程. 2.DOM渲染的过程,大致可以分为三个阶段: --纯后端渲染 --纯前端渲染 --服务端的JS渲染结合 ...

  2. 传统的dom的渲染方式

    DOM渲染的过程大致分为三个阶段: 后端渲染 前端渲染 独立DOM渲染(前后端相结合渲染) 1.后端渲染:DOM树的生成完全是在后端服务器中完成的,后端服务器的程序会把需要的数据拼合成一个类似于前端D ...

  3. 前端之:传统的DOM是如何渲染的?

    a.纯后端渲染:页面发送请求,后端服务器中将数据拼成完整DOM树,并转换成一个字节流作为HTTP Response的body返回给浏览器.优点在于 返回的HTTP Response是包含着全部页面内容 ...

  4. Javascript:再论Javascript的单线程机制 之 DOM渲染时机

    Javascript:再论Javascript的单线程机制 之 DOM渲染时机 背景 Javascript是单线程事件驱动的,所有能看到的Javascript代码都是在一个线程执行,定时器回调和AJA ...

  5. vue2.0的虚拟DOM渲染

    1.为什么需要虚拟DOM 前面我们从零开始写了一个简单的类Vue框架(文章链接),其中的模板解析和渲染是通过Compile函数来完成的,采用了文档碎片代替了直接对页面中DOM元素的操作,在完成数据的更 ...

  6. Vue(4)- 获取原生的DOM的方式、DIY脚手架、vue-cli的使用

    一.获取原生的DOM的方式 在js中,我们可以通过id.class或者标签获取DOM元素,vue中也为我们提供了获取原生DOM的方法,就是给标签或者组件添加ref属性,通过this.$refs获取,如 ...

  7. Vue 4 -- 获取原生的DOM的方式、DIY脚手架、vue-cli的使用

    一.获取原生的DOM的方式 在js中,我们可以通过id.class或者标签获取DOM元素,vue中也为我们提供了获取原生DOM的方法,就是给标签或者组件添加ref属性,通过this.$refs获取,如 ...

  8. 用java操作XML文件(DOM解析方式)

    XML 可扩展标记语言(Extensible Markup Language),是独立于软件和硬件的传输工具. XML的作用: (1)用作配置文件 (2)简化数据共享 (3)简化数据传输 XML DO ...

  9. document.compatMode(判断当前浏览器采用的渲染方式)

    转载自:http://www.cnblogs.com/fullhouse/archive/2012/01/17/2324706.html IE对盒模型的渲染在 Standards Mode和Quirk ...

随机推荐

  1. 【转】np.random.random()函数 参数用法以及numpy.random系列函数大全

    转自:https://www.cnblogs.com/DOMLX/p/9751471.html 1.np.random.random()函数参数 np.random.random((1000, 20) ...

  2. npm install说明

    一.常用简写 npm install=npm i.在git clone项目的时候,项目文件中并没有 node_modules文件夹,项目的依赖文件可能很大.直接执行,npm会根据package.jso ...

  3. linux中dd命令详解

    本文转自:https://www.cnblogs.com/yuanqiangfei/p/9138625.html 一.dd命令的解释 dd:用指定大小的块拷贝一个文件,并在拷贝的同时进行指定的转换. ...

  4. PHP匿名函数的写法

    传统写法<pre>function timer () { echo "hello world";}Swoole\Timer::tick(2000, 'timer');& ...

  5. (转)dnSpy 强大的.Net反编译软件

    目录 1. Debug外部引用的Dll文件2. 调试应用程序3. 修改exe文件的内容 作者:D.泡沫 一说起.net的反编译软件,大家首先想到的就是Reflector,ILSpy,dotPeek等等 ...

  6. 你必须知道的EF知识和经验(转)

    注意:以下内容如果没有特别申明,默认使用的EF6.0版本,code first模式. 推荐MiniProfiler插件 工欲善其事,必先利其器. 我们使用EF和在很大程度提高了开发速度,不过随之带来的 ...

  7. Centos7编译安装Nginx+keepalived

    一.安装环境.主机信息及软件版本 Nginx:1.12.2keepalived:2.0.12时间同步(同步后确认各服务器时间是否一致,不一致需要修改一下时区) 关闭防火墙 二.编译安装Nginx 1. ...

  8. Spring源码系列 — Envoriment组件

    何为Envoriment Envoriment是集成在Spring上下文容器中的核心组件,在Spring源码中由Envoriment接口抽象. 在Environment中,有两大主要概念: Profi ...

  9. 转 tty 设备读写

    转自https://feng-qi.github.io/2017/05/04/how-to-read-write-to-tty-device/ <p>这是 StackExchange 上的 ...

  10. java架构之路-(nginx使用详解)nginx的反向代理和优化配置

    书接上回说,nginx我们学会了简单的配置.那么我今天来聊一下,我们ngxin的一些优化配置(我不是很懂,不敢谈高级配置).我先来看一下nginx的好处和正向代理. nginx的好处 1.可以高并发连 ...