Debugging Page Speed & Performance Issues using Query Monitor

Query Monitor is a powerful developer tools panel for WordPress. While standard logs often require FTP access and technical parsing, Query Monitor provides a real-time, user-friendly overlay directly in your browser. It is essential for identifying which plugins, themes, or functions are slowing down your site.

1. Installation & Basic Access

  1. Install: Go to Plugins > Add New, search for “Query Monitor,” and click Install Now then Activate.
  2. Access: Once active, a new set of metrics will appear in your top WordPress Admin Bar.
  3. The Overview: Hovering over these metrics shows a summary of:
    • Page Generation Time: Total time taken to render the page.
    • Peak Memory Usage: The maximum RAM used by the request.
    • Database Query Time: Time spent waiting on the database.
    • Total Queries: The number of SQL requests made.

2. Identifying Slow Components

If the Admin Bar turns Red or Orange, Query Monitor has detected an issue. Click the metrics to open the main panel at the bottom of your screen.

A. Database Queries (The “Performance Killer”)

Navigate to Queries > Queries by Component. This view aggregates all database activity and attributes it to specific plugins or your theme.

  • What to look for: Look for components with a high “Time” or “Count.” If a single plugin is making 200+ queries or has a query taking over 0.05s, it is a likely bottleneck.
  • Duplicate Queries: Check the Duplicate Queries tab. This reveals if a plugin is inefficiently asking for the same data multiple times, which can be fixed with better coding or caching.

B. HTTP API Calls

Sometimes a site is slow because it is waiting for an external service (like a payment gateway or social media feed).

  • Open the HTTP API Calls panel.
  • If a request to an external URL shows a high response time (e.g., 2+ seconds), it will “block” your page from loading until it finishes.

C. Scripts & Styles

The Scripts and Styles panels show every file enqueued on the page.

  • Check the Host column. Loading too many scripts from third-party domains (like tracking pixels or fonts) can significantly increase “Time to Interactive” for your users.

3. Advanced Debugging Tips

  • Checking Logged-out Performance: By default, Query Monitor only shows for Admins. To see what a regular visitor (or a specific browser like Chrome) experiences, go to Query Monitor > Settings and click Set authentication cookie. You can then view the debug data in a different browser window without being logged in.
  • Debugging AJAX: If a button click or a “loading” spinner feels slow, Query Monitor captures these background AJAX requests. After the action occurs, look for the “AJAX” notification in the Admin Bar to see the specific data for that request.
  • Component Filtering: Use the Component dropdown in any panel to filter the results down to a specific plugin you are investigating.

4. When to Use This Tool

Use Query Monitor whenever you experience:

  • High server resource usage alerts from your host.
  • Slow admin dashboard performance.
  • Long “Waiting (TTFB)” times in browser developer tools.
  • Discrepancies between browsers (e.g., Firefox is fast, but Chrome feels “stuck”).

Related Articles