1. Open browser console.
  2. Open `Rendering` panel.
  3. Check `Layer borders`.

  If `will-change` is not given, the red circle is not in a separated layer. So the browser rendering the circle with other elements.
  If you want to animate the circle, you expect the browser to render the circle in a separated layer for better optimization.

  There are two ways to do that.

  1. Add `transform`.
  2. Add `will-change: transform;`.

  `will-change` is useful to do that ahead of time, before the actual `transform` happens.

  If you encounter a jank, this will be useful.

Reference: Will-Change: Micro Tip #30 - Supercharged