Webflow Lighthouse score: how to improve it

Webflow performance optimisation: how to improve a Lighthouse score, the Webflow settings that help, and the fonts, scripts and interactions that slow sites.

Written by: Matthew Bishop
Published: 14 October 2026
Updated: 20 October 2026
Reading time: 8 minutes

To improve a Webflow site’s Lighthouse score and overall performance, resize and compress your images, turn on Webflow’s speed settings (minify, asynchronous JavaScript and per-page CSS), upload your fonts instead of loading Google Fonts through a script, and cut third-party scripts and duplicate interactions. Those fixes target what Lighthouse weighs most: how fast the main content appears, how long scripts block the page, and whether the layout jumps while it loads.

Your Webflow site looks brilliant, but if it loads like it’s 1999, plenty of visitors won’t wait to see it. The good news is that it rarely needs a rebuild. We’ve taken Webflow sites from a Lighthouse score of 42 to 94 in under a week, with no migration: Webflow handles hosting, image versions and clean HTML for you, so most slow Webflow sites are slow because of what’s been added to them since launch.

What a slow Webflow page looks like

A Webflow landing page we audited in February 2026 is a typical case. It passed on desktop and failed on mobile, and three things stood out in Lighthouse’s report:

Fonts loaded by a script. The Google Fonts loaded through Webflow’s font settings were one of the biggest render-blocking requests on mobile.
Third-party scripts. Tracking scripts and a review widget sat alongside the fonts at the top of the list.
Duplicate interactions. The page had several versions of the same accordion and navigation animations.

Each has a fix in the steps below.

What the Lighthouse score measures

Lighthouse is Google’s free audit tool, built into Chrome and used by PageSpeed Insights. Its Performance score, from 0 to 100, is a weighted average of five measurements (Chrome for Developers):

Measurement	What it means	Weight
Total Blocking Time	How long scripts stop the page responding while it loads	30%
Largest Contentful Paint	When the biggest image or block of text appears	25%
Cumulative Layout Shift	How much the layout jumps as things load	25%
First Contentful Paint	When anything first appears	10%
Speed Index	How quickly the page fills in overall	10%

Lighthouse 10 weights, from Chrome’s scoring documentation.

Scores of 90 to 100 are good, 50 to 89 need improvement, and 0 to 49 are poor. Chrome’s own documentation says a perfect 100 is “extremely challenging” and not expected: going from 99 to 100 takes about as much improvement as going from 90 to 94.

Does the Lighthouse score affect SEO?

Not directly. Lighthouse is a lab test: one simulated visit on one device. What Google’s ranking systems reward is good Core Web Vitals for real visitors, which Search Console reports from field data (Search Console Help). Google recommends a Largest Contentful Paint within 2.5 seconds, an Interaction to Next Paint under 200 milliseconds and a Cumulative Layout Shift under 0.1 (Google Search Central).

Lighthouse is still the quickest way to find out why a page is slow. Treat the score as a diagnosis, not a ranking.

Webflow performance optimisation, step by step

The six fixes below are in the order we work through them. Each one mostly moves one part of the score:

Fix	What it mostly moves	Why
1. Speed settings	Total Blocking Time	Scripts load alongside the page instead of before it
2. Images	Largest Contentful Paint, Cumulative Layout Shift	The hero image is usually the largest element, and images without a set size push content down
3. Fonts	Largest Contentful Paint	Text can’t appear until a font script has loaded
4. Third-party scripts	Total Blocking Time	Every script competes with the page for the browser’s attention
5. Interactions	Total Blocking Time	Each interaction adds load time
6. Testing	All of them	It shows which measurement is failing, and on which pages

1. Turn on Webflow’s speed settings

Webflow has several performance settings under Site settings > Publishing > Advanced publishing options (Webflow):

Minify HTML, CSS and JS. Each can be switched on separately.
Asynchronously load JavaScript. Scripts load alongside the page instead of before it, which helps Total Blocking Time. It needs a paid plan, and custom code that depends on Webflow’s scripts may need a defer attribute or a load event to keep working.
Per page CSS. Each page loads only the styles it uses, instead of one file for the whole site. Webflow warns it can cause styling issues on sites that use a shared Library, so test it first.

