Better Resource Hints vs Nginx Cache Purge Preload

Better Resource Hints will make your WordPress site or application faster and generally more performant by intelligently leveraging resource hints like prefetch, preload, preconnect, and server push. As it stands, WordPress isn’t that bad about providing a base level of these hints. In fact, a basic, dedicated API has been shipped since version 4.6.. However, this functionality only scratches the service, providing only dns-prefetch tags out of the box, and there’s growing opportunity to take advantage of different hints as they are introduced and gain more browser support. Specifically, this plugin focuses on the following types of hints for your styles and JavaScript assets: Preconnecting – This hint is similar to “dns-prefetch,” but a beefier version. Instead of just resolving the DNS, the preconnect hint handles TLS negotiations and TCP handshakes, resulting in reduced page latency. Preloading – Preloading occurs when the browser is told it can start downloading an asset in the background early during page load, instead of waiting until the asset is explicitly called to start the process. This hint is most beneficial for assets loaded later on in the page, but are nonetheless essential to the page’s functionality. More often than not, this is a JavaScript file. Enabling this results in an overall faster load time, and quicker time to interactive. Prefetching – Prefetching assets is similar to preloading, but the assets are downloaded in low priority for the purpose of caching them for later use. For example, if a user hits your home page and is likely to go to a page that uses a heavy JavaScript file, it’s wise to prefetch that asset on the home page, so it’s cached and ready to go on the next. Again, the result is a quicker subsequent page load, quicker time to interactive, and an improved overall user experience. This is different from DNS prefetching, which will only resolve the DNS of a resource’s host, and not actually download the resource itself. Server Push – If enabled, server push will tell your server to start delivering an asset before the browser even asks for it. This results in a much faster delivery of key assets, and be toggled on for both preloaded, prefetched, and preconnected assets. Note: This feature requires a server that supports server push, and is the most experimental strategy this plugin provides. As with any sort of performance-enhancing technique, just be aware that they should be used judiciously, and that the results you see will depend on the size the of resources your site loads, as well as how your server is configured. For additional reading, see some of the resources below: Preload, Prefetch, & Priorities in Chrome Preloading Key Requests Preload: What’s It Good For? Resource Hints – What is Preload, Prefetch, and Preconnect? What Makes This Plugin Stand Apart? There’s no shortage of plugins out there that aim to leverage resource hints for boosting performance. However, I’ve seen that several of them make the following mistakes: Inflexible Hint Management Many similar plugins only provide very limited flexibility in their options, and only allow setting hints globally for every page, regardless of whether the resources are actually needed on the page. This can often result in unecessarily bloaging your bandwidth, since hints on several pages are effectively useless. In some cases, this could actually lead to a less performant site. This plugin attempts to provide options to manage hints more flexibily and intelligently, meaning you won’t be unecessarily preloading assets in the background when they’re not even needed on the page. Misunderstanding What Different Hints Do I’ve come across some plugins that fail to understand and leverage different hints like they were designed. For example, promising that assets are being preloaded, when they’re actually being prefetched. These and other hints have very different purposes, and should not be interchangably used if you want them to impact your site in the most effective way. This plugin attempts to leverage these hints in way to maximize their effectiveness. For example, BHR won’t prefetch any assets that are enqueued on the page, because that’s just not how the prefetch hint is designed to be used. Is Better Resource Hints perfect? Absolutely not. That’s why I encourage any constructive feedback or bug reports to be sent my way immediately, so that I can’t improve this plugin as quickly as possible. A Note About Preloading CSS Because of their high placement on a page, if the option is enabled, your CSS files will be asyncronously preloaded, and then turned into a stylesheet once they’ve completely loaded. The advantage to doing this is that while the files are downloading, they won’t block the rest of the page from rendering, resulting an overall faster page load. However, this also means that there may be a flash of unstyled content on the page for a brief moment as the files download. To prevent this, it’s recommended to only preload CSS files that are not critical to the initial view of the page. This will allow you to gain some performance points without sacrificing use experience as the page loads. Filters The following filters are exposed for your use. /** * Modify the HTML link generated for preconnecting hosts. * * @param string $link (HTML tag) * @param string $url (URL of the host) * @return string */ add_filter('better_resource_hints_preconnect_tag', function ($link, $url) { return $url; }, 10, 2); /** * Modify the HTML link generated for prefetching hosts. * * @param string $link (HTML tag) * @param string $handle (WP handle of the resource * @param string $type (script or style) * @return string */ add_filter('better_resource_hints_prefetch_tag', function ($link, $handle, $type) { return $url; }, 10, 3); /** * Modify the HTML link generated for preloading hosts. * * @param string $link (HTML tag) * @param string $handle (WP handle of the resource * @param string $type (script or style) * @return string */ add_filter('better_resource_hints_preload_tag', function ($link, $handle, $type) { return $url; }, 10, 3); What Happens Out of the Box? Upon activation, Better Resource Hints will optimize your resource hints in a conservative, low-risk way by only doing two things out of the box: Preloading JavaScript assets enqueued in the footer. Setting preconnect hints for all third party hosts that already have dns-preconnect hints. Using the Plugin After activation, you are able to adjust settings to tweak optimization as seen fit. As a means of testing your optimizations, use a tool like Google Lighthouse to measure the impact of these changes on your site’s performance. As mentioned, the techniques used here are largely supported by modern browsers, but your results may vary depending on the amount of assets being loaded on your site, as well as your server configuration. Feedback You like it? Email or tweet me. You hate it? Email or tweet me. Regardless of how you feel, your review would be greatly appreciated!

