Optimize the CSS view

Asked

Viewed 231 times

-4

Hello I would like help from you on how I can optimize my CSS are all already optimized plus have 1 in question that I can’t remove and this is making me uncomfortable thank you!

Otimize a exibição de CSS

css

  • If the css file is small put its contents inside a style tag. In php you would do <style> echo file_get_contents('linkdoseucss')</style>. That will solve this problem.

  • 2

    Google defines that the CSS responsible for the style of the entire visible page start should be embedded with the HTML to optimize its loading, so that only the unseen part of the site depends on an external file. The question is: are you having such serious performance problems? If not, you can ignore such a message.

  • Broad questions generate broad answers. Be specific and provide all the data relevant to the solution of the problem. See [tour] to learn more about Stack Overflow.

  • Possible duplicate of What it means "region above the fold"?

1 answer

1

Google believes the page will perform better when considering load time when the entire CSS responsible for styling the region above the fold is embedded in HTML via tag style; this because such CSS code would be delivered along with the rest of the HTML to the browser, in the same HTTP response, and could be parsed more quickly when compared to an external CSS file, which is delivered in a different HTTP response.

What it means "region above the fold"?

Overall, this is an unnecessary technique, because we hardly have such a performance problem that dividing the CSS would solve. In fact, the page load time is pretty much the same, what creates is the feeling of loading faster, because the visible part of the page actually loads before. Points that generally make it impossible to use such a technique is that:

  • splitting the CSS code ends up harming system maintenance, as you will have code of the same nature separated into different files;

  • in addition, there will be the possibility of code replication: if all pages of the site are in the same layout, it is likely that the CSS code responsible for the region above the fold will be the same and even then it would be necessary to include it in all HTML files;

  • and also directly affects the code caching system, as a CSS code included in the HTML will only be cached if the HTML file is cached - and not always this is interesting: you can have a page where only the information changes, but not CSS, so it would be interesting to just cache CSS and not HTML.

Overall, you earn more by ignoring such a tip than by prejudice, so I think you can ignore it without fear.

Browser other questions tagged css

You are not signed in. Login or sign up in order to post.