使用CSS高级选择器加载速度和使用资源

I am starting making use of "advanced" selectors, and even though with this I am being able to locate and identify all elements on my HTML without needing to classify them or give them an ID, I am worried about if this way of programming (which I suppose is the correct one as most of the online templates/plugins etc... use it) does not need more resources and increases loading times than just using classes and ID's as selectors.

我开始使用“高级”选择器,即使有了这个我能够找到并识别我的HTML上的所有元素而无需对它们进行分类或给它们ID,我担心这种编程方式(我认为这是正确的,因为大多数在线模板/插件等...使用它)不需要更多的资源,并且增加加载时间,而不仅仅使用类和ID作为选择器。

For example, the code above could be done just with some simple selectors, IDs and classes, but I preferred to do it as you can see:

例如,上面的代码可以通过一些简单的选择器,ID和类来完成,但我更喜欢这样做,因为你可以看到:

.impairsRight > div{  
   float: right;
   width: 100%;
   margin-bottom:15px;}

.content-hola .impairsRight > div:nth-child(odd) > p {
    margin-left:30%;}

.content-hola  .impairsRight > div:nth-child(even) > p {
    margin-right:30%;}

.impairsRight > div:nth-child(even) > h5 {
    text-align:right;}

.impairsRight > div:nth-child(odd) > h5 {
    text-align:left;}

Is this heavier on size/speed/use of resources than simple ones? Is there any tool or website that can test this kind of things? (not only loading times, algo resources needings)

与简单的相比,它在尺寸/速度/资源使用方面更重吗?有没有可以测试这种东西的工具或网站? (不仅加载时间,算法资源需求)

1 个解决方案

#1

I have never heard of a case where the use of CSS selectors impair the speed of a web site to a noticable degree.
This is really nothing you have to worry about.

我从来没有听说过使用CSS选择器会严重影响网站速度的情况。这真的没什么好担心的。