Media
2 items
Description
Web Page performance audit overlay: preload/lazyload/font hints + INP monitor. Perf Quick Audit — Web Performance Checks (Instant Overlay) Perf Quick Audit is a lightweight Chrome extension that runs a fast, practical performance audit on any page you open. Click the extension, and it shows an on-page overlay with clear ✅ / ❌ checks so you can spot common speed issues in seconds. It’s built for SEOs, developers, and site owners who want quick answers while reviewing real pages What it checks 1) Above-the-fold image checks Hero image preload detection (supports common preload patterns) Hero image fetchpriority="high" check Logo checks Detects logo element in the header area Checks logo fetchpriority If logo is SVG, it highlights it with 😍 (SVG is typically smaller and stays sharp) 2) Below-the-fold lazy loading checks (smart rules) Finds clearly below-fold images and checks if they use loading="lazy" Avoids false flags for images that are still partially visible Does not flag SVG images for lazy loading (lazy-loading SVG usually has limited benefit) 3) Preload checks for key assets Font preload checks (link[rel="preload"][as="font"]) Flags common issues like missing crossorigin on cross-origin font preloads CSS preload checks (as="style") Highlights whether high priority loading hints are present JS preload checks Includes both preload and modulepreload Highlights whether high priority loading hints are present 4) Inline critical CSS signal Detects inline CSS under <style> tags (especially in <head>) Shows count and approximate size, so you can confirm whether critical CSS is being used 5) DNS Prefetch & Preconnect hints (external domains) Looks at page resource usage and identifies the top external domains Checks if the page includes dns-prefetch and/or preconnect hints for those domains Treats subdomains as same-site (so your own asset subdomains don’t get mislabeled) 6) Font loading and fallback checks Scans accessible @font-face rules and flags missing font-display Checks whether the page has a generic fallback in the computed body font stack Detects font file sources as: same-site (including subdomains) external 7) Static image caching checks (Cache-Control max-age) Samples same-origin image resources and checks Cache-Control: max-age Flags cases where max-age is too short (useful for spotting caching gaps) Notes: browser scripts can’t always read headers for cross-origin CDNs unless allowed 8) INP monitor (interaction responsiveness) Shows a live INP-style monitor while the overlay is open Tracks real user interactions (clicks/typing) Flags when the slowest interaction goes above 200ms Copy report The extension includes a “Copy as text” button that copies the audit results to your clipboard. This makes it easy to paste findings into: Slack messages Jira tickets QA notes Client updates How to use Open any webpage Click the Perf Quick Audit extension icon Review ✅ / ❌ checks in the overlay Click an item to highlight the related element on the page (when applicable) Use Copy as text to share results Notes & limitations Some checks depend on what the browser can access (example: cross-origin CSS rules or CDN response headers may be restricted). If a hero image is set via CSS background-image instead of an <img>, it may not be detected as a “hero image”. The tool is designed for quick audits and fast debugging, not as a replacement for Lighthouse or lab tooling.