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
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 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.

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 them 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.
Compress videos as well. Background and carousel videos are often the heaviest files on a page, so export them at the size they’re shown.
Set the loading behaviour. Each image can load eagerly, lazily or automatically (Webflow). The hero image is usually the Largest Contentful Paint, so don’t make it wait, but don’t load a whole gallery further down the page eagerly either.
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 Webflow landing page we audited in February 2026, Lighthouse flagged that font script as 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, and Total Blocking Time carries the most weight in the score.

List every script the site loads, who owns it and whether anyone still uses it. Remove what’s unused, load what’s left after the page, and test key pages with and without chat. Tag managers need the same audit: tags pile up and keep loading long after their campaign ends, so ask whoever owns the container to remove the ones nobody uses. On the page we audited, tracking scripts and a review widget sat alongside the fonts at the top of Lighthouse’s list.

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. It’s the stricter test, and it’s where the landing page we audited failed while desktop passed.
Test templates, not just the home page: a CMS article, a landing page and any page with heavy embeds.
Check landing pages before they go live. We audit each one for speed on staging before launch, as we did with Fresh Clinics’ landing pages.
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. A perfect 100 isn’t expected: Chrome says it takes as much work to go from 99 to 100 as from 90 to 94.

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 is the Lighthouse score calculated?

It’s a weighted average of five measurements: Total Blocking Time (30%), Largest Contentful Paint (25%), Cumulative Layout Shift (25%), First Contentful Paint (10%) and Speed Index (10%). Each is scored against real-world website data, then combined into one score from 0 to 100.

How do I check my Lighthouse score?

Run your page through PageSpeed Insights, or open Chrome DevTools, choose the Lighthouse tab and run a report. Test in a private window without extensions, run it a few times because scores vary between runs, and check mobile as well as desktop.

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.