9/27/2019

How to Remove Unused JS/CSS with Browser developers tool

on   in , , ,   with 11 comments
Hi.
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


1. Chrome Developers Tools
Chrome engines are all the same. (Opera, Brave, etc..)

2. Command + Shift + p
// It is powerfull command! find any browser tools

3. Search Coverage and click Show Coverage

4. Click start capturing coverage

5. if you Click Items, show use/unused code(js,css)
what? 98.8%?????



HAHWUL

Security engineer, Gopher and H4cker!
Share: | Coffee Me:

11 comments:

  1. bhavesh patel5/29/2020 3:24 PM

    Really Great

    ReplyDelete
  2. HAHWUL5/31/2020 1:37 AM

    Thank you :)

    ReplyDelete
  3. kumarsamy B6/10/2020 10:53 PM

    Thanks for given info..

    ReplyDelete
  4. AVNISH SINGH6/21/2020 12:09 PM

    Nice article Mera Up Bihar

    ReplyDelete
  5. ABHISHEK7/04/2020 11:42 AM

    This comment has been removed by the author.

    ReplyDelete
  6. ABHISHEK7/04/2020 11:44 AM

    For Author of Article - Great Content, But I not able to find where is command key on computer (please help!)

    For Visitor of Website - Check Latest Job List - www.listofjob.in

    ReplyDelete
    Replies
    1. HAHWUL7/04/2020 1:38 PM

      Command keys are only used in the Mac. You can use Ctrl + Shift + p in other OS such as Windows or Linux :D

      Delete
    2. ABHISHEK7/07/2020 11:01 AM

      Yes, Sir!

      I find that and complete all your process which given above in article, but please tell me then what?

      How can I remove those red colour (unused java scripts). I want to remove those unused java scripts but I not able to make any changes in Google Developer Tool.

      I also copy those codes and try to find those codes on my website's templete but templete not show any of those codes. {My website is in blogger. So, give me solution which I can implement}

      Delete
  7. Unknown7/17/2020 5:12 PM

    hello, how do i then remove the unused javascript? I have a shopify website and need assistance for the next step.

    ReplyDelete
  8. varions7/23/2020 4:55 AM

    remove kesy krna ye b bta dety

    ReplyDelete