nowfound

Dev tools · February 9, 2013

RY

Record your CSS usage on your website - remove unwanted CSS

This is a follow up to: http://news.ycombinator.com/item?id=5095516 regarding CSS optimisation. The common request/theme in these comments was the ability to 'record' your CSS usage on your website as you used it, thus capturing all the CSS selectors (i.e. on a dynamic website). Turns out this functionality is actually inside Chrome Developer Tools; "CSS Selector Profile". The profiler seems to be designed to record how much work each CSS selector takes - but I've noticed that it actually 'records' your usage (you press start + stop) - and shows you how many times each selector was called…

Alternatives

What it does

In the maker’s words, at launch

This is a follow up to: http://news.ycombinator.com/item?id=5095516 regarding CSS optimisation. The common request/theme in these comments was the ability to 'record' your CSS usage on your website as you used it, thus capturing all the CSS selectors (i.e. on a dynamic website). Turns out this functionality is actually inside Chrome Developer Tools; "CSS Selector Profile". The profiler seems to be designed to record how much work each CSS selector takes - but I've noticed that it actually 'records' your usage (you press start + stop) - and shows you how many times each selector was called during your usage. i.e. some selectors were used 100 times, other selectors 0 times. So now you can look at your CSS across your whole dynamic site - and remove selectors that are never used.

Does the same job

all alternatives →
  • Unused CSS finder2018 · ▲299

    Crawl your website and find unused CSS

  • Unused CSS2018 · ▲311

    Easily find and remove unused CSS rules

  • BugShotJul 2026 · ▲115

    Discover, fix, capture, and report bugs in one shot

  • CSS Spider2020 · ▲122

    The fastest way to check, copy, export and edit CSS

  • AC
    A Chrome extension that extracts used CSS and combines it into one file2018 · ▲40

    just wanted to share this useful tool with you. I have been looking at something like this for a very long time. https://chrome.google.com/webstore/detail/css-used/cdopjfddj... what it does: it analyses your html dom and looks for css classes. Then it extracts it all and combines it into 1 single css file. I used 5 css framworks which was on 340kb kb. This tool made it 36kb!

  • CodeScraper2019 · ▲160

    Hover over anything and get the HTML/CSS

More dev tools this month

the category →
  • Dograh▲592

    The open source VAPI alternative

    Dev tools · 25d ago · dograh.com

  • Meridian▲530

    Don't let your work go unnoticed. Get promoted!

    Dev tools · 20d ago · meridiona.com

  • x1▲516

    Lovable for iPhone apps go from idea to App Store

    Dev tools · 11d ago · x1.new

  • The GTM Co-Founder▲402

    Open-source GTM skills for technical founders

    Dev tools · 29d ago · gtmcofounder.com

  • Open-Source eInk Bike Computer▲389

    OpenTrailPaper is open-source bike computer firmware for the LilyGO T5S3 4.7" E-Paper PRO. It supports offline maps, GPX routes, FIT recording and Bluetooth sensors.

    Dev tools · 1d ago · opentrailpaper.com

  • Nuphos▲380

    The AI-Native DevOps Workspace.

    Dev tools · 24d ago · nuphos.ai

Launched alongside, February 2013

the whole month →