DEV Community

Discussion on: The useTransition react hook

Collapse
 
edriso profile image
Mohamed Idris

Simulating Slow Computation with CPU Throttling

To simulate a slow computation and see the impact on performance, you can slow down the CPU from the browser's performance tab. Here's how:

  1. Open Chrome DevTools (Right-click → Inspect → go to the "Performance" tab).
  2. In the Performance tab, click the three vertical dots (more options) on the top-right.
  3. Select "More tools""Performance insights".
  4. In the "Performance insights" panel, under Throttling, choose "CPU" and adjust the slider to slow down the CPU (e.g., make it 4x slower).

This will simulate a slower CPU, helping you see how the app performs when computations are delayed. You'll notice that without optimizations like useTransition, the app can become sluggish, but with useTransition, the UI remains responsive while background tasks are processed.