A simple yet powerful WordPress plugin that automatically reorders the tags in your <head> section for optimal loading performance, ensuring critical resources are prioritized.
By default, WordPress, themes, and various plugins add tags (<meta>, <link>, <script>, <style>) to the <head> section based on their own execution priority. This often results in a suboptimal order that can negatively impact page rendering speed and Core Web Vitals.
For example, crucial preconnect or preload hints might appear after less important meta tags, or render-blocking stylesheets might be delayed by other elements.
This plugin solves the problem by intelligently rearranging the entire <head> section based on modern web performance best practices. It ensures that the most critical tags are placed first, allowing the browser to discover and fetch important resources sooner.
- Automatic Reordering: No configuration needed. Just install and activate.
- Universal Compatibility: Works with any theme or plugin (including Yoast SEO, caching plugins, etc.) because it processes the final HTML output.
- Performance-First Logic: The sorting order is designed to improve key performance metrics like First Contentful Paint (FCP) and Largest Contentful Paint (LCP).
- Lightweight & Efficient: The plugin has a minimal footprint and uses PHP's native
DOMDocumentfor safe and reliable HTML parsing. - Preserves All Tags: It correctly handles all tags, including HTML comments, ensuring nothing is lost or broken.
The plugin uses a robust output buffering technique:
- Capture: It hooks into
wp_headat the very beginning (priority0) and starts an output buffer, capturing everything that other functions would normally print. - Process: It then hooks into
wp_headat the very end (priority9999), stops the buffer, and gets the complete HTML content of the<head>. - Parse & Sort: The captured HTML is safely parsed into a DOM tree. Each tag is assigned a "weight" based on its performance impact. The tags are then sorted in descending order of their weight.
- Print: The newly sorted list of tags is printed, resulting in a perfectly ordered
<head>section in your site's source code.
Tags are reordered according to the following priority list (from highest to lowest):
- Meta Charset (
<meta charset="...">) - Meta HTTP-Equiv (e.g., X-UA-Compatible)
- Title Tag (
<title>) - Meta Viewport
- Preconnect & DNS-Prefetch (
<link rel="preconnect">) - Async Scripts (
<script async>) - Inline Critical Styles (
<style>...</style>) - Synchronous Stylesheets (
<link rel="stylesheet">) - Preload Hints (
<link rel="preload">) - Synchronous Scripts (
<script src="...">) - Deferred Scripts (
<script defer>) - SEO & Social Meta Tags (Description, Open Graph, Twitter Cards)
- Canonical URL (
<link rel="canonical">) - Prefetch & Prerender Hints
- Other Meta Tags
- Other Tags & Comments
- Download: Download the
.zipfile from this repository. - Upload: In your WordPress admin dashboard, go to
Plugins>Add New>Upload Plugin. - Select & Install: Choose the downloaded
.zipfile and clickInstall Now. - Activate: Activate the plugin.
That's it! The plugin will now automatically optimize the <head> section on every page load.
This project is licensed under the MIT License - see the LICENSE.md file for details.