DOM编程 --《高性能JavaScript》
2024-08-26 22:34:15
1.重绘和重排
浏览器下载完页面的所有组件 —— HTML标记，CSS，JavaScript，图片，会解析并生成两个内部数据结构。
DOM树
表示页面结构
渲染树（CSS）
表示DOM节点如何显示
当DOM变化影响了元素的几何属性（宽和高）会发生重新构造渲染树，进而进行重绘。
2.重排何时发生
1.添加或删除可见的DOM元素
2.元素的位置改变
3.元素尺寸的改变（外边距，内边距，宽，高，border等）
4.内容改变
5.页面的渲染器初始化
6.浏览器的窗口大小改变
3.最小化重排和重绘
1.使用绝对位置定位页面上的动画元素，使元素脱离文档流
2.对其应用多重改变
3.把元素带回文档中
4.总结
1.最小化DOM访问次数，尽可能在JavaScript端处理
2.如果需要多次访问某个DOM节点，使用局部变量存储起来
3.要留意重绘和重排
4.动画中使用绝对定位，使用拖放代理
5.使用事件委托来减少事件的处理数量。
最新文章
- 独自handle一个数据库大程有感
- Unity3d使用经验总结 数据驱动篇
- goldengate一些参数整理
- 第十五篇 Integration Services：SSIS参数
- 【代码】ini 文件读取工具类
- Ubuntu12.04 下安装Chrome浏览器
- HDOJ1232 并查集
- Coursera 机器学习笔记（四）
- 牛刀小试——记一次帮朋友小幅优化SQL
- C# LINQ语法详解
- SQL 两个表有关联，通过其中一个表的列，更新另一个表的列。
- 自动化发布-GitLab WEB Hooks 配置
- uvm设计分析——callback
- 2017战略No.2：开始电子化记账
- 树莓派进阶之路 (016) - 通过595驱动4位LED显示系统时间
- 代码：css小图标
- erlang的一些系统限制修改
- Exchange Server 2016 管理邮箱收发限制
- 【vue】vue组件的自定义事件
- Python open()文件处理使用介绍