---
title: "Astro vs WordPress: A Performance Comparison After Migrating My Blog"
description: "A detailed performance comparison between a WordPress blog and its Astro-migrated version is presented, including before/after metrics and key findings."
slug: wordpress-to-astro-migration-performance-comparison
date: "2025-06-03"
tags:
  - web development
  - astro
  - wordpress
  - performance
  - case study
---

import ImageZoom from "@components/ImageZoom.astro";
import CollapsibleText from "@components/CollapsibleText.astro";

Recently, [I migrated my blog from WordPress to Astro](/moved-blog-from-wordpress-to-astro/), looking for improvements in developer experience, content workflow, and performance. While my primary motivations weren't purely performance-related (as detailed in my previous post), I was certainly curious how the two platforms would compare.

<ImageZoom
  src="/images/blog/2025/wordpress-astro-comparison.jpg"
  alt="Side-by-side comparison of WordPress and Astro blog posts showing performance improvements"
  width={1200}
  height={600}
/>

This post focuses exclusively on the performance comparison between my WordPress site and the new Astro version. Using Lighthouse and real-world metrics, I'll analyze the performance differences, share unexpected findings, and what we can learn from them.

## Performance comparison script

You can find the nodejs script I created to run this performance comparison [github.com/mfyz/mfyzcom_lighthouse_benchmark](https://github.com/mfyz/mfyzcom_lighthouse_benchmark).

- Runs Lighthouse performance benchmarks on matching pages across two websites
- Compares key metrics: Performance, Accessibility, Best Practices, SEO
- Measures Web Vitals: LCP, FID, TTFB - Additionally analyzes resource sizes: HTML, JS, CSS
- Exports results to CSV for analysis

Script is not limited to WordPress and Astro. There are two domains and list of urls defined in the script, but these two domains can be really anything.

💡 A common use case for this script could be, using preview deployment URLs of any site to compare its performance changes before you push them live. Especially handy if you are using Vercel or Netlify for deployments.

## Let's get to the comparison: WordPress vs. Astro

Before pushing the new site live, I ran comprehensive performance tests comparing the WordPress site with the Astro version.

<CollapsibleText title="Pages I selected for testing">
I selected a diverse set of pages to test, including:

- The homepage
- Blog posts with various content types (text-heavy, code-heavy, image-heavy)
- Static pages (About, License)

</CollapsibleText>

<CollapsibleText title="How the benchmark was conducted">
I created a Node.js script using Lighthouse to test both the live WordPress site and local Astro development site. The script:

1. Tests the homepage and 10 randomly selected blog posts
2. Runs Lighthouse audits for performance, accessibility, best practices, and SEO
3. Captures Core Web Vitals metrics like LCP, FID, and CLS
4. Generates a CSV report with the comparison data

All tests were run with the same network and device conditions to ensure a fair comparison.

</CollapsibleText>

### Key Performance Findings

After running comprehensive Lighthouse tests on both the WordPress and Astro versions of the site, here are the actual performance results:

#### Overall Average Scores

<table class="performance-table">
  <thead>
    <tr>
      <th>Metric</th>
      <th>WordPress</th>
      <th>Astro</th>
      <th>Difference</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Performance Score</td>
      <td>99.1</td>
      <td>99.5</td>
      <td style="background-color: #e6f4ea;">+0.4 points</td>
    </tr>
    <tr>
      <td>Accessibility</td>
      <td>99.0</td>
      <td>97.7</td>
      <td style="background-color: #ffe0e0;">-1.3 points</td>
    </tr>
    <tr>
      <td>Best Practices</td>
      <td>99.3</td>
      <td>100.0</td>
      <td style="background-color: #e6f4ea;">+0.7 points</td>
    </tr>
    <tr>
      <td>SEO</td>
      <td>86.0</td>
      <td>100.0</td>
      <td style="background-color: #e6f4ea;">+14.0 points</td>
    </tr>
    <tr>
      <td>Largest Contentful Paint (LCP)</td>
      <td>0.81s</td>
      <td>0.44s</td>
      <td style="background-color: #e6f4ea;">-0.37s (faster)</td>
    </tr>
    <tr>
      <td>First Input Delay (FID)</td>
      <td>16ms</td>
      <td>16ms</td>
      <td>No change</td>
    </tr>
    <tr>
      <td>Time To First Byte (TTFB)</td>
      <td>83.1ms</td>
      <td>68.3ms</td>
      <td style="background-color: #e6f4ea;">-14.8ms (faster)</td>
    </tr>
    <tr>
      <td>HTML Size</td>
      <td>38.9KB</td>
      <td>10.9KB</td>
      <td style="background-color: #e6f4ea; font-weight: bold;">
        -28.0KB (🔻 72.0%) 😍
      </td>
    </tr>
    <tr>
      <td>JavaScript Size</td>
      <td>13.4KB</td>
      <td>5.3KB</td>
      <td style="background-color: #e6f4ea; font-weight: bold;">
        -8.1KB (🔻 60.4%) 😍
      </td>
    </tr>
    <tr>
      <td>CSS Size</td>
      <td>67.2KB</td>
      <td>6.6KB</td>
      <td style="background-color: #e6f4ea; font-weight: bold;">
        -60.6KB (🔻 90.2%) 😍
      </td>
    </tr>
  </tbody>
</table>

20kb average total download size for my majority of my blog. Any why it should be more than that? I'm simply writing. All I want is clean, simple layout, typography and some rich elements when I really need it. Anything above this is just bloat.

Now it feels more like 1999 again :)

