Member-only story
Use Varnish HTTP Cache and Docker To Boost Website Speed
Boost your website’s performance by 20%
To boost the performance of Paul’s dev blog and improve the user experience for all visitors, I decided to look for an opportunity to integrate an HTTP cache into my Docker Swarm environment.
After researching for a long time and also asking other people on Reddit (Unfortunately, no one could help me), I found a solution that fits my expectations.
While researching, I learned about Varnish which is a web application accelerator that is also known as a caching HTTP reverse proxy. It can be installed in front of any server that uses HTTP to cache the contents. It is really, really fast and normally speeds up delivery with a factor of 300–1000x, decreases load times, and can handle traffic peaks.
A high-level overview of what Varnish does can be seen in this video:
The Setup
My new setup includes a Varnish HTTP Cache server deployed using Docker in my Docker Swarm environment. It is positioned between my Traefik Proxy and my Ghost blog. In this setup, Varnish is used to cache various static content on the page, such as JavaScript, CSS, Images, and text files.
Benchmarking
To benchmark my website, I use the Lighthouse extension from Google, giftofspeed.com, and tools.pingdom.com. All test sites load the entire site as if we’re in the browser. I ran different tests from different countries with Varnish enabled and without. While testing, I could see a performance increase by ~20%.
For example, on giftofspeed.com, I tested the same URL several times with and without Varnish HTTP Cache enabled and got the following results:
