Oxford Metadata Ltd

<p>Menu Optimizer is a powerful performance optimization plugin that generates static HTML files for your WordPress menus, dramatically reducing server load and improving page load times.</p>
<p><strong>Real-World Success:</strong> This optimization technique helped achieve the first WooCommerce store with a perfect 100/100 mobile score on Google PageSpeed Insights. <a href="https://wp-rocket.me/blog/100-mobile-score-woocommerce/" rel="nofollow ugc">Read the WP Rocket case study</a></p>
<p><strong>Why Menu Caching Matters</strong></p>
<p>Menu generation requires significant compute time on WordPress and WooCommerce sites. Every page load requires WordPress to:<br />
* Query the database for menu items<br />
* Process menu hierarchy<br />
* Apply filters and hooks<br />
* Render HTML output</p>
<p>Menu Optimizer eliminates this overhead by pre-generating menu HTML files that are served instantly.</p>
<p><strong>The DOM Size Problem</strong></p>
<p>Google Lighthouse triggers warnings when a page exceeds 1,500 DOM nodes (HTML elements). For e-commerce sites with extensive product categories:</p>
<ul>
<li>A mega menu with 200-300 categories can generate 3,000-5,000+ DOM elements</li>
<li>Each nested menu item multiplies the element count</li>
<li>This exceeds Google’s limits and hurts Core Web Vitals scores</li>
</ul>
<p>Menu Optimizer’s lazy loading keeps your initial DOM size under 1,500 nodes by loading only top-level items (typically 50-100 elements). Submenus load on-demand, maintaining excellent performance.</p>
<p><strong>Key Features</strong></p>
<ul>
<li><strong>Performance Boost</strong> – Reduces menu rendering time with static file caching</li>
<li><strong>Multiple Menu Support</strong> – Cache and display multiple menus independently on the same page</li>
<li><strong>Horizontal & Vertical Layouts</strong> – Supports both menu orientations for flexible placement</li>
<li><strong>Static File Generation</strong> – Pre-generates HTML files for instant delivery</li>
<li><strong>Lazy Loading</strong> – Top-level items load instantly; submenus load on first hover</li>
<li><strong>Smart Caching</strong> – Uses localStorage for even faster subsequent loads</li>
<li><strong>Max Mega Menu Compatible</strong> – Fully supports complex mega menu layouts</li>
<li><strong>Easy Integration</strong> – Simple shortcode implementation</li>
<li><strong>Translation Ready</strong> – Full i18n support with included POT file</li>
<li><strong>CDN Compatible</strong> – Works seamlessly with caching plugins and CDNs</li>
</ul>
<p><strong>Performance Benefits</strong></p>
<p>✓ Keeps DOM size under Google’s 1,500-node limit with lazy loading<br />
✓ Reduces server CPU usage by offloading menu generation<br />
✓ Decreases Time To First Byte (TTFB)<br />
✓ Improves Core Web Vitals scores (LCP, CLS, INP)<br />
✓ Reduces database queries per page load<br />
✓ Compatible with WP Rocket, W3 Total Cache, and other caching plugins</p>
<p><strong>Perfect For</strong></p>
<ul>
<li>WooCommerce stores with complex category menus</li>
<li>Sites with large mega menus</li>
<li>High-traffic websites</li>
<li>Sites on shared hosting</li>
<li>Performance-critical applications</li>
<li>Stores aiming for 100/100 PageSpeed scores</li>
</ul>
<p><strong>Proven Results</strong></p>
<p>This menu optimization technique was used in a WooCommerce store that achieved a 100/100 Google PageSpeed mobile score.</p>
<p>Learn more: <a href="https://wp-rocket.me/blog/100-mobile-score-woocommerce/" rel="nofollow ugc">WP Rocket Case Study – 100/100 Mobile Score for WooCommerce</a></p>
<h3>Credits</h3>
<p>Developed by <strong>Oxford Metadata Ltd</strong><br />
Contact: dimitris.vayenas@oxfordmetadata.co.uk</p>
<p>Special thanks to the WordPress community for their valuable feedback and contributions.</p>
<h3>Support</h3>
<p>For support, please visit the <a href="https://wordpress.org/support/plugin/static-menu-cache" rel="ugc">WordPress.org support forum</a> or contact us at dimitris.vayenas@oxfordmetadata.co.uk.</p>
<h3>Privacy</h3>
<p>This plugin:<br />
* Does not collect any user data<br />
* Does not make external API calls<br />
* Does not use cookies<br />
* Stores cached menu files locally on your server<br />
* Uses localStorage only for client-side caching (optional)</p>
<h3>Performance Tips</h3>
<ol>
<li><strong>Combine with a caching plugin</strong> – Use WP Rocket or similar for full-page caching</li>
<li><strong>Enable lazy loading</strong> – The plugin does this automatically</li>
<li><strong>Use a CDN</strong> – Serve static menu files from a CDN for global performance</li>
<li><strong>Regenerate regularly</strong> – Update cache whenever you modify your menu structure</li>
<li><strong>Customize CSS via Customizer</strong> – Use WordPress’s built-in Customizer for menu styling</li>
</ol>
<h3>Technical Details</h3>
<p><strong>File Structure:</strong><br />
* Top menu file – Loads instantly with page (minimal HTML)<br />
* Full menu file – Lazy loads on first interaction (complete with submenus)<br />
* CSS options – None, Max Mega Menu auto-detect, or custom<br />
* Storage location – <code>wp-content/uploads/menu-optimizer/</code></p>
<p><strong>Browser Compatibility:</strong><br />
* Chrome 90+<br />
* Firefox 88+<br />
* Safari 14+<br />
* Edge 90+</p>
<p><strong>Server Requirements:</strong><br />
* PHP 7.4 or higher<br />
* WordPress 5.8 or higher<br />
* Write permissions to uploads directory</p>


