WPGraphQL Smart Cache is a plugin in the WPGraphQL ecosystem that provides on-demand invalidation of cached WPGraphQL data. This means that you can leverage caching solutions like a persistent object cache or a network cache such as Varnish for great performance and automatically invalidate the cached data whenever data changes in WordPress to ensure that cached data stays fresh.
In this article, I will go over in detail the new updates to the plugin.
If you prefer video format, please reference the video here.
Table of Contents
Prerequisites
To benefit from this article, you must have a fundamental understanding of headless WordPress, WPGraphQL, and Smart Cache.
If you are not familiar with the basics and functionality of WPGraphQL Smart Cache, please refer to my article as well as the WPGraphQL article here.
WPGraphQL
An extendable GraphQL
schema & API for WordPress.
You will also need a supported host since this requires a specific implementation within your hosting platform to work. WP Engine is one host that supports this out of the box. If you do not have a WP Engine server, you can get a free sandbox here.
Headless
Platform
The all-in-one platform for
radically fast headless sites.
Jason Bahl also has a gist to make it work with Lightspeed hosts: https://gist.github.com/jasonbahl/d777c7229bad5142211a58ed00da6598
WPGraphQL Smart Cache
Two of the most difficult things in Web Development are naming things and cache invalidation. Luckily, the creation of WPGraphQL Smart Cache has made it easier. Since this plugin’s beginnings two years ago, it has some updates to go over. Let’s dive into them.
What’s New
The UI within WP Admin when downloading the plugin clarifies the settings more to improve the visual hierarchy and organization.
When you download the plugin, navigate over to the GraphQL > Settings > Cache page on the left-hand side of the hamburger menu and you should see this:
Network Cache
The first setting is the Network Cache. Network cache refers to a system that stores copies of content close to users, typically within a network infrastructure like CDNs or web servers, to reduce latency and server load. When a user requests content, the network cache provides the data from the nearest cache node instead of fetching it from the origin server. This process speeds up content delivery, decreases the load on the origin server, and improves the overall user experience by providing quicker access to the content.
This setting influences how the plugin interacts with network cache clients like Varnish. For instance, the Cache-Control max-age
setting specifies how long (in seconds) the network should consider the cached data fresh for GraphQL requests. By setting a proper max-age, the plugin leverages the built-in caching layers of the hosting environment, reducing the load on the WordPress server.
If you use a max-age
of 0
, requests will not be cached. This could be necessary for scenarios where data must be real-time or near-real-time, and any caching could result in stale data being served to the client.
However, this should be used with caution for these reasons:
Performance Impact: Without caching, each request for data will hit the WordPress server directly, which can lead to increased load times for the client and higher resource utilization on the server. This defeats the primary benefit of caching, which is to improve performance by reducing the load on the server.
Scalability Concerns: In high-traffic scenarios, bypassing the cache could potentially overload the server with requests that could have been served from the cache, leading to scalability issues.
Increased Costs: More server resources to handle uncached requests can lead to increased operational costs, especially if you are using a hosting service that charges based on resource usage.
Object Cache
Object cache is a mechanism that stores the results of complex data queries in memory to be quickly retrieved on subsequent requests, without the need to re-query the database each time. This is particularly useful for dynamically generated content that does not change between user requests, as it can significantly reduce database load and improve website performance.
Object cache should ideally be considered as a secondary layer of caching when network cache cannot be used. Network cache serves a broader scope by caching entire HTTP responses, often at the edge closer to the user, and is more efficient for content that is shared across many users. Object cache, being closer to the application layer, is suited for pieces of data unique to the application logic that might not be as effectively cached by network layers.
In scenarios where the network cache like Varnish is not available or suitable—perhaps due to highly dynamic content that changes frequently or personalized content that is unique per user—object caching becomes beneficial. It offers granular control over how individual pieces of data are stored and retrieved. However, because it typically resides on the same server as the application, it does not provide the same scalability benefits as network caching and can increase the load on the server if not managed correctly. Hence, it’s recommended to leverage network caching first, where possible, to maximize the efficiency and scalability of content delivery.
The new settings here would allow users to enable object caching and define the time-to-live (TTL) for the cached objects, which means how long the data remains in the cache before it’s considered stale and refreshed.
Debugging
Developers are always stoked to have tools for easier debugging. Now they are available in Smart Cache.
Log Purge Events
This specific setting within the debugging section gives users the option to track when and why cache purges happen. This could be critical for understanding patterns in cache invalidation and ensuring the cache behaves as expected.
Purge Now
This option provides a manual trigger for users to clear the cached GraphQL Queries. This feature is useful when changes have been made that should be reflected immediately, bypassing the default expiration time.
Did You Purge The Cache
This field confirms whether a cache purge has been successfully triggered and completed. Knowing the last purge timestamp can be helpful in coordinating cache invalidation with site updates or troubleshooting issues.
Conclusion
The WPGraphQL Smart Cache plugin is a tool that supports and solves cache invalidation and caching optimally for WPGraphQL queries.
I touched on some updated features of the plugin. I encourage everyone to dive into the repo, as mentioned, to get their hands dirty and explore all the other awesome features in this plugin.
There are more changes and updates to come. So as always stay tuned! We also would love to hear your feedback, thoughts, and projects you are doing in Headless WordPress so hit us up in our Discord!