0

Front page of a site has a HUGE amount of CSS in the front.tpl.php file using tags. Does this significantly reduce page load time? If so, why?

Thank you Drupalists! Or Drupaleers. Drupaleeros. Drupal-Heros!

  • 2
    In Drupal, you shouldn't add stylesheets into templates, it bypasses the entire aggregation system, and you lose out on Drupal's performance. – Jaypan Jun 28 '18 at 5:37
1

Significantly? depends on how much is your definition huge.

It's best practice to have your style's in CSS file because the browser can cache it. Therefore, on subsequent page loads it doesn't have to download your CSS file again.

The browser doesn't cache your HTML, so it would have to download your huge HTML each and every time.

Caching off

enter image description here

Caching On

enter image description here

  • Significantly as in, maybe a second or two? So if it's in the template file, it is not being cached. Hm. Thank you this helps! – electrokate Jun 28 '18 at 5:03
  • 1
    @electrokate So if it's in the template file, it is not being cached yes, it's cached by Drupal, but the browser still needs to download the file. – No Sssweat Jun 28 '18 at 5:10
1

This isn't really a Drupal question, nor is it one with a straight forward answer as it depends on your circumstances.

In short the answer is no, it won't slow the page down.

CSS is normally included via a linked CSS file because you're usually using the same styles on multiple pages. As @no-sssweat says, these files are then cached by your browser so you don't need to download that data again and again as you navigate.

But! If you have styles that are only used on that page, so won't be needed elsewhere, then by including them in the page you save on the amount of HTTP connections your browser needs to make, and so the page should be faster.

This all depends on your browser, the amount of assets being fetched, etc.

The long and the short of it is that including inline CSS won't slow the page down, it might make it faster, but site wide - including shared/reused CSS in an shared CSS file will improve maintainability and allow for improved caching/speed.

As far as Drupal goes, if you are including your CSS files correctly via the theme .info, then Drupal will aggregate multiple CSS files into one, so unless you are concerned about the size (for example, you have other landing pages and a lot of people won't need those front page styles), there shouldn't be much difference in the end.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.