performance - 假设ID唯一,CSS快速配置文件可以更快?

标签 performance algorithm browser

CSS Selectors Level 4引入了快速剖面和完整剖面的概念。
一个“普通的css解析器”not suppose that id is unique(!),也就是说,解析器算法假设文档具有具有具有重复(非唯一)值的属性id的元素因此,在“普通的CSS解析器”中,像#myID {...}这样的CSS行的解析具有与解析.myClass {...}相同的算法将来,随着css4标准和快速配置文件的采用,render engine将在“更快地解析快速配置文件文档”或“解析完整的配置文件文档”之间进行选择。
这是一个简单的问题。。。
当假设文档具有唯一的id时,快速配置文件的css解析算法解析“好文档”会更快吗?
... 如果你需要更多的上下文
当我用dom实现css解析时,答案是肯定的,因为当解析“好文档”(不是重复id的丑陋文档)时,我可以使用computational performance方法,这样更快(!)…但这个问题不是关于dom解决方案,而是关于流行/严肃的渲染引擎(如blink、geckoor或webkit)中使用的算法。
... 总结使用唯一id(使用非唯一id时丢失的id)可能进行的优化:
在第一个元素出现id值时停止(并将其缓存在散列中)。(和带有“hasid”的标志元素)
使用简单的getElementById()将id值转换为元素指针(缓存在哈希中)。
使用getElementById()这样的(更快)方法来解析#myID {...}这样的CSS行。

当涉及id时,lookup table关系伪类的快速解析,如:has()所以,也许,我们可以将:has(#myId)添加到快速配置文件定义中!
…它们只是我的“个人假设”,对于现实生活中的渲染引擎来说可能是不正确的,即使在渲染好的(不难看的)文档时也是如此。

最佳答案

这里有很多,我不知道从哪里开始我想tl;dr只是简单的几点:
事情并不像你想象的那样运作,但这是相当复杂的,我正在考虑写一篇关于它的文章。
您误解了快速/完整配置文件的意图/原因。我想这些名字可能对我没有帮助,我最近为了避免这种特殊的困惑,我做了很多工作——但是理解/真正理解它的重要性仍然需要理解1。
因此,事实上,您所建议的更改将降低性能,而不是提高性能,并且最终不会改变:has()的实际问题。
试图用尽可能少的词来说明:css,也就是说,应用样式的部分是针对动态树的,包括它仍然在下载和解析html的时候。很难简单地说明(如果我能完成的话,我会在我的文章中尝试)但是一个非常简单的方法的纯粹数学爆炸式的像suggested we change them,这是绝对必要的-至少如果你真的想以我们一贯的方式查看页面-我们保留了智能观察固有的某些方面在现有的CSS约束条件下。实际上,所有这些观察结果都与规则如何与动态树相关,以及如何通过消除必须检查的元素数量和必须根据突变类型检查的规则数量(在解析期间创建元素也被认为是突变)已经发生了。然而,当您编写javascript时,您只需要对树(或树的一部分)评估一个规则一次作为快照,这实际上是一个完全不同的问题,对于如何优化它有不同的答案。简单的回答是:你不需要优化它(实际上,你不可能优化得太多——成本通常大于收益),它实际上非常简单快速因此,像QuerySelector或Find这样的东西有一个策略(树行走),而动态或“实时”CSS有另一个策略(同样,它很复杂,我将尝试在其他地方解释它,并在可能的情况下链接起来)。
考虑到所有这些,对于querySelector来说,:has()这样的计算实际上很简单,但是如何在实时应用/动态树中实现这一点却完全未知我们想,只是没人能想出如何让它不烂。因此,我们目前拥有的是“个人资料”。像JavaScript,甚至print这样的东西都可以支持完整的/静态的配置文件,但是目前,浏览器(就您可以在样式表中编写并动态应用的内容而言)只能支持快速/动态的配置文件正如您所说,建议浏览器不要选择是解析一个概要文件还是解析另一个概要文件,而是选择一种模式(可以在样式表中编写的内容)来支持一个子集,而选择另一种模式(可以在javascript中的树快照上计算一次的内容)来支持整个wax球。
尽管如此,我确实认为我们可以找出如何在一个合理的树上获得足够的性能增益,在一个具有合理数量的规则和一些围绕部分呈现的新期望(可能是显示模式)的树上,这不会很糟糕我个人认为,如果你能做到这一点,而不伤害任何现有的网页,这就够了。各方意见不一,到目前为止,由于担心最坏的情况需要几分钟才能画出一页纸,再加上许多其他建议,时间有限,因此在这方面无法取得太多进展。
至于ID,具体来说,改变他们的意思将打破现有的网页,没有某种“选择”,这真的使事情复杂化。这不仅是因为它们“丑陋”,而且它们几乎不可能完全避免,从统计上看,当前“文档顺序第一个”的定义在已知情况下实际上更有用/更可靠,虽然我意识到这是违反直觉的,但在动态情况下也更快,在静态情况下,内存占用较少,速度稍慢(但弹性更强)为了说明为什么不难-如果你开始渲染一个页面并找到一个id,你就设计它的样式。在您的模型中,如果我到达文档的末尾并找到一个id,我必须返回并取消前一个样式的样式,处理影响和回流,然后返回并在此应用样式。另一种选择(当前课程)是根据遇到的情况应用它们。ID在CSS中之所以特别,真正的原因在于它的特殊性,它只是“更独特”所以更重要对于css来说,属性、类和id之间的内部本质上没有区别,它们只是关于我们如何根据dom变异来划分规则和筛选规则。在javascript中,性能并不是主要问题,浏览器应该实现完整/静态的配置文件,包括:has()和/或不带id限制:)

关于performance - 假设ID唯一,CSS快速配置文件可以更快?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29295824/

相关文章:

android - 动态改变Textview大小

java - 如何根据实例变量按升序对对象数组进行排序

c - 4 个嵌套 'for' 循环的最佳和最坏情况时间复杂度?

algorithm - 如果启发式函数 h 是单调的,为什么在 A-star 算法中减去 h(x)?

apache - jmeter 中的浏览器缓存模拟?

runtime - 什么是总频率计数和运行时间(Big-O 表示法)?

python - 为什么计算素数之和时第一个解决方案比第二个解决方案慢得多?

java - 这两种算法中哪一种更有效?

html - alt属性中的文字会出现的原因

适用于 Node 和浏览器的 JavaScript 日志记录库