The one way to remove unused CSS

Hi✋ I learned how to remove unused CSS in order to polish up the performance score on Lighthouse. That’s why I will share this method.

As you can see, if I delete unused CSS, it will improve the web performance.

Let’s start to identify the unused CS…


This content originally appeared on DEV Community and was authored by Rion Sawabe

Hi✋ I learned how to remove unused CSS in order to polish up the performance score on Lighthouse. That's why I will share this method.

As you can see, if I delete unused CSS, it will improve the web performance.
Image description

Let's start to identify the unused CSS in the first place💪 You can click the three dots on the right top position after you open inspect. Then, select More tools and Coverage.

Image description

You can click open the CSS file that you want to check, and click the black dot.

Image description

Finally, you can see the status of CSS usage.
✅The CSS highlighted in green means that this CSS code is used on the page that you are viewing.

🚫The other one highlighted in red is unused on this page.

You should check the usage of CSS code on other pages as well before deleting it⚠️

Image description

Thank you for reading!


This content originally appeared on DEV Community and was authored by Rion Sawabe


Print Share Comment Cite Upload Translate Updates
APA

Rion Sawabe | Sciencx (2022-04-02T23:18:53+00:00) The one way to remove unused CSS. Retrieved from https://www.scien.cx/2022/04/02/the-one-way-to-remove-unused-css/

MLA
" » The one way to remove unused CSS." Rion Sawabe | Sciencx - Saturday April 2, 2022, https://www.scien.cx/2022/04/02/the-one-way-to-remove-unused-css/
HARVARD
Rion Sawabe | Sciencx Saturday April 2, 2022 » The one way to remove unused CSS., viewed ,<https://www.scien.cx/2022/04/02/the-one-way-to-remove-unused-css/>
VANCOUVER
Rion Sawabe | Sciencx - » The one way to remove unused CSS. [Internet]. [Accessed ]. Available from: https://www.scien.cx/2022/04/02/the-one-way-to-remove-unused-css/
CHICAGO
" » The one way to remove unused CSS." Rion Sawabe | Sciencx - Accessed . https://www.scien.cx/2022/04/02/the-one-way-to-remove-unused-css/
IEEE
" » The one way to remove unused CSS." Rion Sawabe | Sciencx [Online]. Available: https://www.scien.cx/2022/04/02/the-one-way-to-remove-unused-css/. [Accessed: ]
rf:citation
» The one way to remove unused CSS | Rion Sawabe | Sciencx | https://www.scien.cx/2022/04/02/the-one-way-to-remove-unused-css/ |

Please log in to upload a file.



There are no updates yet.
Click the Upload button above to add an update.

You must be logged in to translate posts. Please log in or register.

Related Posts