Any information contained on this Website is not legal advice and should not be treated as such. You should always contact an attorney for help with your specific legal needs and issues. We may also earn a commission when you click links to our partners and purchase goods or services. For more information, read our Disclaimers Policy.
Webflow handles a lot of performance work automatically — global CDN delivery, SSL, lazy loading, and code minification are all on by default. Most Webflow sites start in decent shape without any manual optimisation.
But decent isn't always good enough. The gap between a 75 and a 95 PageSpeed score usually comes down to a handful of specific decisions: how you handle images before uploading, which third-party scripts you're loading, and two Advanced Publishing settings that are off by default and make a meaningful difference.
This guide covers what actually moves the needle — including Webflow-specific tools most people never use.
Start with Webflow’s built-in tools
Before reaching for third-party auditing tools, run these first — they’re built into Webflow and specific to your site.
Site Health Scan
Webflow’s Site Health Scan checks your site for common hosting, performance, SEO, and optimisation issues. You get a score out of 100, an AI-generated summary, and step-by-step recommendations. Run it from the Webflow Support Portal — it takes a few seconds and is a good first step before digging into PageSpeed Insights.
One caveat from the docs: improving your health score doesn’t guarantee better performance, since factors like page weight, image optimisation, and custom code aren’t fully captured by the scan. Use it as a starting point, not a final verdict.
Two Advanced Publishing settings worth enabling
Find these under Site settings → Publishing → Advanced publishing options (or the publishing dropdown in the Designer). Both are off by default.
- Asynchronously load JavaScript — by default, Webflow loads JS files synchronously, one at a time, before rendering page content. This delays how quickly your page becomes visible. Toggling this on loads JS files in parallel with page rendering, which can meaningfully improve perceived load time and performance metrics. Requires a paid Site or Workspace plan. Important caveat: custom JS that relies on synchronous loading order may not run as expected — test after enabling.
- Per page CSS — strips styles that aren’t used on a given page, reducing the CSS payload the browser needs to load. Useful on larger sites with lots of global styles. Has caveats if you use custom CSS or shared Libraries — test carefully and disable on Library consumer sites if you see issues.
Image conversion tool
Webflow’s built-in image conversion tool converts existing assets to WebP directly from the Assets panel — no need to re-upload. One important caveat: responsive images are automatically generated for inline images, but not for background images or images inside rich text elements. Those need to be handled manually before uploading.
Understanding and Measuring Website Performance
Webflow performance is the complete picture of how your site delivers content, responds to user input, and maintains visual stability. It encompasses loading speed, responsiveness, and reliability across all devices. When these elements work together, the user experience feels effortless.
A slow or clunky website drives users away and hurts your search engine rankings, as Google uses performance signals to determine visibility. You can’t improve what you don’t measure, so understanding key metrics is the first step.
What are Core Web Vitals?
Google’s Core Web Vitals measure the actual user experience on your site, making them critical for SEO and user satisfaction.
- Largest Contentful Paint (LCP) measures how quickly the main content (e.g., hero image or headline) appears. Aim for 2.5 seconds or less.
- Interaction to Next Paint (INP) captures responsiveness to clicks and other interactions. The target is 200 milliseconds or less.
- Cumulative Layout Shift (CLS) tracks visual stability, preventing content from jumping during load. Your CLS score should be below 0.1.
These metrics are crucial Google ranking signals. Supporting metrics like Time to First Byte (TTFB) and First Contentful Paint (FCP) help diagnose underlying issues. For more on how Webflow affects search presence, see our guide: Is Webflow Good for SEO?
How to Test Your Webflow Site’s Speed
Regularly testing your site’s performance is essential. You can start with free, powerful tools.
- Google PageSpeed Insights provides a comprehensive report on mobile and desktop performance using real-world user data.
- Lighthouse, available in Chrome’s developer tools (F12), audits performance, accessibility, SEO, and best practices.
- GTmetrix and Pingdom offer alternative views with waterfall charts that visualise the loading sequence of every page element, helping you spot bottlenecks like large images or slow scripts.
Always test both mobile and desktop performance, as mobile traffic is dominant and often reveals different issues. Focus on the “Opportunities” and “Diagnostics” in these reports, which provide actionable fixes.
Core Optimisation Techniques for Webflow
This section covers the most impactful changes you can make in Webflow to transform a sluggish website into a fast one.
Optimising Images
Images are often the biggest speed killers. Use an image compression tool like TinyPNG before uploading to reduce file sizes by 60–80% without visible quality loss. Then use Webflow’s built-in conversion tool to convert to WebP in the Assets panel.
Remember: Webflow auto-generates responsive image sizes for inline images, but not for background images or rich text images — handle those manually.
Managing Scripts and Third-Party Code
Every third-party script — analytics tools, chat widgets, social embeds — adds load time. Webflow’s own documentation is direct about this: third-party integrations can be poorly written, poorly maintained, and even unsupported. Audit what’s running on your site and remove anything you’re not actively using.
For scripts you do need, load them asynchronously where possible. Enable Asynchronously load JavaScript in Advanced Publishing options (see above) and test that everything still works as expected.
Fonts and Interactions
Webflow’s Site Health Scan flags sites using more than 10 webfonts as a performance concern. Keep your font stack lean — two or three weights from a single family is usually enough. Use system fonts for body copy where the design allows.
Interactions add load time too. Webflow’s docs recommend using transitions and interactions sparingly, only where they genuinely enhance the experience, and selecting only the specific CSS properties you want to transition rather than animating “all properties”.
Webflow’s Built-in Performance Architecture
Understanding what Webflow does automatically helps you focus your effort on what it doesn’t handle for you.
Global CDN and Hosting
Webflow hosts all sites on AWS with a global CDN. Content is served from whichever edge location is closest to the visitor, which means fast Time to First Byte regardless of where your audience is located. This is included at every hosting tier — you don’t need to configure it.
Browser Caching
Webflow sets cache headers automatically on static assets. You don’t need to configure this manually. Where caching gets complicated is with third-party scripts — those are served from external domains and follow whatever cache policy the third party sets, which is often short or non-existent.
Video Content
Never self-host video on Webflow. Upload to YouTube, Vimeo, or Cloudflare Stream and embed. Self-hosted video consumes bandwidth rapidly, is subject to your plan’s bandwidth limits, and will be significantly slower to load than a CDN-hosted video embed.
Common Pitfalls
- Unused styles: Sites with many unused styles slow down the Designer and can affect published performance. Clean up unused classes regularly — Webflow’s Style panel shows when a class has no elements using it.
- Heavy interactions on scroll: Scroll-triggered animations that affect many elements are a common culprit for poor CLS and INP scores. Test with Lighthouse after adding any complex interaction.
- Not testing on mobile: Desktop scores often look fine while mobile scores suffer. Always run PageSpeed on both.
- Forgetting to publish after enabling settings: Both Async JS and Per Page CSS require you to save and publish before they take effect on your live site.
Conclusion
Webflow’s defaults are strong — most sites launch in reasonable shape without any manual performance work. The meaningful gains come from a short checklist: enable Async JS and Per Page CSS in Advanced Publishing options, compress and convert images before uploading, audit your third-party scripts, and run the Site Health Scan to catch anything you’ve missed.
None of this requires a developer. It’s a half-hour audit that most sites would benefit from.
A fast site is only half the equation
Speed gets visitors onto your pages. What happens next determines whether they contact you. If your Webflow site is getting traffic but not converting it into enquiries or revenue, Next Day Sales provides tools built specifically to close that gap — designed to work within the Webflow stack.
