CSS 选择器引擎:从右到左阅读
在 CSS 世界中,通常假设像 .name 这样的选择器执行速度比 div.name 更快。然而,最近的一些研究结果表明,大多数选择器引擎都是从右向左读取的。这引发了关于性能影响和这种方法背后的推理的问题。
从右到左评估
虽然 .name 更快的假设确实可能会更好有缺陷的是,整体性能高度依赖于浏览器实现和特定文档结构。尽管如此,大多数现代 CSS 选择器引擎都遵循从右到左的评估方法。
根据 Gecko 开发者 Boris Zbarsky 的说法,浏览器通常通过选择一个元素并评估所有候选选择器以确定其是否匹配来进行操作,而不是识别给定选择器的匹配元素。这种从右到左的方法简化了遍历组合器的过程,例如 >或 ,在选择器内。
简单选择器内的遍历
但是,重要的是要区分从右到左的计算不会向下扩展到简单选择器级别每个复合选择器。例如,在复杂的选择器 div.name[data-foo="bar"]:nth-child(5):hover::after 中,浏览器可能不一定按以下顺序检查条件:hover、child count、data属性、名称类和类型。
相反,出于性能原因,可能会优先考虑特定的简单选择器(例如 ID)。这在 Gecko 的实现中很明显,首先检查带有 ID 的规则以优化匹配过程。
总结
CSS 选择器引擎读取的方向通常是正确的 -向左,但其实现方式的具体细节可能因浏览器而异。此外,从右到左的评估仅适用于复合选择器内的组合器,不适用于单个简单选择器级别。
以上是CSS 选择器引擎是否支持从右到左阅读?的详细内容。更多信息请关注PHP中文网其他相关文章!