通过在屏幕外渲染来隐藏 DIV 时的性能影响
在屏幕外 DIV 中隐藏 HTML 文档的复杂部分对性能有何影响
<div style="position:absolute;top:-10000px;left:-10000px;">
Lots of HTML here...
</div>
与使用“display: none”或“visiblity: hide”相比,
?是否存在性能/内存使用损失?有多糟糕? 如果目标是移动浏览器(iPhone/Android),这是否可取?
What are the performance implications of hiding a complex portion of an HTML document within an offscreen DIV like:
<div style="position:absolute;top:-10000px;left:-10000px;">
Lots of HTML here...
</div>
as compared to using "display: none" or "visiblity: hidden" ?
Is there a performance/memory-usage penalty? How bad is it?
Can this be advisable if the targets are mobile browsers (iPhone/Android)?
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
这取决于浏览器。 这里是关于浏览器中渲染、回流重绘的好文章。因此,从理论上讲,当侧面发生更改时,不应渲染它,因为当父元素发生更改时,所有绝对定位元素都不会重新渲染。因此它应该比 display:none 表现更好,它将 重新渲染例如 IE。但浏览器内存中仍然有大量 DOM 元素。因此,也许最好将元素从 DOM 中取出,稍后再添加它们。
It depends on the browser. Here is good article about rendering, reflow repaint in browsers. So theoretically it should be not rendered when something changed on the side as all absolute positioned elements will not rerendered when something changed in there parent elements. So it should perform better then display:none which will be rerendered in IE for example. But you have still a lot of DOM elements in browser memory. So maybe its better to put the elements out of the DOM and add them again later.
从性能角度来看,您最好将 HTML 构建为字符串,然后将其一次性插入到 DOM 中。 DOM 更改会触发重绘,因此 DOM 更改越少越好。
Performance-wise you're best to build up your HTML as a string as insert it into the DOM in one go. DOM changes trigger redraws, so the fewer DOM changes the better.