How to Remove Unused JS/CSS with Browser developers tool

Today, I will briefly talk about how to identify unused JS and CSS on the web page. If you take advantage of this, you can reduce unnecessary code, so you can create faster web services.

TL;DR

  1. Chrome Developers Tools
  2. Command + Shift + p
  3. Search Coverage
  4. Click Show Coverage
  5. if you Click Items, show use/unused code(js,css)

Step by Step

Open Chrome Developers Tools

Option + Command + i in chrome. Chrome engines are all the same. (Opera, Brave, etc..)

Go into Coverage tab

Command + Shift + p in developers tool. and Search Coverage and click Show Coverage

Command + Shift + p is powerfull command! find any browser tools

Start capturing coverage

if you Click Items, show use/unused code(js,css)

…98.8%?????

Licensed under CC BY-NC-SA 4.0
Last updated on Jun 15, 2022 23:50 +0900