Skip to content
Back to Blog
Performance11 min read

Fix PageSpeed Insights: Troubleshooting Common Errors (2026)

Step-by-step guide to diagnosing and fixing the most common PageSpeed Insights errors, from render-blocking resources to cache issues, with exact fixes for each problem.

Written by Abdul AbrorTechnical Hosting Support Engineer
Fix PageSpeed Insights: Troubleshooting Common Errors (2026)
On this page

PageSpeed Insights is Google's diagnostic tool for web performance, but when you run a test and see red scores or cryptic warnings, knowing where to start can be overwhelming. This guide walks through the most common PageSpeed Insights errors you'll encounter in 2026, what causes them, and the exact steps to fix each one.

Understanding PageSpeed Insights Basics

PageSpeed Insights measures your site using Core Web Vitals and other performance metrics. It tests both mobile and desktop, runs real Chrome browser tests, and provides two types of data: lab data (synthetic testing) and field data (real user measurements from Chrome User Experience Report).

When troubleshooting, focus on the Opportunities and Diagnostics sections. Opportunities show specific issues with estimated time savings, while Diagnostics reveal underlying problems that may not have direct time estimates but still impact performance.

Error 1: Eliminate Render-Blocking Resources

Symptoms

You see a warning about render-blocking CSS or JavaScript files, typically showing multiple stylesheet or script URLs that delay initial page render. Your First Contentful Paint (FCP) and Largest Contentful Paint (LCP) scores suffer.

Root Cause

Browsers must download, parse, and execute CSS and JavaScript before rendering page content. When your HTML references external stylesheets in the <head> or synchronous scripts, the browser blocks rendering until those resources load.

The Fix

For CSS:

  1. Inline critical CSS directly in your HTML <head> for above-the-fold content
  2. Load non-critical CSS asynchronously:
<link rel="preload" href="/css/styles.css" as="style" onload="this.onload=null;this.rel='stylesheet'">
<noscript><link rel="stylesheet" href="/css/styles.css"></noscript>
  1. If using WordPress, plugins like WP Rocket or Autoptimize can handle this automatically
  2. For cPanel hosting, enable CSS minification in your optimization plugin

For JavaScript:

  1. Add defer or async attributes to script tags:
<script src="/js/script.js" defer></script>
  1. Use defer when script order matters; use async for independent scripts like analytics
  2. Move non-essential scripts to the footer before </body>
  3. Consider code-splitting to load only necessary JavaScript per page

Verification:

Re-run PageSpeed Insights. The render-blocking warning should disappear or show fewer resources. Your FCP should improve by 0.3-1.0 seconds typically.

Error 2: Serve Images in Next-Gen Formats

Symptoms

PageSpeed Insights reports that images should be in WebP or AVIF format, often listing dozens of JPEG or PNG files with large potential savings.

Root Cause

Traditional image formats (JPEG, PNG) are larger than modern formats like WebP or AVIF at equivalent visual quality. Browsers that support these formats can display them with 25-35% smaller file sizes.

The Fix

Option 1: Server-Level Conversion (Recommended for cPanel)

  1. Install ImageMagick via WHM if you have root access:
sudo yum install ImageMagick ImageMagick-devel
  1. Use a script to batch-convert existing images:
find /home/username/public_html -name "*.jpg" -exec \
  convert {} -quality 85 {}.webp \;
  1. Configure .htaccess to serve WebP when supported:
<IfModule mod_rewrite.c>
  RewriteEngine On
  RewriteCond %{HTTP_ACCEPT} image/webp
  RewriteCond %{REQUEST_FILENAME}.webp -f
  RewriteRule ^(.+)\.(jpe?g|png)$ $1.$2.webp [T=image/webp,E=accept:1,L]
</IfModule>

<IfModule mod_headers.c>
  Header append Vary Accept env=REDIRECT_accept
</IfModule>

Option 2: WordPress Plugins

For WordPress sites, use plugins that handle conversion automatically:

  • ShortPixel: Converts on upload, offers CDN delivery
  • Imagify: Bulk optimization with WebP support
  • Optimole: Real-time image CDN with format conversion

Option 3: Cloudflare Polish

If you use Cloudflare, enable Polish (Pro plan or higher) to automatically convert and optimize images through their CDN.

Verification:

Check your page source or network inspector to confirm WebP files are being served to supported browsers. PageSpeed Insights should remove or reduce the warning.

Error 3: Properly Size Images

Symptoms

PageSpeed Insights shows images that are displayed at smaller dimensions than their actual size, such as a 2000px image displayed at 500px.

Root Cause

