by Sai gowtham

How to check the Unused Code on your Pages

How to check the Unused Code on your Pages

Does your code is fully covered is there any unused JavaScript or CSS code on your web pages.

Let’s see how to check the unused code on your page by using chrome dev tools.

First, we need to open the chrome dev tools by hitting cmd+opt+i in mac or just right click and choose to inspect.

Next, click on the 3 dots and select coverage option. selecting-coverage-option

Now click on reload icon inside the coverage tab.

unused code in chrome-example

when we click on a red bar it will open a new tab and shows exactly what type of code in your file is currently not used.

css-jss-code-coverage

In above image red color is indicating unused code and the green color is indicating used code.

So that we can remove the unused code from our files before it shipping to the user’s browser.it helps to increase the web performance.

check out now, it helps you to see how much amount of your code is using.if you didn’t see the coverage option then update your chrome browser.

Top Udemy Courses

JavaScript - The Complete Guide 2020 (Beginner + Advanced)
JavaScript - The Complete Guide 2020 (Beginner + Advanced)
26,545 students enrolled
52 hours of video content
View Course
React - The Complete Guide (incl Hooks, React Router, Redux)
React - The Complete Guide (incl Hooks, React Router, Redux)
221,520 students enrolled
44 hours of video content
View Course
Vue JS 2 - The Complete Guide (incl. Vue Router & Vuex)
Vue JS 2 - The Complete Guide (incl. Vue Router & Vuex)
114,575 students enrolled
21 hours of video content
View Course