#### Performance Analysis

The results revealed some interesting insights. Both sites performed exceptionally well in core performance metrics, with both versions achieving excellent scores in the Lighthouse performance category. Let's break down what these numbers mean:

- **Performance**: Astro scored slightly better with 99.5 vs WordPress's 99.1. Both scores are in the "Good" range (90-100), indicating excellent performance. The small difference shows that static site generators can have a slight edge over even well-optimized CMS platforms.

- **Accessibility**: WordPress scored slightly higher with 99.0 vs Astro's 97.7. The gap has significantly narrowed after recent accessibility improvements to the Astro implementation. Both are now in the "Good" range, with only a 1.3 point difference.

- **Best Practices**: Astro slightly outperformed WordPress with a perfect 100.0 vs WordPress's 99.3. Both are in the "Good" range, but Astro demonstrates slightly better adherence to web best practices.

- **SEO**: Astro significantly outperformed WordPress with a perfect 100 score compared to WordPress's 86.0. This is one of the clearest advantages of the Astro implementation and represents a substantial improvement.

- **Core Web Vitals and Speed Metrics**: Both sites performed exceptionally well in these critical metrics, but with some notable differences:

  - LCP (Largest Contentful Paint): Astro averaged 0.44s compared to WordPress's 0.81s, a 46% improvement and well under the 2.5s "Good" threshold
  - FID (First Input Delay): Both at 16ms, well under the 100ms "Good" threshold
  - TTFB (Time To First Byte): Astro was faster at 68.3ms vs WordPress's 83.1ms, a 18% improvement

- **Resource Size**: The most dramatic differences were in resource sizes:
  - HTML: Astro's HTML was 72.0% smaller (10.9KB vs 38.9KB)
  - JavaScript: Astro used 60.4% less JavaScript (5.3KB vs 13.4KB)
  - CSS: Astro used 90.2% less CSS (6.6KB vs 67.2KB)

#### Page-by-Page Performance

Here's a detailed breakdown of performance scores for each tested page:

| Page              | WP Performance | Astro Performance | WP Accessibility | Astro Accessibility | WP LCP (s) | Astro LCP (s) |
| ----------------- | -------------- | ----------------- | ---------------- | ------------------- | ---------- | ------------- |
| Homepage          | 98.0           | 100.0             | 100.0            | 98.0                | 0.90       | 0.32          |
| n8n workflows     | 99.0           | 100.0             | 98.0             | 100.0               | 0.84       | 0.26          |
| XMLHTTPRequest    | 98.0           | 100.0             | 100.0            | 100.0               | 0.86       | 0.32          |
| n8n form trigger  | 99.0           | 100.0             | 96.0             | 95.0                | 0.82       | 0.26          |
| Fastify + Vercel  | 98.0           | 100.0             | 100.0            | 97.0                | 1.05       | 0.50          |
| Automate with n8n | 100.0          | 100.0             | 98.0             | 97.0                | 0.82       | 0.27          |
| Scale at Arc XP   | 99.0           | 100.0             | 100.0            | 100.0               | 0.83       | 0.48          |
| turso + drizzle   | 100.0          | 97.0              | 100.0            | 97.0                | 0.78       | 1.09          |
| kokorojs          | 99.0           | 98.0              | 99.0             | 95.0                | 0.89       | 0.89          |
| About             | 100.0          | 100.0             | 98.0             | 96.0                | 0.53       | 0.26          |
| License           | 100.0          | 100.0             | 100.0            | 100.0               | 0.61       | 0.23          |

