CSS Performance Profiler?

Question

I\'m currently working on a site, and somewhere in my mass of stylesheets, something is killing performance in IE. Are there any good CSS profilers out there? I\'d like a tool

Answer 1

The Chrome dev tools used to contain a CSS Selector Profiler for doing just this sort of thing. You can see screen shots of it in this blog post.

The Chrome team pulled the feature in Chrome 30 stating that:

CSS selector matching is now reasonably fast for the absolute majority of common selectors that used to be slow at the time of the profiler implementation. This time is also included into the Timeline "Recalculate Style" event.

As such, I believe the CSS selector profiler is not as useful as it [might have been] used to and can safely be dropped. This will also reduce the fraction of developers trying to micro-optimize already fast selectors.

You could try to use an old version of Chrome to dig into the issue, but I'd recommend taking a look at the Timeline tab of the current version of Chrome dev tools with will show you how long Chrome has taken to calculate styles (where selector performance is affected), layout and paint the page.