Un assouplissement de Bézier cubique décrit comment une valeur se déplace du début à la fin sur une durée fixe, par exemple 300 millisecondes avec un assouplissement. Il est prévisible et pris en charge partout, y compris le simple CSS.
Un ressort décrit plutôt un système physique. Vous définissez la rigidité, l'amortissement et la masse, et la valeur se déplace vers sa cible comme le ferait un poids sur un ressort, avec ou sans dépassement. La durée vient de la physique.
La différence pratique est l’interruption. Si un utilisateur appuie à nouveau pendant l'ouverture d'un panneau, une animation de Bézier redémarre généralement à partir de la position actuelle avec une vitesse nulle, ce qui ressemble à un accroc. Un ressort démarre à partir de la position et de la vitesse actuelles, de sorte que le mouvement se courbe en douceur vers la nouvelle cible. Il en va de même lorsqu'un utilisateur lance une carte ou une feuille d'un geste : le ressort se poursuit à la vitesse du doigt.
Les ressorts semblent également naturels avec moins de décisions : un ou deux réglages donnent une sensation cohérente sur des éléments de différentes tailles.
Béziers a encore une place. Pour une opacité, une couleur et des transitions qui ne sont jamais interrompues, une courte transition est plus simple et fonctionne dans CSS sans JavaScript. De nombreuses équipes utilisent des ressorts pour le mouvement et des béziers pour les fondus.