Why Your AI-Built App Feels Slow
Quick answer: AI-built apps usually feel fast to the person who built them, because that person is on a powerful laptop with fast Wi-Fi and the app is already cached in their browser. Real…
Quick answer: AI-built apps usually feel fast to the person who built them, because that person is on a powerful laptop with fast Wi-Fi and the app is already cached in their browser. Real visitors arrive on mid-range phones, on mobile data, seeing the app for the first time. The common causes are oversized images, too much JavaScript loaded before anything appears, and content that jumps around while the page loads. You can measure all three with free tools, and Google publishes clear targets for what "fast enough" means.
Speed is not a cosmetic issue. A slow first page is the first thing a new visitor experiences, and many of them will leave before they ever see your product. Google also uses page experience signals as part of how it ranks pages, so a slow app can quietly cost you search traffic as well as signups.
The tricky part is that you probably can't feel the problem yourself. Your app may be slow for everyone except you.
In short: Don't judge your app's speed from your own laptop. Test it the way a stranger on a phone would see it, and measure it against Google's Core Web Vitals.
This is part 5 of our series on what vibe-coded apps miss. Start with the overview here.
What slow looks like to a real visitor
"Slow" isn't one thing. Visitors notice it in a few distinct ways:
- A blank or half-empty screen for a few seconds before the main content shows up.
- The page appears, but nothing responds. They tap a button and nothing happens for a moment, so they tap again.
- Things jump around. A banner or image loads late and pushes the text down, and they lose their place or tap the wrong button.
- Images that load in slowly, top to bottom, especially the big hero image at the top.
Each of these has a name and a number attached to it, which is useful because it turns "it feels sluggish" into something you can measure and fix.
The three numbers that matter: Core Web Vitals
Google defines three measurements, called Core Web Vitals, that capture how a page feels to load and use. Here they are in plain English, with Google's published thresholds for a "good" score.
| Metric | What it measures in plain English | Good score |
|---|---|---|
| LCP (Largest Contentful Paint) | How long until the biggest thing on screen, usually the hero image or headline, has appeared | 2.5 seconds or less |
| INP (Interaction to Next Paint) | When someone taps or clicks, how long until the page visibly responds | 200 milliseconds or less |
| CLS (Cumulative Layout Shift) | How much the page jumps around while loading | 0.1 or less |
If you only remember one: LCP is the "is it there yet?" number, INP is the "is it listening?" number, and CLS is the "stop moving!" number.
Why AI tools tend to miss this
None of this is because AI builders are bad. It's because they optimize for what you can see in the preview window, and performance problems mostly don't show up there.
The preview runs on your machine
When you build in a tool like Lovable, Bolt, or Cursor, you're previewing on a fast computer with a good connection. A page that takes one second for you can take several times longer on a budget Android phone over mobile data. The AI never sees that version of your app, and neither do you unless you go looking.
Images go in at full size
Ask an AI tool to "add a hero image" and it will often drop in whatever image you gave it, or a large stock photo, at full resolution. A photo straight from a phone or a stock site can be several megabytes. Displaying it in a box a few hundred pixels wide doesn't make the download any smaller. This is one of the most common causes of a slow LCP.
Everything ships at once
AI-generated apps tend to be built as one big JavaScript application that the browser has to download and run before showing much of anything. Each feature you add ("add a chart", "add animations", "add a date picker") often pulls in another library. Nobody goes back to ask whether the home page really needs the charting library that's only used on the dashboard.
Nothing reserves space for late content
Layout shift happens when the page doesn't know how big something will be until it arrives. Images without set dimensions, fonts that swap in late, and banners injected after load all push content around. AI tools rarely add the small details that prevent this, because the preview usually loads fast enough that the jump is invisible.
Render-blocking files
Some stylesheets and scripts tell the browser "stop and wait for me before you draw anything." A few of these are normal. A pile of them, often from fonts, analytics, and third-party widgets added one prompt at a time, can hold the whole page hostage.
Check it yourself in about 10 minutes
You don't need to read any code for this. You just need Chrome and a bit of patience.
- Open your app in a private/incognito window. This gives you a fresh visit without cached files, closer to what a first-time visitor gets.
- Run PageSpeed Insights. Go to Google's free PageSpeed Insights tool, paste your URL, and look at the mobile results first. If your site has enough real traffic, it will also show field data from actual Chrome users, which is the most honest picture you can get.
- Throttle your own browser. In Chrome, open DevTools (right-click, Inspect), go to the Network tab, and change "No throttling" to a slower preset like "Fast 4G" or "Slow 4G". Reload the page and watch how long the blank screen lasts.
- Check your biggest images. In that same Network tab, filter by "Img" and sort by size. Any single image over a few hundred kilobytes on a normal marketing page is worth questioning.
- Watch for jumps. Reload on a throttled connection and keep your eyes on the text. If it moves after you've started reading, you have a layout shift problem.
- Try it on an actual phone. Use your own phone on mobile data, not Wi-Fi, and load the app fresh. Tap a few buttons and notice whether there's a lag.
Test more than your home page. Pricing, signup, and dashboard pages are often heavier, and they're the pages where speed matters most for conversions.
How FlawPilot spots it
Running PageSpeed Insights page by page works, but it gets tedious fast, and it's easy to only ever test the home page. FlawPilot covers performance in two places.
The quick scan's Performance pillar
A FlawPilot quick scan includes a Performance pillar alongside Security, Infrastructure, and SEO. It checks page speed, Core Web Vitals, and render-blocking assets, and gives you a score for each pillar. It's a fast first look: if Performance is clearly lagging behind your other pillars, that tells you where to dig in first.
Site Health for every page
Site Health goes wider. It crawls every page of your site and scores each one for Performance, Accessibility, Best Practices, and SEO, so you can see that the home page is fine but the pricing page is dragging. A few things worth knowing when you read the report:
- Pick the right mode. Site Health runs in either Mobile or Desktop mode, and the same site can score very differently in each. Start with Mobile, since that's the harder test and where most AI-built apps struggle.
- Read findings by severity. Each page's findings are ranked as Failing, Needs improvement, or Diagnostic. Failing items are where to start. Diagnostic items give context rather than a pass or fail.
- Use the screenshots. Site Health captures screenshots of each page, which helps you connect a finding like "largest image is slow to load" to the actual thing on screen.
- "Not assessable" isn't zero. If a score can't be measured for a page, FlawPilot shows it differently from a real failing score. Treat it as "check this manually", not as a disaster.
The useful part is the comparison. Seeing every page side by side shows you whether you have one problem page or a site-wide pattern, like the same oversized image or heavy script on every route.
What "fixed" looks like
If you hand this to a developer, or ask your AI tool to fix it, here's what good results should include, so you can judge the work:
- Images are resized and compressed to roughly the size they're actually displayed at, in a modern format like WebP or AVIF. Images below the fold load lazily, meaning only when the visitor scrolls near them.
- The hero image loads first, not last, because it's usually the LCP element.
- Images and embeds have reserved space, so nothing pushes content down when it arrives.
- Code is split by page, so the home page doesn't download what only the dashboard needs.
- Unused libraries are removed, and third-party scripts like chat widgets and trackers load after the main content.
- The numbers move. Re-run the same tests on the same mode. A fix that doesn't change the scores isn't finished.
Urgent or cosmetic?
Not every performance finding needs fixing today. A rough way to prioritize:
| Situation | Priority |
|---|---|
| Home page, landing pages, or signup flow failing LCP on mobile | Urgent. This is where first impressions and conversions happen. |
| Buttons that lag on tap (poor INP) in checkout or forms | Urgent. People double-submit or give up. |
| Visible layout jumps near buttons or links | High. It causes mis-taps and looks broken. |
| A slightly heavy internal settings page | Low. Logged-in users are more patient, and fewer of them see it. |
| Small "Needs improvement" items on pages already in the green | Cosmetic. Fix when convenient. |
Frequently asked questions
Final Thoughts
AI tools are great at getting an app to look finished. What they don't do on their own is test it on the slow phone and patchy connection your real visitors are using. That gap is why so many vibe-coded apps feel fast to their builders and sluggish to everyone else.
The good news is that performance is one of the most measurable problems you'll ever deal with. Three numbers, clear targets, and free tools to check them. Test your key pages on mobile, fix the biggest images and heaviest scripts first, and re-measure until the numbers say you're done.
If you want to see every page at once instead of checking them one by one, run a FlawPilot scan and start with whatever it marks as Failing.
How FlawPilot helps
FlawPilot finds security and quality issues in your AI-built app and shows you how to fix them. It checks your deployed site across security, performance, infrastructure, and SEO, and scans your source code for vulnerabilities, hardcoded secrets, and vulnerable dependencies.
Every finding is prioritized and explained in plain English, with the actual fix: the configuration change, DNS record, security header, or code change needed. For supported findings, AI-powered guidance adds step-by-step instructions and suggested code fixes.
Connect your Git provider to scan your repository alongside your live site, so application findings, code vulnerabilities, secrets, and dependency issues all land in one place.
It fits your existing workflow too: a REST API for scores and findings, an embeddable security badge, and an MCP server so tools like Claude, Cursor, or ChatGPT can read your findings and help you work through them.
The boundaries are clear: the public website scan reads only publicly accessible signals, with no agent or credentials required, and source-code scanning is opt-in and read-only. Fixes are never applied or merged without your review.
Verify your AI-generated app is production-ready.
117 security checks in 60 seconds - free, no account needed.
Scan one page
Enter a URL - no account, no install.
Run a Site Health check
Requires a free accountCrawls every page we can reach and scores each one, so a slow template deep in the site stops hiding behind a healthy homepage.
Scan your source code
Requires a free accountConnect a Git provider to check for vulnerabilities, secrets, and risky dependencies.
