Take the 2-minute tour ×
Webmasters Stack Exchange is a question and answer site for pro webmasters. It's 100% free, no registration required.

I noticed, by using Google Page Speed Insights, that if I structure my HTML to load the critical, above-the-fold content first, my page will improve performance - and it woks (with now current perf. of Mobile 71/100 - Pc 87/100).

My question is, with Apaches's mod_header activated, and with no content inside my <head> tag, is it possible to set Data Expires for any part of my page (inside the body, eg)?

share|improve this question
    
what is the relation between CSS, JS and setting the expires header? do you have a page whose name is "mod_headers.html", or you are talking about the apache mod_headers module? Can you clarify your question? –  PatomaS Feb 21 at 10:02
    
"render JS and CSS after my entire HTML" - how are you rendering your CSS after your HTML? –  w3d Feb 21 at 11:26
1  
@w3d sorry, you're right. Structure my HTML to load the critical, above-the-fold content first is the right concept... –  fiskolin Feb 21 at 12:46
    
@PatomaS my question is: once I have CSS and JS above-the-fold content, how could I set cache-control to those contents? –  fiskolin Feb 21 at 12:48

1 Answer 1

up vote 2 down vote accepted

The expires header is related to the page, not fragments of it.

Lets go over the basics.

You send HTML to the browser, all of it or a stream, doesn't matter for the example.

The browser receives it and starts parsing it. At the same time, once it starts parsing, all the other linked files are called, like images, css, js, etc. Some parallel connections are established and some of the linked files start coming; the browser detects them and assigns the right parser/renderer to work with the file.

If the file is an image it will be displayed on the screen. if it is a CSS, the parser starts applying the rules to the received HTML and shows/modifies the presentation of the content. If it is a script, it reads it looking for a trigger, if there is none, the file just stays on memory, if there is a trigger, the called action/function starts working.

Above the fold is a term that refers to the content that is viewed first on the screen, it comes from the news papers.

CSS and JS are not above the fold, they are asynchronous or parallel to the rendering of the content; CSS affects the whole document, JS affects whatever it was programmed to do.

If what you want to do is control the cache of the CSS and JS files, you can use rules on your .htaccess, like so

<FilesMatch "\.(css|js)$">
    Header set Cache-Control "max-age=31536000, public, s-maxage=31536000"
    Header set Pragma "cache"
</FilesMatch>

or like this

<IfModule mod_expires.c>
    ExpiresActive On
    ExpiresDefault "access plus 1 month"
    ExpiresByType application/x-javascript "access plus 1 month"
    ExpiresByType text/css "access plus 1 month"
</IfModule>

it is not possible to affect part of the content of a page, unless that content (HTML file) is inserted as an iframe; in that situation, you are still affecting a different file, but the final page, may look like only part is affected by cache rules.

share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

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