NPP lets WordPress users manage Nginx Cache Purge and Preload (FastCGI, Proxy, SCGI, UWSGI) operations directly from the WordPress admin dashboard — actively warming the cache via site crawl, so your Nginx cache is always preloaded and ready. NPP is the only Nginx cache plugin that doesn’t just clear the table — it sets the whole banquet. No other Nginx cache plugin comes close to its feature list, purge architecture, preload intelligence on WordPress. 🖥️ Quick WP-CLI Manage your Nginx cache entirely from the command line. Perfect for automation, cron jobs, panels, and headless workflows. Purge: wp npp purge | wp npp purge --page-url= Preload: wp npp preload | wp npp preload --page-url= | wp npp preload --stop Get Full command list: wp help npp | wp help npp ➡️ Resources: • Visit the NPP Main Development Repository – Docs, issues & contributions and more. • Visit the safexec Main Development Repository – NPP’s privilege-dropping C wrapper. • Explore NPP Containerized – Ready to run full stack Nginx Docker setup. • Read the NPP Main Architecture – Technical deep dive article. • Refer to the plugin’s Help tab for more deeper additional guidance. Features 🧹 Purge All Nginx Cache: Completely clear all cached data stored by Nginx. 🔄 Preload All Nginx Cache: Warm the Nginx cache with the most recent data for the entire website. 🎯 HTTP Purge (ngx_cache_purge): When the Nginx cache module (ngx_cache_purge) is available, NPP uses it as the fastest purge path. Falls back gracefully to index and filesystem purge when the module is not present. 🗂️ INDEX Purge: Leverages the preload-generated URL → Filepath index to directly resolve and purge cache without filesystem traversal. If the cache exists and is valid, purge is executed immediately for near-instant performance. ⚡ RG Purge: ripgrep-powered cache file lookup that replaces slow PHP directory scanning for single-URL purges, enabling near-instant deletes on large or FUSE-mounted caches. Automatically falls back to standard scan if unavailable. 🚀 Auto Preload Nginx Cache: Automatically preloads the cache when Auto Purge is enabled for a POST/PAGE or after the Purge All action. 🧼 Auto Purge Nginx Cache: Purge cache on Post/Page content changes, comment status updates, theme/plugin updates, or when compatible Cache Plugins trigger a purge. Nginx cache is preloaded automatically if Auto Preload is enabled (for the entire site or individual page). 🔗 Purge Scope (Related Pages): Automatically purge related pages such as the Homepage, WooCommerce Shop page, and Category/Tag archives when a single URL is purged. Optionally preload those pages to keep the cache warm. 📡 Preload Feeds: Take full control of RSS/Atom feed caching. Decide site‑wide or per‑URL whether the main feed, per‑post comment feeds, and taxonomy RSS feeds are included in the preload process. ⏰ Schedule Nginx Cache Purge & Preload via WP Cron: Automate the purge and preload process using WordPress Cron jobs. 🧭 Proxy Support for Preload: Route preload requests through a proxy server for edge-case environments and containerized deployments. ⏱️ Live Preload Progress Monitoring: Watch the Nginx cache preload process in real time — complete with a dynamic progress bar, currently processed URL, 404 tracking, server load, and total completion time. 🌐 Remote Nginx Cache Purge & Preload via REST API: Remotely trigger cache purging and preloading through REST API endpoints. ⚙️ Manual Nginx Cache Purge & Preload: Allow manual purging and preloading of cache through the table view in the Advanced Tab. 📚 Nginx Cache Analyzer: Full HIT/MISS cache analyzer dashboard, from the last preload crawl with what is currently stored in the Nginx cache. Instantly spot uncached pages and Purge or Preload them directly in the Advanced Tab. 🪫 Preload All MISS: A targeted replacement for the expensive Preload All. Instead of purging and re‑caching everything (Preload All), it targets and populates only the cache entries that are not yet warmed. Perfect for sites with high cache coverage (>50%) where a full Preload All be wasteful. 🔍 On-Page Nginx Cache Purge & Preload: Manually purge and preload Nginx cache for the currently visited page directly from the frontend. 🗝️ Custom Cache Key Support: Define a regex pattern to parse URLs based on your custom _cache_key format. 📊 Monitor Plugin and Nginx Cache Status: Monitor plugin status, cache status, and Nginx status from the Status tab. 📈 Cache Coverage Ratio: Live gauge in the WordPress dashboard widget showing the cache coverage ratio, based on the last preload snapshot. Refreshable on demand without a page reload. ☁️ Cloudflare APO Sync: Automatically mirrors NPP purge actions to Cloudflare APO to keep edge cache synchronized with your Nginx cache. 🔴 Redis Object Cache Sync: Coordinates cache invalidation between NPP and Redis Object Cache during NPP-driven operations. NPP Purge All and Preload workflows handle Redis flushing at the appropriate stage to ensure both cache layers stay aligned. 🛒 WooCommerce Auto-Purge: Automatically purges Nginx cache when WooCommerce product stock quantity changes, stock status changes (in stock / out of stock / on backorder), or when an order is cancelled and stock is restored. 🖲️ WP-CLI Support: Manage Nginx cache directly from the command line. Purge and preload cache, view status reports, inspect logs, update settings, flush cache, and manage scheduled tasks without accessing the WordPress admin dashboard. 🔒 Concurrent Purge Serialization: Atomic lock mechanism prevents simultaneous purge operations from colliding, ensuring cache integrity during concurrent admin actions or background events. 🧩 Modular by Design: Easily integrate with external scripts and automation tools. 🖥️ User-Friendly Interface: Easy-to-use AJAX-powered settings, integrated into the WordPress admin bar and dashboard for quick access. 📋 Admin Notices and Logs: Receive notifications and view logs for plugin status and all cache-related actions within the WordPress admin area. 📧 Email Notifications: Receive email alerts upon completion of preload actions, with customizable templates to suit your needs. Credits This plugin is developed and maintained by Hasan CALISIR. Privacy Policy Prior to version 2.1.5, NPP optionally collected basic anonymous usage data when users explicitly opted in. As of version 2.1.5, all data collection and the opt-in mechanism have been completely removed. NPP collects no data whatsoever. Support For support and assistance, please contact Hasan CALISIR at [email protected]. License This plugin is licensed under the GPLv2 or later.For more information, visit the plugin development page: Nginx Cache Purge Preload