Fastest way to use CSS

Asked

Viewed 42 times

0

Which is the fastest to use:

.testando1{display: none;}
.testando2{display: none;}
.testando3{display: none;}
.testando4{display: none;}
.testando5{display: none;}

Or:

.testando1, .testando2, .testando3, .testando4, .testando5 {display: none;}
css
  • 4

    That’s your preference, but I would simply create a .hidden{display: none} and would apply on the corresponding Ivs.

  • @Rafaelaugusto good idea! But I, for example, in some clients, I can’t totally touch the HTML of the site, just a few pages, and CSS can. So I’m in doubt, in a matter of performance.

  • Use separating by comma, the less line, but take the file.

  • In order to enter the second, in a performance question it is not possible to state, it can vary from engine to engine (engine is the technology of each browser responsible for interpreting and rendering), probably for the interpreter the difference is 0.0000002 seconds, something that would be a waste of time worrying about this, the ideal is to look for more evident points to improve performance, such as using HTTP-cache, minificar Resources, load only what you will use (when possible), all this in production only. What I recommend you worry about is this: https://answall.com/q/143850/3635

1 answer

1


A CSS file with just these instructions below weighs 75 bytes:

.testando1, .testando2, .testando3, .testando4, .testando5 {display: none;}

Another file with these weighs 138 bytes:

.testando1{display: none;}
.testando2{display: none;}
.testando3{display: none;}
.testando4{display: none;}
.testando5{display: none;}

File size may vary depending on the file system used by the OS or the indentation used.

Although they are extremely light files you can know that the first option is better in term performance because it will load faster.

But how the Rafael Augusto said, in that situation it would be better to create a new class and add it in the elements.

Browser other questions tagged css

You are not signed in. Login or sign up in order to post.