太多的ID会伤害到性能吗？ [英] Does Too many ids hurt performance
问题描述
如果我在页面中不必要的 id s元素，比如 HTML助手在 ASP.Net-MVC 。
它是否会降低我的id选择器的性能？ （我有一个包含大量元素的页面）
示例：
//第一个DOM
< HTML>
...
< input type =textvalue =firstid =useless/>
< input type =textvalue =secondid =useful/>
< / HTML>
//第二个DOM
< HTML>
...
< input type =textvalue =first/>
< input type =textvalue =secondid =useful/>
< / HTML>
脚本：
<脚本>
alert（$（'＃useful'）。val（））;
//从不选择第一个元素（带有无用的id）
< / script>
简短的回答，不。
http://www.stevesouders.com/blog/2009/03/10/performance-impact-of-css-selectors/
几个月前，有一些关于低效CSS选择器对性能影响的文章。我很好奇 - 这是我为之而活的浏览器特质行为。在进一步的调查中，我不太确定是否值得让CSS选择器更有效率。我会走的更远，并说如果我们明天醒来，每个网页的CSS选择器都被神奇地优化了，我不认为有人会注意到...
我修改了测试如下：
- 2000个锚点和2000个规则（而不是20,000个） - 这实际上导致〜6000个DOM元素，因为所有嵌套在P，DIV，DIV，DIV中
- 基线页面和标签选择器页面与所有其他页面一样具有2000个规则，但这些是简单的类别规则，不匹配任何类别在页面中
我在12个浏览器上运行了这些测试。页面渲染时间是使用页面顶部和底部的脚本块测量的。 （我从本地磁盘加载页面以避免可能来自分块编码的影响）...
基于这些测试，我有以下假设：对于大多数网站，优化CSS选择器可能带来的性能收益会很小，不值得花费。有一些类型的CSS规则和与JavaScript的交互可以使页面明显变慢。这是重点所在......
If I have in the page unnecessary ids on elements, like the HTML Helper does in ASP.Net-MVC.
Does it reduce the performace of my id selectors? (I have a page with enormous amout of elements)
Example:
// First DOM
<HTML>
...
<input type="text" value="first" id="useless" />
<input type="text" value="second" id="useful" />
</HTML>
// Second DOM
<HTML>
...
<input type="text" value="first"/>
<input type="text" value="second" id="useful" />
</HTML>
Script:
<script>
alert($('#useful').val());
// never select the first element (with the useless id)
</script>
Short answer, no.
http://www.stevesouders.com/blog/2009/03/10/performance-impact-of-css-selectors/
A few months back there were some posts about the performance impact of inefficient CSS selectors. I was intrigued – this is the kind of browser idiosyncratic behavior that I live for. On further investigation, I’m not so sure that it’s worth the time to make CSS selectors more efficient. I’ll go even farther and say I don’t think anyone would notice if we woke up tomorrow and every web page’s CSS selectors were magically optimized...
I revised the test as follows:
- 2000 anchors and 2000 rules (instead of 20,000) – this actually results in ~6000 DOM elements because of all the nesting in P, DIV, DIV, DIV
- the baseline page and tag selector page have 2000 rules just like all the other pages, but these are simple class rules that don’t match any classes in the page
I ran these tests on 12 browsers. Page render time was measured with a script block at the top and bottom of the page. (I loaded the page from local disk to avoid possible impact from chunked encoding.)...
Based on these tests I have the following hypothesis: For most web sites, the possible performance gains from optimizing CSS selectors will be small, and are not worth the costs. There are some types of CSS rules and interactions with JavaScript that can make a page noticeably slower. This is where the focus should be...
这篇关于太多的ID会伤害到性能吗？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
