7 ms·

9 times out of 10 it's related to JS or some sort of external embedded resources. The other big culprit tends to be box-shadow which have pretty horrific perfor

by anatoli 14y ago

9 times out of 10 it's related to JS or some sort of external embedded resources. The other big culprit tends to be box-shadow which have pretty horrific performance in Chrome[1], but don't do that well in other browsers either. I find that selector performance is not a problem unless you're dealing with large-scale one-page apps. [1] http://nerds.airbnb.com/box-shadows-are-expensive-to-paint http://nerds.airbnb.com/box-shadows-are-expensive-to-paint

billpatrianakos 14y ago
Yeah, definitely JavaScript. Don't forget web fonts too. I can't tell you how many times I see an entire page load then have to wait several seconds for any text to show up. It's always good to write clean efficient CSS but I think articles like this are more like coder porn than anything else. The performance gains are trivial especially when compared to JavaScript, embeds/like buttons, videos, images, and slow database queries. I know DB queries arent rendering related but I know many somewhat experienced developers working on sites that run a CMS who start optimizing everything except their database and drive themselves crazy trying to figure out why pages are loading so slow. Point is, optimized CSS is probably not that high of a priority for the vast majority of sites.
- mistercow 14y ago
  Embedded fonts are almost definitely not causing max CPU load.
- JCB_K 14y ago
  Not sure why you're being downvoted, you've got some good points. Maybe because you said definitely JavaScript, and the GP said he had javascript disabled, but your point still stands.
aw3c2 14y ago
I browse with Javascript disabled. And I have proper video drivers installed. Might be the shadows, I have no idea.