Website performance is a key part of user experience and caching is an important part of this. But what is cache, and how can you take advantage of it?
What is cache?
Caching speeds up webpage delivery by taking away the server-side processing. The content is ‘stored’ in a place in between the client and the server, often in strict HTML or text-file format. When a request for the content is made, providing it ready-made from the cache is far quicker than:
- Having to process the requests
- Fetching the data
- Executing the code
- Reconstructing the page to be presented from the server
The aim is to shorten the time between a user clicking on your page and the page loading. There are many ways that caching can help with this.
What you want to avoid with a caching system is users being presented with outdated content – it's not good if you’ve made changes to your website but users are still seeing the version stored in the cache. A caching system periodically checks with the host server to see if there have been any changes to the content. If there are changes, the cache will be updated and users will start to see the new content.
Developers can set the cache expiry period to whatever suits their type of website. For example, a news website or a forum which constantly has new content should have a low cache expiry – sometimes minutes or seconds. But a website like this blog, where new content is only added once every few days/weeks doesn’t need a super-short cache expiry, so it might be hours or days instead.
Types of cache – Web, data and application caching
It's important to recognise that there are various cache types, with each serving a slightly different purpose depending on your requirements.
Web caching – Client or server
Web caching can happen on the client-side with methods like browser caching, where the cached data is stored in web browsers like Google Chrome or Firefox. With browser caching, the individual user defines and controls the parameters of the cache. Web developers can have some level of control over a client-side browser cache by making use of Cache-Control HTTP headers. For a higher level of control, developers often prefer caching to be managed on the server side.
Data caching is important when requests are frequently sent to a database that doesn’t change very often. Data caching can avoid unnecessary repeated trips back to the database. For example, data can be stored in local (or virtual) memory on the server instead, so that it’s quicker to fetch when a database call is made.
However, storing data in server memory means that the data cache can only work for sites running on that server. This might not be a good solution for infrastructures where more than one server shares the same database.
Relational data base management systems like MySQL and MariaDB often include data caching solutions that attempt to speed up process time.
Caching plugins can be installed on CMS applications like WordPress and Drupal. Users have a certain amount of control over HTTP headers with access to .htaccess files that CMS applications provide.
There are lots of different software packages that can be used to configure and control caching systems. Web accelerators like Varnish Cache are built to sit (somewhat metaphorically) above the data that is stored on a server. At the beginning, every request for data/content that goes to the server goes through the Varnish proxy, which saves the request and the content that is asked for. Then, the next time the same request is made, Varnish can load the content directly from the Varnish Cache without the server having to process requests again. Varnish stores all of the HTML/CSS code that’s needed to load a webpage, but without any of the resource-intensive requests for data.
It’s reasonable to state that caching systems like Varnish, when properly configured on a high-traffic website, can improve page load speeds by up to 90%. In practice, a 10-second page load could be reduced to just one second. To discover even more expert guidance around improving page performance, head over to our blog.