When you browse the homepage notice that for any static file (in this case I have picked up a css file) there is always a Last-Modified and an Expires.

There are multiple ways you could browse a website .I have broken them down below:

1) The General way :

This is the mostly used way.I say this because in general a user will keep clicking links and browse the website. Here for any GET requests for a static file

The browser will first check if the file is present in its cache.

If the file is present , the browser will check if file is not stale. It does this by verifying that the max age or expires value for that file has not been reached .

If the file in the cache is stale, it will make a request to the server using a conditional GET.

This is how the headers look when the browser makes a conditional GET

Notice the browser sends a If-Modified-Since header in the request .The value of which is the Last Modified timestamp it got when it last received the file from the server. The server on receiving the conditional GET request will either reply with the new file content or a 304 "Not Modified".

2) Forcing the browser to make a conditional GET

This can be done by hitting F5 on the page.Notice that when this is done the browser forces a conditional GET.

3) Forcing the browser to get the file from the server

This can be done by hitting a CTRL+F5 (Windows) or COMMAND+SHIFT+R (MAC). When this is done notice that the browser sends a request without a If-Modified-Since header.Hence this request will hit the server and not get served from the browser's cache or the proxy cache if any.

About Me

I have over 8 years of technology experience and I am currently a Sr. Project Lead at Directi, which is a Web Services Company.
I am also the creator of the popular SMS spam blocking Android application Postman