Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How does static site generator like Jekyll handle browser caching

My understanding toward how Jekyll works is, once I write a blog locally, Jekyll will generate a page and add it to some sort of indexing system, so that when users load up the main page, they can see the list of all the posts. Is that right? However, how does it handle browser caching. Once I add a new post, how can we prevent the browser from using the cached index and make it fetch the new index every time. Or am I saying something totally nonsense?

like image 241
Yiou Avatar asked Aug 05 '15 15:08

Yiou


People also ask

How do you leverage browser caching of static assets?

To leverage your browser's caching generally means that you can specify how long web browsers should keep images, CSS and JS stored locally. That way the user's browser will download less data while navigating through your pages, which will improve the loading speed of your website.

How does browser caching work?

Caching is a process in which data is kept in a cache. A cache is simply a storage area that stores data for a short time. Browser caching is a process that involves the temporary storage of resources in web browsers. A visitor's web browser downloads various website resources and stores them in the local drive.

Is Hugo better than Jekyll?

Conclusion - they're both great options. There are not a lot of things that Hugo can do but Jekyll cannot and vice versa. For some sites with thousands of pages, Hugo is a must because of its build speed. For others, Jekyll can be a must because of a few plugins with specific functionalities not found in Hugo.

Can web server do caching?

Web caching is the activity of storing data for reuse, such as a copy of a web page served by a web server. It is cached or stored the first time a user visits the page and the next time a user requests the same page, a cache will serve the copy, which helps keep the origin server from getting overloaded.


1 Answers

There is no "indexing system" involved in Jekyll. It generates pages and associated resources (CSS, JS, images, etc.), that's all.

Caching depends a lot about your HTTP server configuration. HTTP headers sent by the server with any ressource can tell the browser to keep it in its cache for a while, or not at all.

I have these settings in my Apache HTTP server for example:

<IfModule mod_expires.c> ExpiresActive On ExpiresDefault "access plus 1 year" # Pages ExpiresByType text/html "access plus 15 minutes" # RSS feed ExpiresByType text/xml "access plus 120 minutes" </IfModule>

This tells the browsers to keep the ressources in cache for 1 year by default, but HTML pages only for 15 minutes, and RSS feeds for 2 hours. So images, CSS and JS will be cached for one year unless the browser cache needs to free some space.

The delays depends on your writing frequency of course. I am currently migrating a lot of old content, hence the 15 minutes delay, but I usualy publish once a week, so I will set it to 1 or 2 days when the migration is over.

You have to understand that the Expire HTTP header tells the browser how long to keep the file in cache. Using such configuration, the browser has no way to now there is some new content. There are other ways to deal with caching (like ETag for example), which allow the browser to ask the server if there is something new, but it is less efficient for web performance.

So if your set the HTML page cache Expire to 1 day, and the user gets the page just before you update it, she will get the new page almost 1 day later.

This doesn't bother me at all, but you might think otherwise.

HTH

like image 105
Nicolas Hoizey Avatar answered Oct 09 '22 16:10

Nicolas Hoizey