WP Auditor

WP Auditor is a developer tool that performs deep performance analysis on any webpage, with a focus on WordPress sites. Unlike generic tools, every issue comes with real evidence — actual file URLs, byte sizes, DOM paths, and plugin names — not vague suggestions.

HOW IT WORKS

The extension collects live data directly from the page you are viewing (DOM structure, scripts, stylesheets, images, WordPress signals) and sends it to a local Playwright backend, which runs a headless browser pass to measure real network sizes, CSS coverage, and load timing. Results appear in the sidebar alongside your page.

WHAT IT CHECKS

JavaScript

• Render-blocking scripts in without defer or async
• jQuery and jQuery Migrate loaded in production
• Duplicate libraries loaded by competing plugins
• Excessive JS file count and total payload size
• Inline script count

CSS

• Total stylesheet count
• Large CSS files over 100KB
• Page builder stylesheets (Elementor, Divi, WPBakery, Beaver Builder)
• Estimated unused CSS percentage via Chrome Coverage API

Network

• Total HTTP request count and page weight
• Third-party domains adding connection overhead
• External domains missing preconnect hints
• Full page load time

DOM

• Total node count (flags above 1500)
• Maximum nesting depth (flags above 15 levels)

Media

• Images served larger than their display size
• Images missing lazy loading
• CSS background images used instead of proper img tags

WordPress-Specific

• Plugin detection via asset URL paths (30+ plugins recognised)
• admin-ajax.php used for frontend requests
• WordPress version detection

Anti-Patterns

• Multiple separate Google Fonts requests
• Excessive font file variants
• Unthrottled scroll and resize event listeners

SCORING

Each issue is weighted by severity (Critical, High, Medium, Low) and a score from 0 to 100 is calculated. The sidebar shows a breakdown by category so you can prioritise fixes.

REQUIREMENTS

• Firefox 140 or higher
• A local Node.js backend running on port 3001 (included in the download — one command to start)

WP Auditor is a developer tool that audits web pages for performance issues, with a focus on WordPress sites. It uses a hybrid architecture: the extension collects DOM/JS/CSS data from the active tab via a content script, then sends it to a locally-running Node.js backend (included with the extension) which performs a deeper network analysis using Playwright.

This extension requires a companion backend server running on http://localhost:3001 to function. The backend is a Node.js/TypeScript server (included in the downloadable package from our website) that the developer runs locally on their own machine.

To start the backend: cd backend npm install npx playwright install chromium npx ts-node server.ts

The extension will show a red status dot and an error message if the backend is not running. No data is sent to any external server — all analysis happens locally on the user's machine.

The sidebar makes fetch() calls to http://localhost:3001 to:

1. POST the collected DOM data for analysis
2. Poll for the audit result

This is entirely local — no third-party servers, no cloud services, no data leaves the user's machine.

• activeTab : Read the URL of the currently active tab
• tabs : Query the active tab to get its URL and send messages
• storage : Reserved for future settings persistence (not yet used)
• http:/// : Required to inject the content script into HTTP pages and to allow the sidebar to call localhost:3001
• https:/// : Required to inject the content script into HTTPS pages (most WordPress sites)

content.js is injected into the active tab only when the user clicks "Audit This Page" in the sidebar. It reads:

• Script and stylesheet tags (src attributes only)
• DOM element count and nesting depth
• Image natural vs display dimensions
• Computed background-image styles (decorative image detection)
• window.jQuery global (version detection)
• Inline script text content (pattern matching only)
• Meta generator tag (WordPress version)

The content script does NOT:

• Read form inputs or user-entered data
• Access cookies or localStorage
• Send any data to external servers
• Persist any data

All collected data is passed to the local backend via the sidebar and discarded after the audit report is generated.

The sidebar (sidebar/sidebar.js) uses DOMParser + replaceChildren() for all dynamic HTML rendering — no innerHTML assignments. All user-facing strings are passed through escHtml() for XSS safety. All click handlers use event delegation via data-action attributes — no inline onclick handlers.

1. Install the extension temporarily via about:debugging
2. Start the backend: npx ts-node server.ts (requires Node.js 18+)
3. Navigate to any WordPress site (e.g. https://wordpress.org)
4. Click the WP Auditor toolbar icon to open the sidebar
5. Click "Audit This Page"
6. The sidebar will show a 3-step progress indicator and then display the audit report with scored issues, severity filters, and expandable evidence for each finding

The extension itself (manifest, background, content, sidebar files) has zero external dependencies and makes no network requests except to http://localhost:3001 (the user's own machine).