help4bis/seo-intel-docs
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
Files
main
seo-intel-docs/case-studies/rds-77-score.md
help4bis 335d9a76e1 Initial SEO-INTEL documentation: architecture, scoring, code structure 
Add comprehensive documentation for the dual-engine performance evaluation system:
- System architecture and data flow
- Score calculation methodology (0-100 approximation from CWV thresholds)
- Detailed metrics reference (LCP, FCP, CLS, TBT, TTFB)
- Testing engines comparison (Sitespeed vs PSI)
- Complete code structure map (file-by-file breakdown)
- Case study: rds.ink 77 score with actionable fixes
- Quick reference guides for interpreting results

Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
2026-05-14 05:56:49 +10:00

8.2 KiB
Raw Permalink Blame History

Case Study: rds.ink/drawings-of-endangered-animals-series/ Scores 77

Date tested: 2026-05-13 07:12:51 UTC Device: Mobile Engine: Sitespeed.io (HAR-based approximation) Score: 77/100 ← AMBER (needs improvement)

The Numbers

Metric Value Good Poor Status Contribution
TBT (Total Blocking Time) 1,807ms 200ms 600ms 🔴 CRITICAL 30/100 pts
FCP (First Contentful Paint) 2,116ms 1,800ms 3,000ms 🟡 SLOW 82/100 pts
TTFB (Time to First Byte) 144ms 800ms 1,800ms ✓ GOOD 100/100 pts
CLS (Cumulative Layout Shift) 0.0 0.1 0.25 ✓ EXCELLENT 100/100 pts
LCP (Largest Contentful Paint) Not measured 2,500ms 4,000ms ❓ UNKNOWN skipped

Final score: (30 + 82 + 100 + 100) / 4 = 78 ≈ 77

Why 77, Not Higher?

One metric kills the score: TBT at 1,807ms.

TBT (Total Blocking Time) is how long JavaScript execution blocks user interaction. Your page:

  1. Finishes initial render at FCP (2.1s) ✓
  2. BUT JavaScript continues executing for another 1.8 seconds after that
  3. During those 1.8s, user clicks don't work, scrolling is frozen
  4. Page feels frozen even though it looks loaded

This single metric contributes only 30/100 points, dragging the average from ~90 to 77.

Root Cause Analysis

Page Composition (from HAR)

  • Total size: 4.2 MB
  • Images: 0.6 MB (14%)
  • JavaScript: 1.8 MB (44%) ← THE PROBLEM
  • CSS: Not measured
  • Requests: 26 HTTP requests

The JavaScript is the bottleneck. 1.8 MB of JS code, much of it loaded during page render:

  • WooCommerce scripts (jQuery, jQuery plugins, WC-specific code)
  • Elementor JavaScript runtime (webpack, core, widgets)
  • Product gallery plugins (likely Lightbox, PhotoSwipe, or Slick)
  • Lazy-load libraries
  • Analytics/tracking scripts

All of this executes synchronously on the main thread, blocking the browser from responding to user input.

Why FCP is Slow Too (2,116ms)

The page doesn't show any content until 2.1 seconds because:

  1. Server takes 144ms (acceptable)
  2. Browser parses HTML
  3. Hits render-blocking JavaScript in <head> or early <body>
  4. Waits for scripts to download + execute
  5. Finally renders first content

If you defer non-critical JS, FCP would drop significantly.

How to Fix It: Hummingbird Settings

You use Hummingbird for performance optimisation. Here are the exact steps:

Fix #1: Defer Non-Critical JavaScript (15 min, +12 score points)

Path: WordPress Admin → Performance → Hummingbird

  1. Click Performance tab
  2. Scroll to JavaScript section
  3. ✓ Enable "Defer JavaScript"
    • This adds defer to all <script> tags except critical ones
    • Page renders BEFORE scripts execute
    • User sees content faster
  4. ✓ Enable "Compress JavaScript"
    • Minifies JS to reduce parse time
  5. Save

Expected impact: TBT 1,807ms → 400ms | Score 77 → 88

Fix #2: Lazy-Load Product Gallery (30 min, +5 score points)

The page has product cards with Lightbox/gallery plugins. These load globally but only needed when user clicks an image.

Option A (Using Hummingbird Pro):

  1. Performance → Asset Optimization
  2. Find the gallery plugin (e.g., glightbox.min.js)
  3. Set to load only on product pages or only on this specific page
  4. Hummingbird will skip loading it on homepage, category pages, etc.

Option B (Manual):

  1. Check what gallery plugin you're using (inspect page source, look for lightbox, glightbox, swiper, slick in script names)
  2. Go to that plugin's settings
  3. Look for "Lazy Load" or "Load on Interaction" option
  4. Enable it

