The time-killing problems of most websites.
Websites all over the internet are constantly updating and slimming down in order to look the best to the all-seeing Google search algorithm. While a lot of the problems that arise can be easily resolved some are an absolute nightmare to resolve. It does not matter what content management system or template (custom, free, or purchased) you will run into the dreaded removal of unused code.
Unused Code is typically JavaScript and CSS files that have the code to run any styling choices, modules, sections that the template makes available. The problem arises when you have code for a section such as an image slider on pages in which you have no image slider. Some content management systems such as WordPress have plugins that do a fairly good job of cleaning the code up but they can also cause their own issues.
How to find out if you have unused code
The easiest way to find out if your website has unused code is to follow the following steps (in Google Chrome):
- Open the webpage you want to check in Google Chrome
- Right-click on the page and select Inspect
- Click the three vertical dots and select Coverage
- Click the circular arrow to reload the page
Now you should be able to see the file URL, type, total bytes, unused bites, and usage visualization. The list of files will be going from the largest amount of unused code to the smallest.
Now for the “fun”
You need to review the code and see what the biggest drags on your website’s load speed are. I would not recommend jumping into making changes unless you have a very comprehensive knowledge of JavaScript and CSS. The review that you just made is for the screen size your browser is currently displaying so you will need to make sure that you do not remove something that is critical for other screen sizes.