What is proxy caching

Speed is important. Even if you have optimized your site already, the load times can vary based on the physical location. You may also have a good server, but you can still improve TTFB and page load time with proxy caching.

Many sites are using Cloudflare as a CDN, however you can also use it to cache your pages, and let Cloudflare serve them to your visitors. It means, that on the first visit Cloudflare will cache the page content as well, so following requests won’t even hit your server. Of course if you are using Cloudflare for page caching you will need to enable Auto Purge for Cloudflare.

NOTE: only Cloudflare Business and Enterprise packages let you to bypass the cache based on cookies, however in most cases you can also use this feature with their free plan, but your logged in users will get the same cached pages. Of course My Account, Cart, Checkout (and any excluded) pages won’t be cached.

Let’s see how can Cloudflare caching can improve the speed of an already optimized site.

Environment:
Siteground StartUp Hosting (Bulgaria)
WordPress 5.0.3
OceanWP + Elementor (Business demo content installed)

Configuration

Swift Performance

Enable Auto Purge and set API credentials to let Swift Performance clear cache if it is necessary

Also enable Proxy Cache and set the Proxy Cache Maxage to 1 year (30879000)

Cloudflare

Add a Page rule in Cloudflare to cache everything

Testing

We will test the site loading speed with GT Metrix from 2 locations: Vancouver, Canada and Hong Kong, China. We will choose Chrome desktop browser for the tests.

First test

Swift Performance is inactive, Cloudflare standard caching enabled. Even if Cloudflare is active, it caches only static content, not the page itself.

Location Fully loaded time Onload Contentful paint Test link
Vancouver 1.5s 1.5s 1.2s
Hong Kong 1.9s 1.8s 1.8s

With Swift Performance

We activated Swift Performance and configured it. We already improved the speed, but is it enough? Not for us…

Location Fully loaded time Onload Contentful paint Test link
Vancouver 1.3s 1.2s 0.9s
Hong Kong 1.6s 1.4s 1.3s

Proxy cache enabled

Lets see what happens if we let Cloudflare cache the page itself.

Location Fully loaded time Onload Contentful paint Test link
Vancouver 0.7s 0.6s 286ms
Hong Kong 0.5s 286ms 224ms

Conclusion #1

The most important factor for user experience is Contentful paint time. We decreased it to 2-300ms, which is almost instant load. That means when the user clicks your link in Google results, the page will be shown instantly on their device.

But there is an other important aspect: load time on 3G

Testing on 3G

We will test the site loading speed with GT Metrix from 2 locations: Vancouver, Canada and Hong Kong, China. We will choose Chrome desktop browser for the tests again, but now we limit the connection speed to 3G

First test

Swift Performance is inactive, Cloudflare standard caching enabled. Even if Cloudflare is active, it caches only static content, not the page itself.

Location Fully loaded time Onload Contentful paint Test link
Vancouver 10.7s 9.8s 4.2s
Hong Kong 12.5s 11.2s 7.0s

With Swift Performance

We activated Swift Performance and configured it. Lets see if it is good enough this time…

Location Fully loaded time Onload Contentful paint Test link
Vancouver 5.8s 5.6s 3.3s
Hong Kong 5.6s 5.4s 3.3s

Proxy cache enabled

Lets see what happens if we let Cloudflare to cache the page itself.

Location Fully loaded time Onload Contentful paint Test link
Vancouver 4.4s 4.2s 2.2
Hong Kong 4.4s 4.2 2.1s

Conclusion #2

We decreased the rendering time (contentful paint) to 2.2s. If you imagine yourself with your phone in your hand, you just clicked to a link somewhere, and you need to wait 5-7s to see the content, or only ~2s you can imagine the difference 🙂