Js 是单线程执行引擎。在我们动态修改一些属性时会产生两种效果:
   1、Repaint ----- 一部分重画,修改 div 的颜色呀,但是尺寸没有改变。
   2、Reflow ---- 元素的尺寸改变了,浏览器要重新布局。
   浏览器是不会你改变一次样式它就会 repaint 或 reflow 一次。而是把这样的操作积攒一批,然后统一做一次 reflow。这又叫做异步 reflow或增量异步 reflow。就是一个函数执行完后把函数内所有样式一下执行完毕。
   例如:我们在做一个简单的反选的时候,如果反选函数里面要执行一个很大的运算,即使反选代码执行完毕了,但是效果还是不会实现,而且会一直卡在哪里。因为 Js 是单线程,后面的运算占住了线程,所以浏览器在等待 Js 执行完毕,才会进行 reflow。我们可以把两个功能拆分开(因为函数执行完毕就释放了,只要函数内某一运算过分大就不会影响效果),然后把大的运算拆分成很小的函数,让定时器间隔调用,到达指定值定时器消失,。

js对浏览器产生的影响的更多相关文章

  1. js屏蔽浏览器右键菜单,粘贴,复制,剪切,选中(转)

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  2. js高级-浏览器事件循环机制Event Loop

    JavaScript 是队列的形式一个个执行的 同一时间只能执行一段代码,单线程的  (队列的数据结构) 浏览器是多线程的 JavaScript执行线程负责执行js代码 UI线程负责UI展示的 Jav ...

  3. JS高级——浏览器的线程

    基本概念 1.js的执行过程是单线程的模式,也就是同步进行,只有前面的代码执行完了才会往下面执行 2.但是执行js代码也只是浏览器的线程之一所负责的事情,这个线程被称为js引擎,浏览器还具有其他线程: ...

  4. Chromium Graphics: Android L平台上WebView的变化及其对浏览器厂商的影响分析

    原创文章.转载请以链接形式注明原始出处为http://blog.csdn.net/hongbomin/article/details/40799167. 摘要:Google近期公布的Android L ...

  5. 【转】javascript浏览器参数的操作,js获取浏览器参数

    原文地址:http://www.haorooms.com/post/js_url_canshu html5修改浏览器地址:http://www.cnblogs.com/JiangXiaoTian/ar ...

  6. js get browser vertion (js获取浏览器信息版本)

    1问题:js get browser vertion (js获取浏览器信息版本) 2解决方案 Copy this script into your JavaScript files. It works ...

  7. js获取浏览器高度

    常用: JS 获取浏览器窗口大小 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 // 获取窗口宽度 if (window.innerWidth) winWidth = ...

  8. Vis.js – 基于浏览器的动态 JavaScript 可视化库

    Vis.js 是一个动态的,基于浏览器的可视化库.该库被设计为易于使用,能处理大量的动态数据.该库由以下几部分组成:一是数据集和数据视图,基于灵活的键/值数据集,可以添加,更新和删除项目,订阅数据集变 ...

  9. JS获取浏览器高度 并赋值给类

    在给网站做轮播焦点图的时候,如果需要全屏的话,可以用下面的jQuery来获取浏览器高度,然后赋值给类. $(window).load(function () { var maxHeight = 0; ...

随机推荐

  1. ETL工具的功能和kettle如何来提供这些功能

    不多说,直接上干货! 大家会有一个疑惑,本系列博客是Kettle,那怎么扯上ETL呢? Kettle是一款国外开源的ETL工具,纯java编写,可以在Window.Linux.Unix上运行. 说白了 ...

  2. Quartz介绍和使用

    Quartz介绍和使用 什么是Quartz,干什么的? Quartz框架是一个全功能.开源的任务调度服务,可以集成几乎任何的java应用程序—从小的单片机系统到大型的电子商务系统.Quartz可以执行 ...

  3. [转帖]关于Xilinx下Micro_Blaze中UartLite232外设的使用

    来源:https://blog.csdn.net/shen_you/article/details/78713746

  4. php如何实现文件下载

    php如何实现文件下载 1. 设置超链接的href属性 <ahref="文件地址"></a> 如果浏览器不能解析该文件,浏览器会自动下载.而如果文件是图片或 ...

  5. 函数签名与消息转发:NSInvocation与NSMethodSignature

    具体可见 https://developer.apple.com/library/mac/documentation/Cocoa/Conceptual/ObjCRuntimeGuide/Article ...

  6. Ini配置文件操作

    package cn.com.szhtkj.util; import java.io.File; import java.io.FileOutputStream; import java.io.IOE ...

  7. vue v-if的使用

    代码部分 <el-row> <el-col :span="20"> <template v-for="(node,i) of hierarc ...

  8. kissy延迟加载demo

    <!doctype html><html><head>    <meta charset="gbk"/>    <title& ...

  9. luogu P4430 小猴打架(prufer编码与Cayley定理)

    题意 n个点问有多少种有顺序的连接方法把这些点连成一棵树. (n<=106) 题解 了解有关prufer编码与Cayley定理的知识. 可知带标号的无根树有nn-2种.然后n-1条边有(n-1) ...

  10. maven使用技巧

    转:MAVEN常用命令 Maven库: http://repo2.maven.org/maven2/ Maven依赖查询: http://mvnrepository.com/ Maven常用命令: 1 ...