Engineering
Why we build client websites on Next.js (and when we don't)
The engineering reasons we build service-business websites on Next.js instead of WordPress or page builders: speed, SEO control, typed data, ownership.
By Digital GravityPublished 10 min read
What a service-business site has to do
Framework debates are mostly noise. The useful question is what the site must do, and for the businesses we work with the list is consistent:
- Carry a page for every service in every place served, each with its own content, often hundreds of pages.
- Load fast on a mid-range phone over a mobile connection, because that is where local searches happen.
- Give precise control over how every page appears to search engines and AI systems.
- Run custom features: estimators, booking, tools, integrations with the business's own systems.
- Belong to the business, in a form another competent developer could pick up.
Next.js happens to be very good at all five at once. That is the whole argument.
Pages render on the server
In the Next.js App Router, components are Server Components by default. They render on the server, and only the parts of a page that need interactivity, such as a menu or a calculator, send JavaScript to the browser. Pages that don't depend on the request are prerendered to static HTML at build time and served from a global edge network.
Two consequences matter for a business:
- Crawlers get finished HTML. The text, links and structured data are in the initial response. Nothing important waits for client-side JavaScript to run.
- Phones download less code. A long service page with a single interactive widget ships the code for that widget, not a page-builder runtime for the whole page.
SEO controls live in code
On a theme-and-plugins site, SEO settings are spread across plugin screens and per-page fields that drift out of date. In Next.js they are code, generated from the same data that renders the page, and reviewed like any other change.
| Element | How we generate it |
|---|---|
| Title and meta description | Per-page metadata, checked by script for length and uniqueness |
| Canonical URL | Set on every page from its own path; never inherited from the homepage |
| XML sitemap | Generated from the same records that create the pages, with last-modified dates taken from real content changes |
| robots.txt | Generated in code, keeping private app routes out of crawl paths |
| Structured data | JSON-LD built from the page's data, with stable identifiers for the business and site |
| Share images | Generated per page at build time, so every link preview carries the page's own title |
The share image for this article was generated that way, from the same title you see above. So was the structured data in its source, and the sitemap entry that lists it.
Hundreds of pages from typed data
Programmatic pages are where page builders struggle and Next.js shines. Each service, city and city × service combination is a typed record in TypeScript: name, local facts, the source URL for each fact, FAQs, related links. One route renders all of them, and the build fails if a record is missing a required field, which is how a missing FAQ or broken link gets caught before launch rather than after.
That is how the Pro 1 Painters site carries more than 460 pages across Mobile and Baldwin County, and how Streamlined Plumbing carries a 308-cell city × service matrix. Neither is a template with the city name swapped; the data model is what makes it practical to write each page properly. We explain the content side in programmatic local pages without thin content.
Website and software in one codebase
Because Next.js is a full application framework, the marketing site and the software can be one project. This site is the example closest to hand: the pages you are reading and the booking engine behind every “Book a call” button, with Google Calendar sync, Meet links and conflict-proof reservations, are a single Next.js application.
Client builds use the same advantage:
- Pro 1 Painters has an on-device color visualizer that recolors a homeowner's own photo with real paint choices, entirely in the browser.
- Air Solutions runs four interactive tools and a live hurricane-alert integration with the National Weather Service alongside its service pages.
None of these needed a second platform, a separate login or an iframe. They are components in the same codebase as the pages that rank.
Speed, measured honestly
Google's Core Web Vitals define a good experience as the largest content paint within 2.5 seconds, interaction responses within 200 milliseconds and cumulative layout shift of 0.1 or less, measured at the 75th percentile of real visits. Next.js makes those targets easier to hit. It does not hit them for you.
Unoptimized images, heavy third-party scripts, chat widgets and tag managers can slow any site on any framework. One month after launch, the Pro 1 Painters site measured 86 on mobile and 96 on desktop in PageSpeed Insights, taken as the median of five runs, on a site with hundreds of pages and an in-browser AI tool. That is a strong result, and we report it as measured rather than rounding it up.
Our build budget
Every page we ship is tested with Lighthouse on a mobile profile before launch, and we treat a regression in largest paint or layout shift as a bug, not a cosmetic issue.
When we don't use Next.js
We maintain WordPress sites too, and sometimes recommend staying put.
| Situation | Our usual recommendation |
|---|---|
| Many service and location pages, strong search goals | Next.js |
| Custom tools, booking, portals or integrations | Next.js |
| Existing WordPress site performing well, modest changes needed | Stay on WordPress |
| Small brochure site edited daily by a non-technical team | WordPress can be the better fit |
| Old WordPress site that is slow, fragile or hard to extend | Migrate, with a full URL and redirect map |
When we migrate, every legacy URL is mapped to a destination and redirected or kept. On the Pro 1 Painters migration, all 75 legacy URLs were kept live or 301-redirected.
What it means for the owner
Next.js is open-source software under the MIT license. A site built on it is plain code in a Git repository that any capable React developer can read, which is the opposite of lock-in. We set up the repository, hosting, domain, analytics and Search Console in the client's own accounts.
If you are weighing a rebuild, our web design and development service covers how we plan and run one, and our work shows the sites themselves. Agencies that want this stack under their own brand can read about white-label development.
Frequently asked questions
Is Next.js good for SEO?
Yes, when it is used to render pages on the server. Next.js prerenders HTML that crawlers can read without running JavaScript, and it lets developers set titles, canonicals, sitemaps, robots rules and structured data in code for every page. The framework gives you control; the SEO still has to be done well.
Is Next.js better than WordPress for a small business?
For a site that needs many service and location pages, strong performance and custom features, usually yes. For a simple brochure site that a non-technical team edits daily, WordPress can be the better fit. We build on both and recommend based on the business, not the framework.
Can I update a Next.js website myself?
It depends on how it is set up. Content that changes often can be wired to an editing workflow; layout and code live in version control. Many of our clients send changes to us under a retainer instead.
Do I have to host a Next.js site on Vercel?
No. Next.js is open-source software under the MIT license and can run on other hosts. We usually deploy to Vercel because preview deployments and global delivery work well there, with the account in the client's name.
