Menu
Example: Gmail.
From all the DOM elements, ~2000 have at least one CSS class and there are a total of ~500 distinct CSS class names on the page. Gmail uses closure-stylesheets to minify/uglify their CSS class names. Does this step increase performance in the browser. I'm thinking about parsing/evaluating the HTML/CSS code, selector-matching, etc.
Example of uglified class name: "aBc"
Example of original class name: "tooblar__button--disabled"
219
CSS classes don't affect SEO and won't do it in the foreseeable future. And there's a reason for that: sites that don't use semantic class names have never been penalized for that and changing that would have a huge impact.
No, it does not.
When your browser encounters CSS it stops rendering the page, parses the CSS, and builds the CSSOM (CSS Object Model). So even if you minify, compress, and merge your CSS files, an excessive amount of CSS could still slow down your website.
popupbutton is the fastest.
Yes. Fewer bytes is fewer bytes. The chances of it being a significant factor are tiny though.
196
This doesn't affect browser performance as much as it does loading times. There is a measurable difference in rendering time, but that is only measurable when there is a significant length difference, and even then it is a tiny difference. Just look at this JSPerf which runs a test for both class name lengths. The long names have a slight disadvantage in performance speed. This could make a difference when modifying styles a huge amount of times, but on normal sites, the difference is too small to ever be noticed.
29
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
