
I got my React SPA to 95/100/100/100 on mobile PageSpeed
81/93/92/92 → 95/100/100/100. Mobile, simulated slow 4G. Here's everything I did, including the stuff that backfired. The site is SudoRank - React 19, TanStack Router, Tailwind 4, running on Cloudflare Pages with 523 prerendered pages. Before: 81/93/92/92 - single 313 KiB gzip bundle, zero code splitting, Google Fonts from CDN, Clarity and GA loading eagerly. Basically every mistake you can make. Fonts Google Fonts means three origin connections on slow 4G. Tried @fontsource-variable packages first - score tanked 81 → 67, fonts got bundled into JS. Downloaded the .woff2 files instead, @font-face with font-display: swap in public/fonts/ . Analytics Wrapped Clarity + GA in a setTimeout(fn, 3500) . Page is rendered by then. GA still picks up the pageview, Clarity replays from initialization. Also tried font preloads here - score went 77 → 74. Preloads fought the JS bundle for bandwidth on 1.6 Mbps. Code splitting TanStack Router has built-in code splitting. I hadn't turned it on. 22 route
Continue reading on Dev.to React
Opens in a new tab

