Back to Projects
Web Development2022
DEPLOYMENT STATUS: SUCCESS
LOGISTICS PLATFORM REFACTOR
Migrating a legacy SPA to Next.js for Incremental Static Regeneration, improving LCP and SEO immensely.
Lighthouse Score
99
Uptime
99.9%
Avg Latency
40ms
Status
LIVE
01
PROJECT OVERVIEW
Migrating a legacy SPA to Next.js for Incremental Static Regeneration, improving LCP and SEO immensely.
This project showcases our expertise in web development, delivering a robust solution that exceeds industry standards for performance, reliability, and maintainability.
02
THE CHALLENGE
PROBLEM
A logistics SaaS was invisible to search engines (all JS-rendered) with an 8.4s LCP, causing a 67% drop-off rate and near-zero organic acquisition.
OUTCOME
Migrated to Next.js ISR with zero downtime — LCP dropped to 1.4s, organic search impressions grew 340% in 6 months, and the bounce rate fell from 67% to 28%.
03
ARCHITECTURE & CODE
isr-route.ts
TypeScript
1// ISR: pages are static but refresh every 60s automatically2export const revalidate = 60;34export async function generateStaticParams() {5 // Pre-build the top 500 most-visited routes at deploy time6 const topRoutes = await db.routes7 .findMany({ orderBy: { visits: "desc" }, take: 500 });89 return topRoutes.map((r) => ({ slug: r.slug }));10}1112export default async function ShipmentPage({13 params,14}: {15 params: { slug: string };16}) {17 // This fetch is cached and revalidated by Next.js automatically18 const shipment = await fetchShipment(params.slug);1920 if (!shipment) notFound();21 return <ShipmentView data={shipment} />;22}04
DEPLOYMENT PIPELINE
ci/cd — deploy log
6 PASSED
1 HIGHLIGHT
BUILD COMPLETE
01▸ Running codemods (React class → hooks)...
02✓ 84 components migrated — 0 manual fixes needed
03▸ TypeScript strict mode migration...
04✓ tsc --strict — 0 errors (was 247 before refactor)
05▸ Building with Next.js ISR...
06✓ 3,200 static pages generated at build
07✓ ISR revalidation configured — stale-while-revalidate: 60s
08▸ Deploying to Vercel...
09✓ Deployment live — previous version kept for instant rollback
10✓ Lighthouse CI: Performance 99 · SEO 100 · A11y 97
11! Real-user LCP (CrUX): 1.4s — down from 8.4s (83% improvement) ✓
05
PERFORMANCE AUDIT
lighthouse — performance report
99
LIGHTHOUSE PERFORMANCE
EXCELLENT — DEPLOY APPROVED
LCP — Largest Contentful PaintTime until the largest element is rendered
1.4sGOOD
FID — First Input DelayResponsiveness to first user interaction
11msGOOD
CLS — Cumulative Layout ShiftVisual stability during page load
0.02GOOD
TTFB — Time to First ByteServer response time to first byte
130msGOOD