Why Your Webflow Site Scores 30 on PageSpeed

Webflow Is Great — Until It's Not

Let me be clear upfront: Webflow is a fantastic tool. For non-technical founders who need a website up fast, it's one of the best options available. The visual builder is intuitive, the hosting is solid, and you can go from zero to launched in days.

But here's what nobody tells you: most Webflow sites score between 25 and 45 on Google PageSpeed Insights on mobile.

That's not a Webflow-specific problem per se — it's a problem with how most Webflow sites end up being built. And it matters because Google uses this score to determine your search rankings, and users use load time (consciously or not) to decide whether to trust your product.

If you've checked your Webflow site's PageSpeed score and felt a pit in your stomach, this article explains why it happened and what your options are.

Why Webflow Sites Tend to Be Slow

1. The Generated Code Is Bloated

Webflow generates clean-ish HTML and CSS, but it's not optimized code. The visual editor creates CSS classes for every element, resulting in stylesheets that are much larger than hand-written code would produce.

A typical Webflow landing page ships 200-400KB of CSS. A hand-coded equivalent typically needs 15-40KB. That's 5-10x more CSS than necessary.

2. JavaScript Overhead

Webflow loads its own runtime JavaScript for interactions, animations, and form handling. Even if you're not using complex interactions, this JavaScript still loads. Add Webflow's analytics, any custom code you've embedded, and third-party integrations, and you're looking at 300-600KB+ of JavaScript on a simple landing page.

3. Image Handling Is Basic

While Webflow does offer responsive images, it doesn't automatically convert to modern formats like WebP or AVIF. Many Webflow sites serve full-resolution PNGs or JPGs to mobile devices. A single unoptimized hero image can add 2-4 seconds to your load time.

4. No Code Splitting

In a custom-coded site, each page only loads the JavaScript it needs. In Webflow, the same bundle loads on every page. Your pricing page loads animation JavaScript even if it has no animations. Your blog post loads form-handling code even though there's no form.

5. Limited Control Over Loading Strategy

You can't lazy-load specific sections. You can't inline critical CSS. You can't defer specific scripts. You can't preload your LCP element. These are all standard performance techniques that are impossible or extremely hacky in Webflow.

6. Third-Party Script Accumulation

Because Webflow makes it easy to paste code snippets into the custom code section, many Webflow sites accumulate scripts over time: analytics, heatmaps, chat widgets, pixel trackers, CRM integrations. Each one adds load time, and there's no built-in way to manage them efficiently.

What You Can Fix Within Webflow

Before considering a migration, try these optimizations:

Image Optimization

• Manually compress every image before uploading using Squoosh or TinyPNG
• Use Webflow's responsive image settings to serve smaller images on mobile
• Remove decorative images that aren't essential
• Add explicit width and height in the designer

Script Cleanup

• Audit your custom code sections (head and body)
• Remove any scripts you're not actively using
• Check if you really need that chat widget on every page
• Consolidate analytics tools (you probably don't need both Google Analytics and Hotjar and Mixpanel)

Reduce Animations

• Every Webflow interaction adds JavaScript complexity
• Remove animations that don't directly serve conversions
• Disable animations on mobile if possible

Font Optimization

• Limit yourself to 2 font families maximum
• Use only the weights you actually need (don't load 6 weights of Inter)
• Use Webflow's font-display swap setting

Enable Webflow's Built-in Optimizations

• Enable Minify CSS and JS in project settings
• Enable lazy loading for images in the designer
• Use Webflow's CDN (it's automatic with Webflow hosting)

When to Stay on Webflow

Webflow is still the right choice if:

• You're pre-product-market-fit and iterating on messaging weekly
• You don't have budget for custom development yet
• Your site is a simple brochure site (not your core SaaS product)
• Your traffic is low enough that a 30 PageSpeed score doesn't materially affect you
• You have a non-technical marketing team that needs to make frequent content changes

When to Leave Webflow

It's time to consider custom code when:

• Your PageSpeed score is below 50 and you've already done the optimizations above
• You're investing in SEO and need Google to rank you competitively
• Your conversion rate matters — you're spending money on ads and need every visitor to count
• You've outgrown the design limitations — Webflow's grid and flexbox constraints are holding back your vision
• You need complex interactivity — filtering, dynamic data, user dashboards, authentication
• Your site is your product — if the frontend IS the product (not just marketing), you need custom code

What a Migration Looks Like

Moving from Webflow to custom code doesn't mean starting from scratch. Here's the typical process:

1. Audit — Identify what's slow, what's essential, and what can be cut
2. Design transfer — Your existing design is recreated in code, often pixel-for-pixel
3. Performance optimization — Every element is built with speed in mind from day one
4. Content migration — Your text, images, and structure carry over
5. Launch and verify — Deploy, run PageSpeed tests, confirm the improvement

A typical Webflow-to-custom migration takes 10-14 days and results in a PageSpeed score improvement from 25-45 to 90+.

The cost is a one-time investment that typically pays for itself within 2-3 months through better rankings, lower bounce rates, and higher conversions.

I rebuild slow Webflow sites into fast, custom-coded frontends. If this sounds like your situation, check out my Performance Rebuild package or book a free call to talk it through.

FAQ

Can Webflow ever score 90+ on PageSpeed?

In theory, yes — for extremely simple pages with no interactions, minimal images, and no third-party scripts. In practice, most real-world Webflow sites with the features founders need will max out around 50-65 on mobile.

How much does it cost to migrate from Webflow to custom code?

For a typical SaaS landing page, a full migration and performance rebuild runs $3,000-$5,000. This includes design recreation, performance optimization, SEO preservation, and deployment.

Will I lose my SEO when migrating?

Not if done correctly. Proper migration includes URL mapping, redirect setup, and preserving all your existing meta tags, headings, and content structure. You should actually gain SEO value from the improved Core Web Vitals.