← All posts

Next.js 16 instead of WordPress: a Morocco store on mobile 4G

TripleW’s case: a 5,000-SKU catalog moved from WooCommerce to Next.js 16 — LCP from 3.8s to 680ms and CMI payments without PHP timeouts.

Next.js 16 instead of WordPress: a Morocco store on mobile 4G
Contents

In brief

On Dev.to, TripleW describes moving a high-traffic Morocco store from WordPress/WooCommerce to Next.js 16 (Turbopack, App Router) and a cloud edge setup. Over 78% of local online payments happen on mobile 4G/3G, while a typical theme with dozens of plugins paints first content in 3.5–5.2s. After migrating a 5,000-SKU catalog, LCP fell from 3840ms to 680ms and INP from 240ms to 28ms.

What happened

Picture a courier on Casablanca’s narrow streets handed a truck with thirty-five plugin crates in tow: by the time he turns at the doorway, the shopper has closed the tab. The authors say agencies in the region still ship monolithic WooCommerce themes by habit, while the buyer arrives from Instagram on an unstable mobile link. Every 100ms of delay toward the cart hits conversion: around 1s LCP average conversion sits near 3.2%, at 3.5s it drops under 1.1%, and past 5s more than half of mobile visits leave before the hero image.

The benchmark compared the same 5,000-item catalog: monolithic WordPress versus Next.js 16 with static generation via generateStaticParams and incremental cache invalidation on a cloud edge. LCP: 3840ms → 680ms (−82%). INP: 240ms → 28ms (−88%). CLS: 0.18 → 0.00. TTFB: 850ms → 45ms. The attack surface shrank: instead of a zoo of PHP plugins — a custom interface without a page builder.

A separate knot is local CMI card processing. On the old stack, webhook confirmations failed on PHP execution timeouts, clunky redirects dropped mobile users during 3D-Secure 2.0, and the WhatsApp fallback for cash on delivery was wired by hand. With Next.js API route handlers and server actions, confirmation with cryptographic signature checks lands in milliseconds; the authors link a separate integration guide.

Why it matters

In markets where mobile is not a second screen but the main path to money, first paint and interaction delay are not vanity metrics — they are a direct revenue lever. The case is useful not as a slogan to “ditch WordPress,” but as a pairing: static pages and the edge instead of heavy PHP for every catalog URL, plus a payment path that does not die on monolith timeouts.

The numbers belong to one bench and one team — they are not a guarantee for every store. Still, the order of magnitude explains why agencies in similar conditions increasingly feel cramped inside a theme with dozens of plugins when half the audience is already gone before the hero.

In practice

This is a TripleW field case, not a universal migration recipe. Worth checking your own LCP/INP on real 4G and counting how many carts you lose at the same thresholds their mobile speed-loss calculator uses.

If your conditions are close:

  1. Measure the mobile path from ad to cart first, not only a laboratory Lighthouse run on cable.
  2. For the catalog, evaluate pre-render and incremental cache instead of building the full page on every request.
  3. Move payments and webhooks out of fragile PHP timeouts into explicit server handlers with signature checks.
  4. Cut plugin debt: a custom interface beats a page builder when the bundle already chokes INP.
  5. Keep structured data (JSON-LD) and readiness for model-based search in view — the authors put that next to mobile speed.

Takeaway

On Morocco’s mobile market a “fast store” is not a framework logo swap — it is a lighter courier instead of an overloaded plugin truck. Next.js 16 at TripleW showed how far LCP and INP can fall and how CMI fits when payment confirmation no longer hits a PHP timeout. For similar conditions, start with a 4G measurement and one hot payment path, not a slogan to move everyone onto the App Router overnight.

Comments

Loading comments…