Webflow already loads only the JavaScript each page needs, a change it made for every site in February 2025 (Webflow). Its site health scan also checks whether these settings are on, along with sites that use more than 1,000 classes or more than 10 web fonts (Webflow).

2. Get images right

Webflow says large images are the most common reason for slow pages (Webflow), and it matches what we see: across 47 Webflow sites we’ve tested, getting images right has consistently added 15 to 25 points to the Performance score. What to check:

Upload images in Webflow, so they get smaller responsive versions for smaller screens. Images added by CSV import or as CSS backgrounds don’t.
Size images and videos close to how they’re shown, and convert JPGs and PNGs to WebP or AVIF in the Assets panel. Webflow’s upload limit is 4 MB, and originals often aren’t close: on one rebrand the photography came in at around 10 MB an image, so we batch-exported it at the sizes the site uses.
Set the loading behaviour. Each image can load eagerly, lazily or automatically (Webflow). Don’t make the hero image wait, and don’t load a gallery further down the page eagerly.
Give images and embeds a fixed size or aspect ratio, so content below them doesn’t jump when they load.

3. Upload your fonts

When a site uses Google Fonts through Webflow’s font settings, the fonts are loaded by a script before the text can appear. On the landing page we audited, that script was one of the biggest render-blocking requests on mobile.

The fix is quick: download the font, upload only the weights you use as WOFF2 files under Site settings > Fonts, switch every style to the uploaded font, and remove the Google Font. A variable font keeps all its weights in one file (Webflow).

4. Cut third-party scripts

Tracking pixels, chat widgets, review badges, tag managers and embedded feeds all compete with the page for the browser’s attention. List every script the site loads, who owns it and whether anyone still uses it. Remove what’s unused and load the rest after the page. Tag managers need the same audit, because tags keep loading long after their campaign ends.

5. Use fewer interactions

Webflow’s guidance is that each interaction adds load time, so reuse one interaction across elements rather than duplicating it. On older sites, interactions pile up as pages are copied: the landing page we audited had several versions of the same accordion and navigation animations.

What helps:

Delete duplicate and unused interactions, components and pages.
Use CSS for simple motion, such as hover states, accordions and fades, rather than an interaction.
Keep motion smooth on phones. On one rebrand, blur effects, scroll-jacking and a complex hero animation dropped frames on mobile. We removed the scroll-jacking and kept only the key transitions.
Test a clean page. Build one page with no interactions, add your scripts back one at a time, and compare Lighthouse results. It shows quickly which additions cost the most.

6. Check the right pages, the right way

Test on mobile, which is the stricter test, and test templates as well as the home page: a CMS article, a landing page and any page with heavy embeds. We audit landing pages for speed on staging before they go live, as we did with Fresh Clinics’ landing pages. After launch, re-test after every major change and watch Search Console’s Core Web Vitals report for what real visitors experience.

Questions we get asked

What is a good Lighthouse score for a Webflow site?

90 or above is good, by Lighthouse’s own scale, and 50 to 89 needs improvement. Aim for 90 on desktop and as close as you can on mobile, which is the harder test.

Can a Webflow site score 100 on Lighthouse?

It can, but it’s rarely worth chasing. Chrome says a perfect 100 isn’t expected, and the last few points take as much work as going from 90 to 94. Aim for 90 or above. Our previous Webflow site scored 93 on mobile and 98 on desktop, with its accordions and animation built without Webflow interactions.

How do I check my Webflow site’s Lighthouse score?

Run your published page through PageSpeed Insights, or open the Lighthouse tab in Chrome DevTools. Test in a private window without extensions, run it a few times because scores vary between runs, and check mobile as well as desktop. The score is a weighted average of five measurements, with Total Blocking Time weighted most.

Is Webflow slow?

No. Webflow hosts sites on a global network, creates responsive image versions and loads only the JavaScript each page needs. Slow Webflow sites are usually slow because of large images, fonts loaded through a script, third-party scripts and too many interactions, all of which can be fixed.

If you’d like your Webflow site’s speed checked, it’s part of our SEO & AI search work, or tell us about your site. For the search settings to get right alongside speed, see our Webflow SEO guide.

This guide is part of Webflow for marketing teams, which brings together everything we’ve written on choosing, building and running a Webflow site.