How to build a fast website in Kenya (Next.js, M-Pesa, Core Web Vitals)

A fast website in Kenya is not the same as a fast website in San Francisco. The median device on Safaricom 4G is a mid-range Android phone with 3 GB of RAM, a network that drops to 3G in half of Nairobi, and a screen the user is checking on the matatu home. The Lighthouse score that lights up green on your MacBook over fibre is meaningless if your customer can't use the site by Westlands traffic.

We have shipped a few dozen sites for Kenyan clients — e-commerce, marketing, lead-gen, agency-of-record retainers — and the recipe has converged. This post is the playbook.

The targets that actually matter

Core Web Vitals are good because they are the only performance metrics Google ranks on. They are also a useful proxy for user perception. Aim for:

• Largest Contentful Paint (LCP) under 2.5s on a throttled 3G Moto G4 (Chrome DevTools throttling preset). This is non-negotiable for Kenya.
• Interaction to Next Paint (INP) under 200ms. Kenya's mid-range Androids choke on heavy JS — this means React Server Components by default, client components only where state is needed.
• Cumulative Layout Shift (CLS) under 0.1. Reserve image dimensions, avoid late-loading fonts, never inject ads above the fold.

Why we default to Next.js (and Vercel)

Next.js 16's App Router gives you React Server Components for free. RSC means your components render on the server and ship zero JavaScript to the browser by default — the opposite of the old SPA model. For a marketing site this is huge: a homepage hero, services grid, and footer can all be RSC, with only the navigation burger needing a client island.

Vercel's edge network has a Cape Town point of presence and a Lagos one — both much closer to your Kenyan visitor than us-east-1. Cloudflare Pages is a cheaper alternative with similar reach. Either way, your TTFB stays under 200ms from Nairobi.

The image rules

• Use next/image for every photo. It serves AVIF or WebP, generates the right size, and lazy-loads everything below the fold.
• Hero images: under 100 KB.If your designer hands you a 4 MB screenshot, compress and crop until it's under 100 KB. The product photo on Jumia is 18 KB; you can match that.
• SVG illustrations beat PNG every time. If the design is a flat illustration, ship the SVG. We use this aggressively in our own work — every gradient in our marketing site is CSS, not an image.

Fonts

Use next/font. It self-hosts Google Fonts at build time (so no third-party request, no FOUT, no PII to Google). Subset to latin only — you do not need the Cyrillic glyphs of Inter on a Kenyan site. Limit to 2 families and 2–3 weights.

M-Pesa integration without breaking performance

Most Kenyan e-commerce sites add an M-Pesa STK-push button on the checkout page, and most do it badly — by loading a third-party JavaScript SDK that adds 200 KB to the bundle. The right way: do the M-Pesa Daraja call server-side.

Your client posts the order to a Next.js API route. The route calls Daraja (server-to-server, no SDK), gets back a CheckoutRequestID, and returns it. The client polls a second route every 2 seconds for status. The bundle stays clean, the user gets the STK push on their phone, and you can fall back to Pesapal or Flutterwave if Daraja is down — all server-side, no extra JS.

What to skip

• jQuery, Bootstrap, big icon fonts. Use Lucide React or your own SVG set — tree-shaken, small.
• Carousels. They tank LCP and nobody clicks past the first slide. Pick one hero image and trust it.
• Live chat widgets that load on every page. Lazy-load them after first paint, or use a click-to-load pattern.
• Analytics as a render-blocking script. Use Plausible (1 KB) or GA4 with strategy="afterInteractive" on the script.

Measure on real devices

Lighthouse in Chrome is a good start. Real measurement is Search Console > Core Web Vitals (which shows your real users) and PageSpeed Insights (which runs from a Google data centre but on a throttled mobile profile). Add a real-user monitoring tool — Vercel Analytics, Plausible, or Cloudflare Web Analytics — so you catch regressions before customers complain.

The 90-minute test

Once a quarter, do this:

1. Open your site on your actual mid-range Android phone (not your iPhone).
2. Switch to mobile data, not Wi-Fi.
3. Walk to a location with 1 bar of signal — Kileleshwa basement, an Uhuru Highway underpass, anywhere outside CBD.
4. Try to complete a purchase or fill a contact form.

If anything is broken, you found your roadmap. If everything works, ship.

We build sites this way because it is the only way that survives a Kenyan customer. If you want help, our website service page has scope and pricing — or email hello@thenodenest.com.