尺寸单位之间的速度测试:rem,em和px

时间:2016-04-05 00:08:06

标签: css performance paint font-size

是否有任何证据表明某个特定尺寸的单元需要更长的时间来处理?例如,如果您使用rem来调整整个网站的大小,那么计算/绘制网页所需的时间比是否所有内容都具有特定的px值要长?

max-width: 16remmax-width: 250px有什么好处吗?

我认为rem需要更长的时间,因为它必须恢复到根并计算,而em就像一个稳定的处理流,而px将是最快,因为无法计算。

如果有人知道哪种方法更快,请告诉我

1 个答案:

答案 0 :(得分:2)

  

编辑:我开始几乎不赞成这个讨论,好吧,   抛光卡车的车顶,但我没有考虑css动画   这是非常沉重的pocessor用户和CSS不是一个   我认为,图形优化的过程(非常低效)   如果一个网站,这个问题有一个略高更高的版本   有大量的CSS动画。

引自问题:

  

我的印象是rem需要更长的时间,因为它必须恢复到根并计算,而em就像一个稳定的处理流,而px将是最快的,因为它是无需计算。

没有。 Rem只需要root em value,而不是parent em value(由于root不会改变,我希望CSS的结构处理不需要继续调用它,而只需从内存中重新获得它)

rem我们应该在2016年编写CSS。除了em有一个或两个父元素影响em值之外,它比1.2em of 1.4 em of 1.2 em of 14px更好。[来自作为开发人员制作1.2 of 14px是什么的观点,为什么不将1.2rem作为px]。

至于rem,与许多现代显示设备一样,这不是一个直观的结果,像素不是像素this may be an interesting topic for you to read

如果您关心pxpx的处理速度,那么我个人觉得您实际上是通过抛光车顶来提高燃油效率,从而降低空气阻力,你的工作可能会产生微小的影响,但还有其他更大的GPU,CPU内存和运行能力的消费者,以及更多的消费者。

您可能还想阅读此内容:How a CSS pixel size is calculated?

因为我想招待你,你可能想知道you can now generate full 3D computer game levels developed entirely through CSS。这是2013年制作的! 我仍然发现它可以增加!!

在这个游戏中,开发人员始终使用em。您也许可以接受他的代码并应用rem和/或trait DAL { def callStoredProcedure(procName: String, params: Array[String]): Boolean } object DALImpl extends DAL { def callStoredProcedure(procName: String, params: Array[String]): Boolean = doStuff } class Foo(dal: DAL = DALImpl) val testMe = new Foo(mock[DAL]) ,如果确实显着更快,则会显示页面的沉重感。