#### Performance by Content Type

Interestingly, certain content types showed specific patterns:

- **Simple pages** (About, License): The Astro version had faster LCP times (0.28s vs 0.40s for About; 0.26s vs 0.36s for License)
- **Code-heavy blog posts**: Astro generally outperformed WordPress (0.34s vs 0.74s for XMLHTTPRequest post)
- **Image-heavy posts**: Most posts performed better in Astro, but some posts like the turso+drizzle post (1.10s vs 0.90s LCP) and kokorojs post (0.90s vs 0.88s LCP) performed slightly better in WordPress

## What These Results Mean

The performance results provide a nuanced view of how static site generators compare to well-optimized WordPress sites. Some key insights:

### This was a Highly Optimized WordPress

It's worth emphasizing that my WordPress site was heavily statically cached at multiple levels:

- **WP Rocket**: Server-side caching plugin generating static HTML files
- **Cloudflare Edge Caching**: 1-week TTL at the CDN level

This means that during these tests, no actual PHP rendering was happening on the WordPress site. We're definitely looking at a highly optimized WordPress installation in this benchmark, which explains why the Lighthouse performance scores are identical in many cases.

1. **WordPress can still be fast with proper optimization**: My WordPress site was already highly optimized with a lightweight theme, minimal plugins, and good hosting. The identical performance scores (99.5 for both) demonstrate this clearly.

2. **Content type matters**: Simple pages and most content types showed consistent improvements in Astro, with a few exceptions for certain image-heavy posts.

3. **SEO improvements are significant**: The perfect 100 SEO scores across all Astro pages represent a meaningful improvement from WordPress's 86.0 average.

4. **Resource efficiency is dramatically better in Astro**: The most striking differences were in resource sizes, with Astro using 72.0% less HTML, 60.4% less JavaScript, and 90.2% less CSS.

## Technical Implementation Notes

For those interested in the technical aspects of the Astro implementation:

- **Built with**: Astro, MDX for content, TailwindCSS for styling
- **Hosting**: Vercel with static site generation
- **Components**: Mix of Astro and React components
- **Images**: Optimized with Astro's built-in image optimization
- **Performance features**: Route pre-fetching, deferred hydration, CSS optimization

## Conclusion

Migrating from WordPress to Astro has transformed my content workflow and delivered notable performance improvements, particularly in resource efficiency and loading speed. My WordPress site was already extremely well-optimized, which explains why both implementations achieved identical Lighthouse performance scores (99.5).

The key findings from this migration:

1. **Performance isn't just about the framework**: A well-optimized WordPress site can nearly match a static site in core Lighthouse performance metrics
2. **LCP improvements are significant**: Astro delivered a 46% faster Largest Contentful Paint on average (0.44s vs 0.81s)
3. **Resource efficiency is dramatically better**: Astro used 72.0% less HTML, 60.4% less JavaScript, and 90.2% less CSS
4. **SEO improvements**: The most significant advantage was in SEO scores, where Astro consistently achieved perfect scores compared to WordPress's 86.0 average
5. **Content-dependent results**: Nearly all page types showed LCP improvements in Astro, with only a couple of image-heavy exceptions

Let me know if you're considering a similar migration—I'm happy to share more specific insights about the process!

If you want to conduct a similar performance comparison between two sites, you can use the performance comparison script I created: [github.com/mfyz/mfyzcom_lighthouse_benchmark](https://github.com/mfyz/mfyzcom_lighthouse_benchmark).
