New Web Order · Professional services
A company website built for performance and SEO. Pre-rendered routes and per-route code make pages load 40% faster.
Category
Website
Year
2024
Industry
Professional services
Optimization
Only the needed context
How it is optimized
Only the needed context
Each route ships only the code and images it needs.
Routes are pre-rendered where content allows, JavaScript is split per route and only the above-the-fold image is prioritised. Pages load 40% faster with no layout shift from imagery, because the rendering work is done once at build time rather than on every visit.
What keeps it lean
- 01Pre-rendered once, served many times
- 02Code split per route
- 03Only the first image prioritised
Each request, user or agent gets the data it needs and nothing more.
The challenge
The company’s site loaded slowly and ranked poorly, so it lost inbound leads before a visitor ever saw the offering. It needed to be fast on the first visit, findable in search and built so that every page led somewhere.
The work
We rebuilt the site on Next.js with TypeScript and Tailwind, then worked through the performance budget: routes pre-rendered where content allows, JavaScript split per route, images served through next/image with explicit dimensions and only the above-the-fold image prioritised, and SEO metadata on every route.
Inside the product
More than one screen.
3 more screens from New Web Order, captured at device size.
Projects
The project index, rebuilt as static pages.
Services
Service pages generated from structured content.
About
The company page on the same layout system.
On the phone
Home
Projects
Services
About
How it is built
Architecture
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
Challenges & solutions
Challenge
Large marketing imagery dominated the page weight and delayed first paint.
Solution
Moved all imagery to next/image with explicit dimensions and modern formats, prioritising only the above-the-fold hero.
The impact
What became easier, better or more effective.
The rebuilt site loads 40% faster, ranks for the terms the company sells on, and puts an enquiry within one scroll on every route. Visitors see the offering before they have a chance to leave, and the rendering work is done once at build time rather than on every visit.
40%
faster page loads
Static-first rendering, route-level code splitting and optimised imagery, so the first visit is the fast one.
100%
of routes reach a call to action in one scroll
Every page moves a visitor from the offering to an enquiry without hunting.
0
layout shift from imagery
All images serve through next/image with explicit dimensions and modern formats, so nothing jumps while the page loads.
Stack
Frontend
- Next.js
- TypeScript
Styling
- TailwindCSS
Optimization
Only the needed context
Each request, user or agent gets the data it needs and nothing more.
Conscious AILet's talk
Tell us where you are. We'll say plainly what we would do next, and whether we're the right team for it.