Browser Cache Features

[Andrew Quan]

What are your thoughts on PHP, F3 and "browser cache"?

https://developers.google.com/speed/docs/best-practices/caching

http://betterexplained.com/articles/how-to-optimize-your-site-with-http-caching

[bcosca]

What about it? The framework's Cache class, Base->expire() and Base->run() methods already implement intelligent server-side and client-side caching.

[bcosca]

Even Web->request() understands client-side caching as though it were a browser.

[Andrew Quan]

Ah, I didn't know about those; how do we correctly use them? Really need to get new version of docs up, how may we help? :D

[stu warneski]

learn, then edit https://github.com/bcosca/fatfree/blob/master/readme.md 

however it appears that readme.md was last edited 9 days ago and already included a blurb about caching in the Plugins section, so maybe you missed that part of the document? i know i have to read things many times to have it all sink in :)

[xfra35]

@Andrew, all you need to do is defining a positive TTL for each route. F3 takes care of the rest for you.

Here's a small example to illustrate what's going on behind the scene when you define a TTL:

Without cache:

$f3->set('CACHE',FALSE);

$f3->route('GET /test',function(){

echo time();

},60);//ttl 60s

t=0: Browser1 requests the page. Server sends a fresh version. //Output: 0

t=10: Browser1 requests the page again with the header "If-Modified-Since: t=0". Server answers with a HTTP 304 status (Not modified), which means "use the browser cache". //Output: 0

t=20: Browser1 requests the page after cleaning up the browser cache. Server sends a fresh version. //Output: 20

t=30: Browser2 requests the page. Server sends a fresh version. //Output: 30

t=100: Browser2 requests the page again with the header "If-Modified-Since: t=30". Server sends a fresh version (no 304 since the TTL has expired). //Output: 100

With cache enabled:

$f3->set('CACHE',TRUE);

$f3->route('GET /test',function(){

echo time();

},60);//ttl 60s

t=0: Browser1 requests the page. Server sends a fresh version. //Output: 0

t=10: Browser1 requests the page again with the header "If-Modified-Since: t=0". Server answers with a HTTP 304 status (Not modified), which means "use the browser cache". //Output: 0

t=20: Browser1 requests the page after cleaning up the browser cache. Server sends the cached version (TTL not expired). //Output: 0

t=30: Browser2 requests the page. Server sends the cached version (TTL not expired). //Output: 0

t=100: Browser2 requests the page again with the header "If-Modified-Since: t=30". Server sends a fresh version (no 304 neither cached version since the TTL has expired). //Output: 100

[stu warneski]

what controls the browser's cache timeout? the user's personal settings in the browser, or a meta tag in the html markup of the page, or the lower value of either?

[xfra35]

The server does. The Base->expire function @bcosca was talking about adds automatically an Expire header in the response.

Therefore the browser knows how long the resource is supposed not to change. I forgot to mention that part in my earlier example, but it would go like this:

t=0: Browser1 requests the page. Server sends a fresh version specifying Expires: t=60. //Output: 0

t=10: User requests the page again. Browser1 fetches it directly from cache (since TTL has not expired). //Output: 0

So once again, we just need to define route TTLs if we want pages to be cached. F3 handles the underlying HTTP:

- if CACHE=FALSE, it controls the browser cache.

- if CACHE=TRUE, it controls the browser AND the server cache.

[ikkez]

@ xfra35

a very nice summary
+1

[Andrew Quan]

Ah-ha :)...

[Andrew Quan]

F3 is pure awesomeness

[Andrew Quan]

Agreed! GJ xfra35!

[Andrew Quan]

I remember the request one for "grabbing data from another site" but yeah, I do have to read the sections over n over...