URL loads in one or more identical CSS resource
This means that the URL in question loads in one or more identical CSS resource (that have the same content but are loaded from different URLs).
Why is this important?
When a browser renders a page, it uses resources, such as images, CSS, and JS files to deliver the desired user experience, including layout and functionality. Each of these resource files are 'called' by the browser by the means of an HTTP request, and each HTTP request takes time to complete.
If you have duplicate CSS resources (i.e. the same content on different URLs), this hurts performance by creating unnecessary HTTP requests. Because the same resource is available at two different URLs, every time the page is accessed by a user, an additional HTTP request is required in order to call the resource. If it is hosted at separate linked domains, an additional DNS lookup is triggered as well.
What does the Hint check?
This Hint will trigger for any internal URL which contains duplicate CSS resources.
Examples that trigger this Hint:
The Hint would trigger for any URL with references to multiple style sheets that contain the same content, e.g. if the two files below were identical:
- <link href="/css/body.css" type="text/css" rel="stylesheet"/>
- <link href="/styles/css/body.css" type="text/css" rel="stylesheet"/>
How do you resolve this issue?
Identify the duplicate resources and find all references to each resource. You will need to remove the duplicate resource URL, and ensure that a single URL is used consistently across all pages on the site.