When an application is built using tools like Lovable, Bolt, Replit, v0, Cursor, or Claude Code, it often runs fine while a single developer is clicking around. According to a January 2026 r/lovable thread cited in the source material, a client app slowed down to 30-plus second page loads at around 1,000 users due to boring problems: endpoints returning every record, database calls per row, and missing pagination. AI builders excel at making interfaces work, but they rarely consider how much data, code, and uncompressed media gets sent to a stranger browsing on a mobile device.
Fixing these bottlenecks starts with measurement. According to the guide, developers should check PageSpeed Insights using the Mobile tab, set network throttling in Chrome DevTools to Fast 4G with cache disabled, and record baselines for Largest Contentful Paint, Cumulative Layout Shift, and load times before letting an AI touch forty files at once.
Heavy images are usually the primary culprit behind sluggish pages. The source recommends resizing and compressing photos into WebP format before upload, specifying explicit width and height dimensions to prevent layout shifts that hurt Cumulative Layout Shift scores, and adding loading="lazy" to elements positioned below the fold. However, developers must avoid lazy-loading the main hero image at the top of the page. Google's web.dev guidance states that the Largest Contentful Paint image should never be lazy-loaded; instead, it requires a fetchpriority="high" attribute. For projects using Supabase Storage, image transformations can be handled on the fly on Pro plans and above, while free tier users must handle resizing prior to upload.
Database queries also degrade quickly as user counts rise. Common issues include fetching every column via select('*'), retrieving unbounded row sets, and running individual queries for each item in a list. Transitioning to specific column selections, limiting responses, and leveraging foreign key relations directly in a single request—such as fetching a related customer name alongside orders—keeps payload sizes lean. Additionally, running the Performance Advisor in Supabase helps detect unindexed foreign keys and row-level security columns that trigger sequential scans instead of utilizing lookup indexes.
JavaScript bundle size is another hidden cost of single-page React applications generated by AI agents. Installing visualizers like rollup-plugin-visualizer for Vite projects helps expose oversized dependencies or duplicate libraries. Splitting top-level routes using React's built-in lazy function ensures visitors only download code for the page they are actively viewing. Finally, capturing these constraints in an AGENTS.md or project rules file prevents AI coding assistants from quietly reintroducing unoptimized code patterns in future feature updates.