The brief was simple: “Our site is scoring 54 on PageSpeed. Clients are complaining it’s slow. We don’t have budget to move hosting.”
The site: a WooCommerce store with 800 products, a premium theme (Avada), and about 40 active plugins. Shared hosting at a local provider. The kind of setup that makes performance engineers wince.
Three weeks later: 100/100 on PageSpeed Mobile. Here’s exactly what we did.
Step 1: Diagnose Before You Optimize
Before touching anything, we ran the full diagnostic suite:
- PageSpeed Insights (mobile + desktop)
- WebPageTest with filmstrip view
- Chrome DevTools Performance panel
- Query Monitor plugin (for database query analysis)
The culprits, in order of impact:
- Render-blocking JavaScript: 14 scripts loading synchronously in
<head> - Unoptimized images: 2.3MB of images above the fold, none of them WebP
- No server-side caching: every page was being generated fresh from PHP + MySQL
- Unused CSS: Avada’s CSS was 380KB, of which maybe 60KB was actually used
- Google Fonts loaded via a render-blocking
<link>in the head
Step 2: Server-Side Caching (Biggest Win)
The host didn’t offer Redis or Memcached. But it did have LiteSpeed Web Server, which supports LSCache. We installed the LiteSpeed Cache plugin and configured it properly:
- Page cache TTL: 1 hour (with cache-purge on WooCommerce stock changes)
- Browser cache: 1 year for static assets
- Object cache: enabled via LSCache’s built-in object caching
This single change took TTFB from 1.4 seconds to 180ms.
Step 3: Image Optimization
Every image went through three changes:
- Converted to WebP using ShortPixel (batch-processed all 800 product images)
- Added
loading="lazy"to all images below the fold - Added explicit
widthandheightattributes to prevent layout shift (CLS)
Result: above-the-fold image payload dropped from 2.3MB to 180KB.
Step 4: JavaScript Defer + Async
We went through every enqueued script and classified it:
- Critical (must be synchronous): None. Zero scripts need to block render on this site.
- Deferred: Everything. WooCommerce cart scripts, slider JS, analytics — all moved to
defer. - Removed entirely: 11 plugins were loading JS on every page. 6 of them weren’t needed on any given page. We used code splitting via Asset CleanUp Pro to load scripts only on the pages that needed them.
Step 5: Critical CSS + Font Strategy
Avada’s 380KB stylesheet was killing us. We extracted the above-the-fold critical CSS (~12KB) and inlined it directly in <head>, then loaded the full stylesheet asynchronously. For Google Fonts, we switched to self-hosted fonts (downloaded via google-webfonts-helper) and used font-display: swap.
Final Score
Mobile PageSpeed: 54 → 100. Desktop: 61 → 100.
More importantly: actual user metrics improved. Bounce rate dropped 18% over the following month. Conversion rate increased 12%.
Performance is a feature. It compounds.