谷歌页的速度-什么做这些信息的意思吗？

Question

我跑了谷歌页的速度Firefox扩展上的几页，和根据"有效CSS选择"，它列出了各种各样的事情是效率低下在我CSS。

但是，一些消息似乎一点神秘的-什么做这些(以粗体)的意思是：

div#菜单h3。很快小
标签键2裔器和身份证过的合格标签和类过分的条件与标签

表。数据tr：n-儿童(2n)td
标签键2裔选择和类过分的条件与标签

表。数据tr。残疾td
标签键2裔选择和类过分的条件与标签和类过分的条件与标签

我假设他们认为裔选择都是坏的但是有很多的"过分限定"为好。我大概不会去的太多努力修复所有这些(有很多)，但这将是很好的知道什么谷歌实际上意味着在这里！

Answer 1

首先，我从来没有使用网页的速度，但是消息是不是隐秘的，如果你把一个二读它。

div#菜单h3。很快小

标签键2裔选择，并ID过与合格 标签和类过分的条件与 标记

标签键2裔选择: 许多小的标记你有，是不是包含在另一个标签类快？没有？CSS套将完全不必要的，在这种情况。

ID过分的条件与标签: #菜单不需要预先考虑与div。你很可能没有任何其他标签在你的标记与身份菜单(你不应该，其身份证！), 因此加上菜单div多余的。

类过分的条件与标签: .很快就不需要预先考虑与h3。你很可能没有任何其他标签在你的标记与类很快，其他比h3标签，所以加上.很快与h3是不必要的。

其他消息，请按照类似。

-斯蒂芬

Answer 2

斯蒂芬所说的它很好。

原因他们举报你的选择是，CSS规则是匹配的正确的。

加上一个ID和一个元素(如在div#含量)是不必要的，因为将浏览器已经匹配的选择的时间到达"div".但是，浏览器仍然是强制，以评估。

后裔选择是昂贵的，因为将浏览器必须检查所有实例dom件中引用的右最简单的选择对所有可能的祖先。多后裔化合物的表现的刑罚。

这就是说，能增益的实现优化选择(在大多数情况下)是可以忽略不计。

Answer 3

它说，没有理由使用该标记，因为你得到的一类，所以你已经限制了它必须做额外的搜索。

例如：

div#menu h3.soon .small

这里没有任何理由开始div因为你只会看类小类很快在一个h3标签下html元素的与身份菜单。

他们都是表明这样的事情

#menu .soon .small {...}

甚至

#menu {...}

.soon {...}

.small {...}