Config Builder
Interactive tool to generate test.performance() configuration.
Configuration
Test Options
Enable warmup iteration
CPU throttle rate
Test iterations
Network throttling
Profiler Thresholds
Max duration (ms)
Max rerenders
Other Thresholds
Min FPS (Chromium)
Max heap growth (MB)
Max LCP (ms)
Max INP (ms)
Max CLS
Generated Code
test.performance({
thresholds: {
base: {
profiler: {
'*': { duration: 500, rerenders: 20 },
},
},
},
})('test name', async ({ page, performance }) => {
await page.goto('/');
await performance.init();
});How to Use
- Configure test options – Set warmup, throttling, iterations, and network conditions
- Set profiler thresholds – Define max duration and rerenders
- Add optional thresholds – Enable FPS, memory, or Web Vitals tracking
- Copy the generated code – Paste into your test file
Understanding the Options
Test Options
| Option | Description |
|---|---|
| Warmup | Run an excluded warmup iteration to reduce cold-start variance |
| CPU Throttle | Simulate slower CPUs (Chromium only) |
| Iterations | Run multiple times for statistical reliability |
| Network | Simulate network conditions (Chromium only) |
Profiler Thresholds
| Threshold | Description |
|---|---|
| Duration | Maximum total render time in milliseconds |
| Rerenders | Maximum number of React renders |
Optional Thresholds
| Threshold | Description | Browser |
|---|---|---|
| FPS | Minimum frames per second | Chromium |
| Heap Growth | Maximum memory growth in MB | Chromium |
| LCP | Largest Contentful Paint (ms) | All |
| INP | Interaction to Next Paint (ms) | All |
| CLS | Cumulative Layout Shift | All |
Next Steps
- Configuring Thresholds – Detailed threshold guide
- CPU & Network Throttling – Throttling deep dive
- Configuration Reference – All options