How we hit 95+ Lighthouse scores on a data-heavy automotive marketplace — Next.js ISR, Stripe payments, and SEO-ranking individual vehicle pages at scale.
The Problem with Automotive E-Commerce and SEO
Slyde Over is a full-stack automotive marketplace where dealers list vehicles and buyers browse, filter, and purchase. The SEO challenge is unique to this vertical: every vehicle listing is a potential organic search landing page ('2021 Toyota Camry for sale Los Angeles'), but vehicle inventory turns over weekly. Static generation at build time would mean stale listings. Server-side rendering would kill performance. The solution was Next.js Incremental Static Regeneration — each vehicle page regenerates in the background every 60 seconds, giving you the SEO benefits of a static page with near-real-time inventory accuracy.
ISR in Practice: Stale-While-Revalidate for Vehicle Pages
With ISR, the first user to visit a vehicle page after the 60-second window triggers a background regeneration. The user sees the cached page instantly — no loading spinner — while the new version is being built. If a vehicle sells during that window, the next regeneration marks it as sold and removes it from search results. We added a client-side freshness check using SWR that polls the vehicle status API every 30 seconds and shows a 'This vehicle has sold' banner in real time if status changes before the next ISR cycle. This combination — ISR for SEO performance plus SWR for real-time accuracy — is the pattern we now use on all inventory-heavy marketplaces.
Stripe Connect: Multi-Dealer Payment Routing
Unlike a single-vendor store, a marketplace needs to split payments between the platform and multiple dealers. We used Stripe Connect with the platform acting as the Connect account orchestrator. Each dealer onboards through a Stripe hosted Express onboarding flow, which handles KYC and bank account verification. When a purchase completes, Stripe's `transfer_data.destination` parameter routes the dealer's cut automatically. We also implemented Stripe's automatic tax calculation for California sales tax, which varies by county and vehicle type — something that would have taken weeks to build manually. The entire payment infrastructure took eight days to implement and has processed zero chargebacks in its first six months.
95+ Lighthouse: How We Actually Got There
Hitting 95+ Lighthouse on a marketplace with 40+ vehicle images per listing required five specific optimizations. First, all images use Next.js `<Image>` with priority loading only for above-the-fold images. Second, vehicle gallery images are lazy-loaded and use WebP format with a JPEG fallback. Third, fonts are self-hosted — no Google Fonts render-blocking requests. Fourth, Stripe's JavaScript is loaded only on checkout pages using Next.js dynamic imports. Fifth, all third-party scripts (analytics, chat widget) use the `strategy='lazyOnload'` prop from `next/script`. The result is a 4G median FCP of 1.1 seconds on vehicle listing pages — fast enough that Google's Core Web Vitals consistently grades us green.
“ISR for SEO performance plus SWR for real-time accuracy — this is now our standard pattern for every inventory-heavy marketplace.”
Leave a Comment