On this page7 sections
To compare a Framer site's speed before and after converting it to Next.js, run the same lab test on both: PageSpeed Insights or Lighthouse, same page, same device setting, more than once. When speed tests are on, Deframer does this for you on the job page. It tests your original Framer URL when the conversion starts and the converted site as soon as its live preview is ready, then shows both sides with their four category scores, LCP, FCP, TBT, CLS and Speed Index, for mobile and desktop. Read the result as a lab comparison, then measure again on your production host.
Speed rarely changes much from the conversion itself, since the project starts from the same assets, fonts and animations. The value of measuring is to find out where you stand before you start tuning.
What Deframer's speed test does
The built-in test isn't always available: speed tests may be paused, and a password-protected site isn't tested at all (neither the original nor the converted preview is sent to Google). When it's missing, run PageSpeed Insights yourself, as described under Testing it yourself.
The job page has a Speed section labelled "Lab test · via PageSpeed Insights", with a Mobile and Desktop toggle. Behind it:
- Tests are run by Google's PageSpeed Insights API, not by a browser on Deframer's servers.
- The original side tests your Framer URL when the conversion starts.
- The converted side tests the live preview of the converted project as soon as its build is ready. Until then it shows "Waits for the preview".
- Each side shows the four Lighthouse category scores (Performance, Accessibility, Best Practices, SEO), five metrics (Largest Contentful Paint, First Contentful Paint, Total Blocking Time, Cumulative Layout Shift and Speed Index), and a few failing audits.
- Run again repeats a test, within a few runs per test and an hourly limit.
The converted side is measured on the live preview, which lasts 10 minutes after it's ready, with a countdown on the page. That's why the converted test starts straight away. If the preview build fails, that side shows as unavailable rather than estimated.
How to read the comparison fairly
Lab data is a single simulated visit. PageSpeed Insights' lab section runs Lighthouse on a simulated device and network. Scores move between runs, often by several points, so compare ranges, not single numbers. Run each side more than once before drawing conclusions.
The hosts differ. The original is served by Framer's hosting and CDN. The converted side runs on Deframer's preview server, which isn't your production host. Treat the converted number as a starting point and measure again after you deploy.
The assets may be the same files. With "Include assets locally" off (the default), the converted site loads images, fonts and videos from the same Framer CDN as the original. With it on, they come from the preview server, so asset timing differs.
Look at metrics, not only the score. The Performance score is a weighted summary. LCP tells you when the main content appeared, CLS whether things jumped around, TBT how long the main thread was blocked. Google treats an LCP of 2.5 seconds or less and a CLS of 0.1 or less as good (web.dev).
Check the failing audits. They name the specific causes: an image that's too large, a render-blocking stylesheet, a third-party script.
Testing it yourself
You can run the same tests on any URL.
In the browser, open PageSpeed Insights, paste the URL and switch between Mobile and Desktop.
From the command line, Lighthouse runs locally:
# Mobile emulation is the default
npx lighthouse https://www.example.com --view
# Desktop settings
npx lighthouse https://www.example.com --preset=desktop --viewOr call the PageSpeed Insights API, which is what Deframer uses:
curl "https://www.googleapis.com/pagespeedonline/v5/runPagespeed?url=https://www.example.com&strategy=mobile"For the converted project, measure the production build, not the dev server:
npm run build
npm start
npx lighthouse http://localhost:3000 --viewnpm run dev is built for fast editing, not speed, so its numbers aren't meaningful.
A fair before and after, step by step
- Pick three pages: the home page, a content-heavy page and a CMS detail page.
- Test the Framer site for each page, mobile and desktop, three times each. Note the median.
- Convert, and if Deframer's speed section is available, read it as a first lab comparison.
- Deploy the converted project to a preview URL on your real host.
- Test the same pages on that preview URL with the same settings, three times each.
- Compare medians per metric. If something got worse, the failing audits usually say why.
- After launch, watch field data. Lab tests are for diagnosis. Real visitors' Core Web Vitals, from Search Console or the field section of PageSpeed Insights once there's enough traffic, are what count.
When the converted side is slower
Common causes and where to look:
Symptom | Likely cause | Where to look |
|---|---|---|
Worse LCP | Hero image or font loading later than on Framer | Font loading in |
Higher TBT | Third-party scripts from custom code, or heavy browser-only components | Custom code in the root layout; components loaded with |
Higher CLS | Elements without reserved space | Image dimensions, components that render only in the browser |
Every metric a little worse | The host, not the code | Measure again on your production host with caching set |
Performance tuning a converted Framer site goes through each lever in order: fonts, images, browser-only components, scripts and caching.
Where the comparison fits
When they're available, the speed test is one of the checks on the job page, alongside the compare view, where the original and converted site sit side by side at 1440, 768 and 390 pixels. Together they answer the two questions worth asking before you download: does it look right, and is it at least as fast? How to export a Framer site to Next.js covers the whole flow, and pricing lists the credit packs: the speed test and the compare view are free when they're available, and downloading the project is one credit, from $10.
Deframer is an independent tool, not affiliated with Framer or Google.
FAQ
How do I check my Framer site's PageSpeed score?
Paste your published URL into PageSpeed Insights at pagespeed.web.dev, or run npx lighthouse <url> in a terminal. Test mobile and desktop and run each more than once, since lab scores vary between runs.
Is a converted Next.js site faster than Framer?
Not automatically. It starts from the same assets, fonts and animations, so it should start close to the original. What changes is that you can then tune fonts, images, scripts and caching in code, and choose your host.
Why do my PageSpeed scores change every time I run them?
Lab tests simulate one visit on a throttled device and network, and small differences in server response and network timing move the score. Compare medians of several runs, and rely on field data from real visitors for final judgements.
What does Deframer's speed test measure?
When speed tests are on, it runs Google's PageSpeed Insights on the original Framer URL and on the converted site's live preview, for mobile and desktop, and shows the four Lighthouse category scores, LCP, FCP, TBT, CLS, Speed Index and a few failing audits for each side.