Expected impact: TBT 1,807ms → 600ms | Score 77 → 85

Fix #3: Disable Unused Plugins on This Page (20 min, +2 score points)

WooCommerce loads a LOT of plugins globally. This page may not need all of them.

Path: WordPress Admin → Plugins

  1. Check which plugins are active
  2. For each plugin, ask: "Is this used on the endangered-animals page?"
    • Contact form plugin? (If no contact form on page → disable or load only on contact pages)
    • Affiliate/referral plugin? (If not visible → disable)
    • Social sharing? (If not visible → disable)
    • Booking plugin? (If not used → disable)
    • Custom tracking? → check if needed
  3. Hummingbird Pro: Use "Asset Optimization" to load plugins only on pages that need them

Expected impact: Saves ~100ms | Score 77 → 79

Fix #4: Enable Page Caching (5 min, +1 score point)

Path: WordPress Admin → Performance → Hummingbird → Caching

  1. Click Caching tab
  2. ✓ Enable "Page Caching"
    • Set cache expiry: 24 hours (or 7 days if content doesn't change daily)
  3. ✓ Enable "Browser Caching"
    • Tells visitor browsers to cache static assets
  4. Save

Expected impact: TTFB 144ms → 50ms on repeat visits | Score 77 → 78 (small gain)

Expected Results

Step TBT Impact Score Impact
Initial 1,807ms 77
After Fix #1 (defer JS) 400ms 88
After Fix #2 (lazy-load gallery) 150ms 92
After Fix #3 (disable plugins) 100ms 94
After Fix #4 (page cache) 100ms (TTFB, not TBT) 95
TOTAL 1,807ms → 100ms 77 → 95

Step-by-Step Instructions

Before You Start

  1. Backup your database: 
    wp db export /home/help4bis/backups/rds_backup_$(date +%Y%m%d_%H%M%S).sql
  2. Go to your WordPress site admin panel for rds.ink

Step 1: Defer JavaScript (easiest, highest impact)

  1. WordPress Admin → Performance
  2. Click Hummingbird
  3. Click Performance tab
  4. Scroll to JavaScript section
  5. Toggle ON: "Defer JavaScript"
  6. Toggle ON: "Compress JavaScript"
  7. Click Save button
  8. Wait 5 minutes for cache to clear

Step 2: Lazy-Load Gallery

  1. WordPress Admin → Plugins → Installed Plugins
  2. Look for gallery/lightbox plugin names:
    • "Elementor" (has built-in gallery)
    • "Glightbox"
    • "Photo Gallery"
    • "FooGallery"
    • "Lightbox with Photo Gallery"
  3. Click on the plugin name to open settings
  4. Look for "Lazy Load" or "Load on Interaction" toggle
  5. Enable it
  6. Save

Step 3: Disable Unused Plugins

  1. WordPress Admin → Plugins → Installed Plugins
  2. For each plugin, check if it's actually used on the endangered-animals page:
    • Hover over plugin name
    • Click "Settings" if available
    • Check if it applies to this page
  3. If not used on this page: Deactivate (don't delete)
  4. Test the page in browser to make sure nothing broke

Step 4: Enable Caching

  1. WordPress Admin → Performance → Hummingbird
  2. Click Caching tab
  3. Toggle ON: "Page Caching"
    • Set expiry to: 24 hours or 7 days
  4. Toggle ON: "Browser Caching"
  5. Click Save

Verify Your Fix

  1. Go to http://192.168.0.117:8765/performance/
  2. Click on rds.ink (site ID 3)
  3. Scroll to "URL breakdown" table
  4. Find rds.ink/drawings-of-endangered-animals-series/
  5. Click "Mob" (mobile test) button
  6. Wait ~90 seconds
  7. Refresh the page
  8. New score should appear (expected: 88–95)

Common Questions

Q: What if I'm not using Hummingbird? A: Switch to Hummingbird. It's what your portfolio uses. Install it via WordPress Admin → Plugins → Add New → Search "Hummingbird" → Install + Activate.

Q: Will deferring JS break anything? A: No. Defer is safe — it just loads scripts after page render. If something breaks, you'll see it immediately on the page. You can turn it off.

Q: How often should I test? A: Test after each fix to verify the improvement. Then test weekly via the "Run portfolio sweep" button.

Q: Why not just buy WP Rocket? A: You already have Hummingbird. Both do the same job. Stick with Hummingbird.

Q: Can I change the performance thresholds? A: Yes, but they're hard-coded in the sitespeed.io configuration. Not recommended — they're based on Google's official Lighthouse rubric.

Related Reading

Reference in New Issue View Git Blame Copy Permalink