App Router migration boosts Whop's real-world performance metrics

Whop, an online marketplace for digital products, has reported significant performance gains after moving its frontend from a Ruby on Rails monolith to Next.js and incrementally adopting the App Router. The company's Real Experience Score (RES) jumped from the 30s to the high 90s, while the percentage of URLs passing Core Web Vitals checks rose from 13% to 47%.

From Rails monolith to a split frontend

Whop's migration began with a desire to speed up development while improving SEO and performance. The team evaluated React for its developer experience and settled on Next.js, citing its SEO focus and support for Incremental Static Regeneration (ISR). ISR lets specific pages update as needed while retaining the load speeds of statically generated sites.

The architecture was split: Next.js handles the frontend while the existing Rails API serves as the backend. This initial migration took three months and shipped as a single release.

Incremental adoption of the App Router

Whop started with the Pages Router and still uses it for parts of the application. To introduce the App Router gradually, the team used Edge Middleware to route traffic between the new App Router project and the existing pages project on whop.com. This allowed them to roll out significant changes incrementally without breaking legacy components.

The move to App Router was driven by a focus on developer experience, particularly support for React Server Components. Being able to fetch and mutate data directly alongside JSX code means less overall code and a central location for managing and rendering data. The team reports that Next.js now feels like a full-stack framework rather than just a frontend framework, with reusable patterns and no need to know a backend language.

"At Whop, our mission is to make everyone an internet entrepreneur. To match the pace of the ever-evolving web, we are successfully leveraging the Vercel ecosystem, including Next.js and Vercel, to build software incredibly quickly, leading to rapid growth."

Tristan Pfannschmidt, Head of Frontend at Whop

Measured improvements

The transition yielded measurable results across several performance indicators:

  • Real Experience Score increased from the 30s to the high 90s. Unlike Lighthouse scores, RES is generated from real data collected from users' devices, providing an authentic view of actual user experiences.
  • Good URLs—URLs showing good Core Web Vitals—improved from 13% to 47%.
  • Cumulative Layout Shift decreased and Core Web Vitals improved overall.

The results demonstrate the impact of combining Next.js and Vercel's tooling with a deliberate, incremental migration strategy. Whop's path from a monolithic Ruby on Rails application to a Next.js frontend with App Router integration highlights how modern open-source web development tools can support both developer velocity and end-user experience.