Serving oversized images wastes bandwidth and processing power. Browsers must download the full-size file even though CSS or HTML scales it down, and mobile users particularly suffer from this.

The Fix

WordPress Sites:

  1. Use responsive image srcset attributes (WordPress adds these automatically for featured and content images):
<img src="image-500.jpg" 
     srcset="image-500.jpg 500w, image-1000.jpg 1000w, image-1500.jpg 1500w"
     sizes="(max-width: 600px) 100vw, 500px"
     alt="Description">
  1. Regenerate thumbnails if your theme changed sizes:
wp media regenerate --yes

Manual HTML Sites:

  1. Create multiple sizes of each image:
convert original.jpg -resize 500x500 image-500.jpg
convert original.jpg -resize 1000x1000 image-1000.jpg
convert original.jpg -resize 1500x1500 image-1500.jpg
  1. Implement srcset as shown above
  2. Use a CDN with automatic resizing like Cloudinary or ImageKit

Background Images:

For CSS background images, use media queries to serve different sizes:

.hero {
  background-image: url('hero-500.jpg');
}

@media (min-width: 768px) {
  .hero {
    background-image: url('hero-1200.jpg');
  }
}

@media (min-width: 1920px) {
  .hero {
    background-image: url('hero-1920.jpg');
  }
}

Verification:

Inspect your page with browser dev tools and verify that displayed image dimensions match or are slightly larger than the actual display size.

Error 4: Reduce Unused CSS and JavaScript

Symptoms

PageSpeed Insights reports high percentages of unused CSS or JavaScript, showing that your pages load code that isn't executed or applied.

Root Cause

Themes, page builders, and plugins often load their full asset libraries on every page, even when only a small portion is needed. A contact form plugin might load its entire CSS file site-wide when the form only appears on one page.

The Fix

WordPress Approach:

  1. Install Asset CleanUp or Perfmatters plugin
  2. Visit each page type and disable unused scripts/styles per page
  3. Conditionally load assets only where needed:
// In functions.php
function dequeue_unused_scripts() {
  if (!is_page('contact')) {
    wp_dequeue_style('contact-form-7');
    wp_dequeue_script('contact-form-7');
  }
}
add_action('wp_enqueue_scripts', 'dequeue_unused_scripts', 100);

Manual Code Approach:

  1. Use Chrome DevTools Coverage panel to identify unused code
  2. Split your CSS/JS into page-specific files
  3. Load only what each page needs:
<!-- Homepage only -->
<?php if (is_front_page()) : ?>
  <link rel="stylesheet" href="/css/homepage.css">
<?php endif; ?>
  1. Consider removing page builders if they load excessive code

CSS Purging:

For build-tool users, integrate PurgeCSS to remove unused styles automatically:

npm install --save-dev @fullhuman/postcss-purgecss

Verification:

Re-run the Coverage report in Chrome DevTools and confirm the percentage of unused code decreases. PageSpeed Insights should show reduced warnings.

Error 5: Leverage Browser Caching / Serve Static Assets with Efficient Cache Policy

Symptoms

PageSpeed Insights warns that many resources lack cache headers or have short cache durations, listing CSS, JavaScript, images, and fonts.

Root Cause

Without proper cache headers, browsers re-download unchanged resources on every visit. This wastes bandwidth and slows repeat visits.

The Fix

Apache/.htaccess (Most cPanel Hosting):

Add these directives to your .htaccess file:

<IfModule mod_expires.c>
  ExpiresActive On

  # Images
  ExpiresByType image/jpg "access plus 1 year"
  ExpiresByType image/jpeg "access plus 1 year"
  ExpiresByType image/gif "access plus 1 year"
  ExpiresByType image/png "access plus 1 year"
  ExpiresByType image/webp "access plus 1 year"
  ExpiresByType image/svg+xml "access plus 1 year"

  # CSS and JavaScript
  ExpiresByType text/css "access plus 1 month"
  ExpiresByType application/javascript "access plus 1 month"
  ExpiresByType application/x-javascript "access plus 1 month"

  # Fonts
  ExpiresByType font/woff2 "access plus 1 year"
  ExpiresByType font/woff "access plus 1 year"
  ExpiresByType application/font-woff2 "access plus 1 year"

  # Default
  ExpiresDefault "access plus 2 days"
</IfModule>

<IfModule mod_headers.c>
  <FilesMatch "\\.(jpg|jpeg|png|gif|webp|svg|css|js|woff2|woff)$">
    Header set Cache-Control "public, max-age=31536000, immutable"
  </FilesMatch>
</IfModule>

Nginx (VPS Hosting):

Add to your server block:

