As we mentioned in previous sections, optimizing your CSS and JavaScript, and placing it correctly within the page, can make or break the user experience. But what happens when there is duplicate code in your page? How does duplicate JavaScript and CSS even happen? And how do you know if it is occurring? While we would all like to think web development is a perfect science, sometimes when multiple developers are working within a page, elements and code can be erroneously duplicated. And if you do not have the proper checks in place during development, those elements are going to find themselves in the production environment.
Duplicate JavaScript causes additional HTTP requests, which causes slower load times. Reducing the amount of HTTP requests is a key factor in reducing page load times. However, if even you have caching enabled, it is still going to affect page load time because it is an additional request. Secondly, to check to see if your web page contains duplicate JavaScript or CSS requests, running a website speed test can help to uncover if duplicate requests are present and any other performance optimization suggestions. Additionally, there are page script management tools that can be used to remove duplicate JavaScript or CSS within the style sheet.
