这样写会访问两次dom节点树，一次读取innerHTML，一次重写innerHTML。

当然，加载速度也是很惊人的。

用一个变量把a存起来，只读取和重写innerHTML一次。

可以看到加载时间大幅度减少。

所以说减少访问dom节点数的访问次数对提高代码运行速度是非常有帮助的。

dom树渲染对性能的影响的更多相关文章

  1. css加载是否会阻塞dom树渲染

    这里说的是头部引入css的情况 首先,我们都知道:css是由单独的下载线程异步下载的. 咱们先分析下css加载会影响什么,刚才的问题太笼统了,咱们需要细化一下. 会影响什么呢? 一个就是DOM树解析, ...

  2. 高频dom操作和页面性能优化（转载）

    作者:gxt19940130 原文:https://feclub.cn/post/content/dom 一.DOM操作影响页面性能的核心问题 通过js操作DOM的代价很高,影响页面性能的主要问题有如 ...

  3. CSS加载不会阻塞DOM树解析

    1.css的加载不会阻塞DOM树解析. 1).css加载不会阻塞DOM树的解析: 2).css加载会阻塞DOM树渲染: 先把DOM树结构先解析完,等CSS加载完后根据最终样式渲染DOM树,免了css加 ...

  4. WebKit Inside: DOM树的构建

    当客户端App主进程创建WKWebView对象时,会创建另外两个子进程:渲染进程与网络进程.主进程WKWebView发起请求时,先将请求转发给渲染进程,渲染进程再转发给网络进程,网络进程请求服务器.如 ...

  5. 【浏览器渲染原理】渲染树构建之渲染树和DOM树的关系（转载 学习中。。。）

    在DOM树构建的同时,浏览器会构建渲染树(render tree).渲染树的节点(渲染器),在Gecko中称为frame,而在webkit中称为renderer.渲染器是在文档解析和创建DOM节点后创 ...

  6. DOM性能瓶颈与Javascript性能优化

    这两天比较闲,写了两篇关于JS性能缺陷与解决方案的文章(<JS特性性能缺陷及JIT的解决方案>,<Javascript垃圾回收浅析>),主要描述了untyped,GC带来的问题 ...

  7. 前端性能优化--为什么DOM操作慢？ 浅谈DOM的操作以及性能优化问题-重绘重排 为什么要减少DOM操作 为什么要减少操作DOM

    前端性能优化--为什么DOM操作慢?   作为一个前端,不能不考虑性能问题.对于大多数前端来说,性能优化的方法可能包括以下这些: 减少HTTP请求(合并css.js,雪碧图/base64图片) 压缩( ...

  8. js和css文件位置对页面性能的影响

    翻译了一篇Performance上的关于页面性能的文章<DecIPhering the critical rendering path>,原文在这里.需要进一步整理和了解有关js.css等 ...

  9. [react] 什么是虚拟dom？虚拟dom比操作原生dom要快吗？虚拟dom是如何转变成真实dom并渲染到页面的?

    壹 ❀ 引 虚拟DOM(Virtual DOM)在前端领域也算是老生常谈的话题了,若你了解过vue或者react一定避不开这个话题,因此虚拟DOM也算是面试中常问的一个点,那么通过本文,你将了解到如下 ...

随机推荐

  1. Java并发编程相关知识整理

    1.什么是进程.线程.多线程?     进程当一个程序开始运行时,它就是一个进程,进程包括运行中的程序和程序所使用到的内存和系统资源.进程间通讯依靠IPC资源,例如管道.套接字     线程是程序中的 ...

  2. FPM三：简单的SEARCH(OIF)

    这里是使用FPM Workbench自动生成的,没有去SE80创建WDA程序. 1.使用事务代码:FPM_WB.打开工作台. 2.点击Wizard for Creating Empty FPM App ...

  3. Wincc报表+Listview使用

    listview在Wincc中可以作为显示的控件,对于列表表头的定义如下所示: list的命名,点击属性,在对象名称中对其定义: 有了listview的定义,就可以使用VBS对其表头的定义.具体代码如 ...

  4. python----常见练习题

    1. 冒泡排序 def bubble_sort(lists): len_list=len(lists) for i in range(len_list): for j in range(len_lis ...

  5. 微信和QQ内置浏览器为什么老是弹停止访问该网页，微信域名被屏蔽的解决办法

    近来很多商家开始重视域名防封的技术了,为什么呢,因为实在是封怕了.三天两头就得去换域名,换域名是小事,用户流失就是大事了,直接跟利益挂钩的.那么域名防封技术究竟有多重要呢?又该如何实现域名防封呢?下面 ...

  6. 下面程序的输出结果是____ A:11,10 B:11,11 C:10,10 D:10,11 int x=10; int y=x++; printf("%d,%d",(x++,y),y++);

    下面程序的输出结果是____ A:11,10 B:11,11 C:10,10 D:10,11 int x=10; int y=x++; printf("%d,%d",(x++,y) ...

  7. laravel使用 面向对象的方式绑定多对多的关系

    创建model文件,并且一起创建migration文件: php   artisan  make:model Habit  -m 创建多对多的中间表的方法: php artisan make:migr ...

  8. C++学习笔记：多态篇之虚函数

    一.类型 在引入多态之前,我们先来看一下多态的两种类型: 二.多态性的概念 多态一词最初来源于希腊语,意思是具有多种形式或形态的情形,在C++中是指同样的消息被不同类型的对象接收时导致不同的行为,这里 ...

  9. Java之for循环嵌套练习

    1.打印4层*** ***** ***** ***** ***** class forfor{ public static void main(String[] args){ for(int y=0; ...

  10. MSSQL2005-由嵌套失误感受到的强大智能优化功能

    在统计一组数据时用到了子查询(子查询用到了count,父查询用了sum) 后语句优化为无子查询 但是跟踪两次的执行计划和IO统计,发现 1.有子查询时扫描计数和逻辑读取远高于无子查询的语句 2.无子查 ...