Is there a Problem in the Existence of Duplicate CSS, but 100% Equal?

Question

I have an application, where I have a file called "layout" which is responsible for displaying the whole HTML(head, footer, body just to call the side menu which is another file), CSS and Javascript common to all pages of this application of mine.

All pages of my application, I create only their body, because I call the layout to display the rest. Everything works correctly until then.

There was a moment when I needed to create a CSS customized to a specific page, so the body on that page includes that CSS tagged <style>. But this moment, had to occur other times with this same CSS, leaving it to be rare in the application.

So I put this CSS in the file of CSS application standard, but as I have hundreds of pages, this CSS also exists on the body of that page, making it exist in duplicate when these pages are accessed.

Little by little I’m removing this CSS of these pages and leaving only in the CSS pattern.

That one CSS duplicate may result in some performance problem or other problem ?

Answer 1

Problems in the page layout only if there are different rules, and in that case, if an element is hit by the two rules and have the same strength, the one that is declared last is the one that will be worth.

When a person enters the site for the first time, the first few seconds are critical to capture the attention and convince them to stay a little longer or to return in the future. If your site takes too long to load, most people give up and leave it, even before you have had the opportunity to show them the value of your service. "A one-second delay can result in 7% fewer conversions, 11% fewer page views, or even a 16 percent decrease in customer satisfaction" BRYAN EISENBERG.

Clean code means faster loading and happy visitors.

It is important to keep load time down by writing semantically appropriate code, using performance optimization best practices and routinely cleaning CSS, HTML and images.

Generally, the loading time of the site will increase with its evolution and this, in a way, is something expected. That’s why it’s important to make this HTML, CSS, and image cleaning routine a natural part of the workflow to ensure a positive user experience.

You can test your website’s performance on Webpagetest