Load Testing for High-Traffic Sites on Next-Drupal
Load Testing for High-Traffic Sites on Next-Drupal
One of the great advantages of decoupled architecture is its ability to weather spikes in web traffic. With a traditional CMS, a sudden burst of traffic could overwhelm the server and paralyze your site, including the administration interface, which may only be used by a small fraction of your users. With a headless architecture, heavy traffic on the front-end can have little to no impact on the back-end.
This was a key selling point of our custom, Next.js-based, Next-Drupal solution for a large client whose website receives very high traffic. While the primary goal was to migrate their site from Drupal 7 to 10, they also took the opportunity to rebuild their site in a more robust and resilient format. We recently completed load testing of the new site to help prove it could handle the projected traffic.
Testing Methodology
Optimal load testing doesn’t mean throwing all the traffic you can at the site, but rather determining and testing for a target traffic volume. In this case, we looked at historical analytics data to determine the expected load. We then set a target that exceeded that, allowing for traffic spikes or organic growth.
Instead of immediately opening the floodgates, we staged a series of scaled tests. We began with a small test below the expected traffic level and scaled up in steps, ending with a test that exceeded our expected volume.
We used k6 on Grafana Cloud to execute the tests. The open source version of k6 made it easy to develop the load test harness locally, and then execute them at scale in cloud environments. The k6 documentation outlines three main types of tests:
- Protocol-based testing: Sends HTTP requests that bypass the UI, focusing on back-end performance.
- Browser-based testing: Simulates user behavior using a headless browser to verify front-end performance.
- Hybrid testing: A combination of both, often using protocol tests for load and browser tests for UI validation.
During our tests, we encountered reliability issues with the hybrid phase (likely due to k6 browser tests still being experimental). As a result, we ran separate protocol and browser tests.
In general, our tests followed this pattern:
- Initial ramp-up period
- Sustained peak traffic
- Ramp-down period
We also scaled both requests per second and the number of simultaneous virtual users (VUs).
Architectural Decisions
Following our load tests, we made several key architectural decisions to support the site’s traffic profile:
- Pre-rendering the top ~50 pages during Next.js builds to ensure speed while keeping build times short.
- Server-rendering on demand for less frequently accessed pages.
- Using Incremental Static Regeneration (ISR) to cache and update pages as Drupal content changes—fully supported in Next-Drupal.
- Client-side API caching with a stale-while-revalidate pattern.
- Leveraging the Drupal Subrequests module to minimize front-end API calls.
- Using a CDN for image optimization.
Lessons Learned
The test results were positive:
- We saw strong performance improvements over the legacy site.
- The Drupal admin interface remained stable during peak front-end load.
We also ran comparative tests against the legacy site, confirming the effectiveness of caching layers and CDNs. That said, many performance gains (especially in protocol tests) were measured in milliseconds for well-cached routes.
A solid back-end performance baseline gives us room to improve perceived front-end performance through techniques like client-side preloading with the Next.js Link component.
Conclusions
Based on the results, we’re confident we’ve developed an architecture that:
- Handles the site’s expected load
- Improves baseline performance
- Enables continued front-end enhancements with Next.js
We expect this to be one of our largest Next-Drupal sites to date—and we’re excited for the upcoming launch.
Looking ahead, we're eager to take advantage of further performance improvements made possible by React Server Components and the Next.js App Router, now supported in the Next.js for Drupal 2.0 beta.