Home > Mobile >  Can the duplication of CSS `<link>` tags cause layout- or other issues?
Can the duplication of CSS `<link>` tags cause layout- or other issues?

Time:10-07

An old CMS causes a multiple blocks on one page to include the same <link rel="stylesheet" src="block.css"> tag. It's not very clean, but it doesn't seem to cause any layout problems. Could there be cases where this could turn out to be a problem?

CodePudding user response:

In terms of rule equivalency, this would not cause problems on your layout, because the file is identical to itself, so it contains the very same rule as itself in the very same order as itself. The newer load of the file takes the rules and overrides the older rules, but, since the file is identical to itself, each rule overrides itself with itself. No issues whatsoever on rule consistency.

But the very fact that the very same resource is loaded over and over again indicates that there might be some logical errors under the hood and the duplication of the link tags might be the symptom of some serious problem. So you would do well to check why are they duplicated.

Since loading a file takes time, your browser is likely to download the linked file at the first time, save it to the cache and when it's being referenced again, then no request will be sent to the server, but the file will be loaded from the cache. So it is unlikely that this duplication of resources would cause any server load issues even in large concurrency scenarios due to the browser's cache, but it will slow down the browser and if the user's device is not plugged in, then it will unjustifiably put a burden on the user's battery. So, since you know that the file is duplicated, it is well-advisable to remove the duplication and make sure that a resource is loaded exactly once if needed and it is not loaded at all if it is not needed.

CodePudding user response:

It's not ideal but it won't lead to any errors. but i advise you to look for the programmatic error and fix it. if the file is 1 MB and you load it three times on one page load, you will get problems through. Users will bounce, your visibility on Google will decrease, etc.

Fix it ;-)

  • Related