The global travel market is shifting to online interactions where travel sites are essential for consumers. To meet growing demand, Cruise Critic (a subsidiary of Tripadvisor), needed its website to perform at a new level of scale. Cruise Critic’s engineering organization turned to Vercel to deliver high-performing web experiences at a faster pace.
Web performance for Cruise Critic is critical.
The scale of visitors that Cruise Critic sees each month meant that they needed to evaluate their application stack as well as their development workflow. Having a large existing codebase for their platform, Cruise Critic decided on an incremental approach for introducing new technology.
The company began by updating just a few pages on Cruise Critic. The stakes were high; Cruise Critic, the world’s largest cruise planning website, receives six million monthly visitors.
Making changes proved difficult for the site’s developers. Cruise Critic was held together by a tightly coupled, monolithic PHP application and this meant complex rewrites for even the smallest of changes. The team couldn’t deliver high-quality features in an iterative, agile way.
"The most valuable feature of Vercel is that our team can focus on building products rather than worrying about infrastructure."
During an internal project, the engineering team started a proof-of-concept using Next.js and Vercel. Within days, this single-page rewrite was deployed to Vercel and in production. This project proved an incremental migration path was available to modernize Cruise Critic’s technology stack while keeping legacy sites up-and-running.
Developers ran their new Next.js application alongside the legacy application and used Vercel to route traffic between the two. This gave the team the ability to see the value in their rewrite immediately. As soon as a page was completed, traffic was rerouted to the new version of the page and the existing page in the legacy application was phased out.
With Next.js and Vercel, Cruise Critic decreased their build times from 30 minutes to less than 8 minutes. Developers are now able to share components across teams, geographies and applications.
The team’s workflow has become so efficient that Cruise Critic is now able to ship to production multiple times a day. In production, Cruise Critic saw an 85% decrease in page download time and a nearly 100% decrease in page size.
By breaking apart their monolithic applications and using Next.js, developers at Cruise Critic are able to standardize UI elements with a design system and enforce visual constraints across their dozens of web properties. They can now share components across teams, geographies, and applications.
Not only are they seeing a positive impact on page performance, but Cruise Critic builds software more efficiently. The engineering team has gained confidence in their new stack thanks to increased page performance and developer experience improvements.
“Moving forward, we will continue to evaluate Next.js and Vercel as a company for future site improvement projects and opportunities.”