Why do some CSS animations jank on high refresh displays?

On 120Hz and 144Hz displays, some animations still feel stuttery. What implementation mistakes usually cause this and how do you diagnose them quickly.

Yoshiii

Usually it’s main-thread work, layout-triggering properties like top/left/width, or timing that assumes 60Hz, so I check DevTools for long frames first and move motion to transform and opacity.

.card {
  will-change: transform;
  transition: transform 180ms linear;
}
.card:hover {
  transform: translateY(-4px);
}

Ellen :smiling_face_with_sunglasses: