首页 > TAG信息列表 > DocumentFragment
documentFragment深入理解
documentFragment深入理解 抽疯的稻草绳关注 0.4482020.12.27 16:42:40字数 178阅读 3,225 documentFragment是一个保存多个element的容器对象（保存在内存）当更新其中的一个或者多个element时，页面不会更新。只有当documentFragment容器中保存的所有element更新后再将其插入到浅谈重绘和重排（回流）以及如何减少或避免回流
重绘和重排的概念，如何减少或避免回流 1.重绘（repaint）2.重排（reflow）3.引起重排的原因4.如何减少和避免重排 1.重绘（repaint） 屏幕的一部分要重绘。渲染树节点发生改变，但不影响该节点在页面当中的空间位置及大小。譬如某个div标签节点的背景颜色、字体颜色等等发生改变，但是该ddocumentFragment文档碎片
documentFragment是一个保存多个element的容器对象（保存在内存）当更新其中的一个或者多个element时，页面不会更新。只有当documentFragment容器中保存的所有element更新后再将其插入到页面中才能更新页面。documentFragment用来批量更新列如将ul里面的li取出放到documentFragment,更页面优化，DocumentFragment对象详解
DocumentFragment不是真实DOM树的一部分，它的变化不会引起DOM树的重新渲染的操作(reflow) ，且不会导致性能等问题。---MDN DocumentFragment 节点插入文档树时，插入的不是 DocumentFragment 自身，而是它的所有子孙节点。这使得 DocumentFragment 成了有用的占位符，暂时存放那些一次插入requestIdleCallback 示例
requestIdleCallback 示例 通过具体例子，来理解浏览器性能优化相关的api，即requestIdleCallback. 示例一 /** * 原文网站 * https://www.cnblogs.com/galenyip/p/4856996.html */ var eventsToSend = []; var isRequestIdleCallbackScheduled = false; function onNavOpen