Menu Optimizer

Boost site speed with static menu caching. Lazy-load submenus to keep DOM size under 1,500 nodes for better Core Web Vitals.

Peter Elmered

<h4>THIS PLUGIN IS STILL EXPERIMENTAL – USE AT YOUR OWN RISK!</h4>
<p>The plugin is under development. Please try it and contact me if you encounter any bugs or have any questions or suggestions. If you want to help me develop this further send a pull request on <a href="https://github.com/pelmered/wp-pjax" title="WP-PJAX on GitHub" rel="nofollow ugc">GitHub</a>.<br />
The plugin is not ready for production yet, but I will soon release version 0.1 that will be production ready.</p>
<h4>WP-PJAX – PJAX for WordPress Plugin.</h4>
<p>Makes your site faster and saves you a lot of bandwidth and CPU power by making your WordPress site PJAX powered!</p>
<h4>What is PJAX?</h4>
<p>PJAX is a technique that uses AJAX and PushState to deliver a faster browsing experience by only loading and updating parts of the page HTML each page load. PushState makes it possible to add real permalinks, page titles, and a working back button so that your visitors won’t be able to tell the difference between PJAX page load and ordinary full page loads, except for the increased speed of course :).</p>
<h4>Why PJAX?</h4>
<p>It makes your site significantly faster in most cases and saves you both processing power and bandwidth!</p>
<h4>Features</h4>
<ul>
<li>Speeds up any website. With the built in page cache enabled you can expect 10-50+% faster page loads. </li>
<li>Supports 4 Levels of application cache! This plugin uses browser cache and page cache. It is also enabling reverse proxy(i.e. Varnish) cache by (optionally) striping sessions and cookies and it works very well with underlaying object and database cache using third party cache plugins such as <a href="https://wordpress.org/extend/plugins/w3-total-cache/" title="W3 Total Cache" rel="ugc">W3 Total Cache</a> (recommended). </li>
<li>Works well with <a href="https://wordpress.org/extend/plugins/w3-total-cache/" title="W3 Total Cache" rel="ugc">W3 Total Cache</a>.</li>
<li>Configurable. No need to dig into the code. You will still need basic knowledge about HTML and how WordPress works to make this plugin reach it’s full potential.</li>
<li>Live notices with a report for every page load (Load time, page cache hit or miss, Reverse proxy/Varnish cache miss or hit etc – See screenshot). This is great for debugging and testing and is of course only visible for admins.</li>
<li>Only a few changes in your theme and you are ready to go. Should not take more than 5 minutes and requires only basic knowledge.</li>
</ul>
<h4>Browser support</h4>
<p>PJAX is not supported in Internet Explorer 9 and earlier(IE 10+ supports this), but the plugin handles this gracefully by falling back on regular page loads for unsupported browsers. <a href="http://caniuse.com/#search=pushstate" title="Details on browser support" rel="nofollow ugc">Details on browser support</a></p>
<h4>Development</h4>
<p>All development of this plugin occurs on <a href="https://github.com/pelmered/wp-pjax" title="WP-PJAX on GitHub" rel="nofollow ugc">GitHub</a>. Please help me develop this by forking and sending pull requests.</p>
<h4>Planned features / To-Do</h4>
<ul>
<li>Better handling of menu active classes. Will probably use regex for this. Support for marking parent pages active would be nice but I don’t know any good ways to accomplish that.</li>
<li>Better control over exceptions for when to disable PJAX, when you use Page cache, and when and what cookies and sessions that should be striped. Regex support will be added.</li>
<li>Refresh cache on publish/update.</li>
<li>Separate loading of sidebars with separate cache.</li>
<li>Page loading notice / icon. This should also be customizable with css, text(localizable) and it should be possible to upload your own icon.</li>
<li>Page cache prefetch needs to be revisited. WP-Cron is a bit tricky and its hard to handle timeouts gracefully and reliably cross different environments. </li>
<li>Remove all debug code and general code cleanup. This will be finished before the 0.1 release.</li>
<li>Add an optional menu to the admin bar for clearing cache(all and current page).</li>
<li>Optimize execution flow for better performance</li>
<li>Maybe: Better way to generate the configurable javascript. I think of two options for this, ether use <code>wp_localize_script</code> to inject variables into javascript or to generate a javascript with PHP file when settings are saved.</li>
</ul>
<h4>Known issues</h4>
<ul>
<li>The PJAX toggle checkbox does not work. <code>$.pjax.disable()</code> does not seam to work as it should. Maybe I need to set a cookie with AJAX to set this for the current user and then handle it on the server side.</li>
<li></li>
</ul>
<h3>Development</h3>
<p>All development of this plugin occurs on <a href="https://github.com/pelmered/wp-pjax" title="WP-PJAX on GitHub" rel="nofollow ugc">GitHub</a>. Please help me develop this by forking and sending plull requests.</p>


WP-PJAX

Makes WordPress a lot faster using PJAX (PushState + AJAX) for loading content.

Menu Optimizer vs WP-PJAX