location ~* \.(jpg|jpeg|png|gif|webp|svg|css|js|woff2|woff)$ {
  expires 1y;
  add_header Cache-Control "public, immutable";
}

Third-Party Resources:

For resources you can't control (Google Fonts, analytics), consider:

  1. Self-hosting critical third-party files
  2. Using Cloudflare to cache third-party resources
  3. Accepting the warning if the resource changes frequently

Verification:

Use browser DevTools Network tab to inspect response headers. Look for Cache-Control and Expires headers with appropriate values.

Error 6: Reduce Server Response Time (TTFB)

Symptoms

PageSpeed Insights reports slow server response time, typically showing Time to First Byte (TTFB) over 600ms.

Root Cause

Slow TTFB usually stems from inadequate server resources, unoptimized database queries, lack of caching, or server location far from users.

The Fix

Immediate Fixes:

  1. Enable full-page caching (WP Rocket, W3 Total Cache, LiteSpeed Cache)
  2. Implement object caching for database-heavy sites:
# Install Redis in cPanel via EasyApache or SSH
sudo yum install redis
sudo systemctl enable redis
sudo systemctl start redis
  1. Enable OPcache in PHP settings (cPanel: MultiPHP INI Editor):
opcache.enable=1
opcache.memory_consumption=256
opcache.max_accelerated_files=20000
opcache.revalidate_freq=60

Database Optimization:

  1. Optimize WordPress database tables:
wp db optimize
  1. Remove post revisions and spam:
DELETE FROM wp_posts WHERE post_type = 'revision';
DELETE FROM wp_comments WHERE comment_approved = 'spam';
  1. Add indexes to slow queries (identify with Query Monitor plugin)

Hosting Upgrades:

  1. Check current resource usage in cPanel metrics
  2. If consistently hitting CPU or memory limits, upgrade your plan
  3. Consider moving from shared to VPS hosting for better dedicated resources
  4. Look for hosts with LiteSpeed or Nginx+FastCGI for better performance

CDN Implementation:

Use a CDN to reduce geographic latency:

  1. Cloudflare (free tier available)
  2. StackPath
  3. BunnyCDN

Configure your CDN to cache HTML for the best TTFB improvement.

Verification:

Use webpagetest.org to measure TTFB from multiple locations. Aim for under 500ms for shared hosting, under 200ms for VPS.

Troubleshooting PageSpeed Insights Itself

When Scores Vary Wildly

PageSpeed Insights can show different scores between runs. This happens because:

  • Tests run from different geographic locations
  • Server load fluctuates
  • Network conditions vary
  • Field data updates slowly (28-day rolling average)

Run 3-5 tests and average the results. Focus on the specific issues identified rather than the numeric score.

When Field Data Doesn't Match Lab Data

Field data reflects real user experiences over time, while lab data is a single test. Field data is more important but slower to update. After making changes, lab data will reflect improvements immediately, but field data takes weeks to update.

When Issues Don't Apply to Your Site

PageSpeed Insights sometimes flags issues that don't apply to your use case. For example, it might suggest removing unused CSS that's needed for user interactions. Use your judgment and prioritize issues with the largest impact.

Conclusion

Fixing PageSpeed Insights errors requires methodical diagnosis and targeted fixes rather than generic optimization. Start with the issues showing the largest time savings, verify each fix with re-testing, and remember that Core Web Vitals matter more than the numeric score. Most common errors stem from unoptimized images, render-blocking resources, and inadequate caching—all fixable with the techniques covered here. If your shared hosting limits your ability to implement these fixes, consider upgrading to a plan with better caching support and resources. Focus on real improvements for your users rather than chasing perfect scores, and your site will benefit from faster load times and better search rankings.

FAQ

How often should I check PageSpeed Insights?

Check after making site changes and monthly otherwise. Set a baseline, make improvements, then monitor to ensure scores don't regress with new features or content.

What's a good PageSpeed score?

A score of 90+ is excellent, 50-89 needs improvement, and below 50 is poor. However, focus more on Core Web Vitals passing thresholds (green) than the numeric score.

Can hosting affect PageSpeed scores?

Absolutely. Shared hosting with limited resources, old PHP versions, or no caching support will hurt scores. Quality managed WordPress hosting or VPS typically provides better baseline performance.

Should I optimize for mobile or desktop first?

Optimize for mobile. Google uses mobile-first indexing, mobile tests are typically stricter, and most web traffic is mobile. Improvements for mobile usually benefit desktop too.

Do plugins always slow down WordPress?

Not necessarily. Well-coded plugins with minimal database queries and asset loading have little impact. Poorly coded plugins or those that load assets globally can significantly hurt performance. Audit your plugins regularly and disable ones you don't actively use.