A company site rebuilt on Next.js for speed and search. 40% faster, and finally ranking.
The problem
The existing site loaded slowly and ranked poorly, costing the company inbound leads before visitors ever saw the offering.
My approach
Rebuilt the site on Next.js with TypeScript for type safety and Tailwind for styling, then worked through the performance budget: code splitting, image optimisation and tuned rendering strategies per route.
How it's built
Static-first Next.js App Router build. Routes are pre-rendered where content allows, images are served through next/image with explicit dimensions, and JavaScript is code-split per route to keep the initial payload small.
Key features
- Static-first rendering for fast first paint
- Route-level code splitting
- Optimised, layout-shift-free imagery
- SEO metadata across all routes
- Fully responsive layout
Challenges & Solutions
Large marketing imagery dominated the page weight and delayed first paint.
Moved all imagery to next/image with explicit dimensions and modern formats, prioritising only the above-the-fold hero.
Results
- 40%faster through targeted performance work.
- 100%of routes reaching their call to action in one scroll.
Implementation stack
Tech Stack
Frontend
- Next.js
- TypeScript
Styling
- TailwindCSS