All writing

GSAP + React StrictMode: a survival guide

Why your fromTo animations trap elements at opacity 0 in dev, and how gsap.context() saves the day.

StrictMode double-invokes effects in dev. If your effect does gsap.from(el, ...) with a delay, the first mount sets the initial state, the second mount captures that initial state as the 'natural' state, and the element gets stuck at opacity 0 forever.

Two fixes: switch to gsap.fromTo() with immediateRender: true and overwrite: 'auto', and wrap every tween inside a gsap.context() so ctx.revert() undoes the previous mount before the next one runs.

The context() pattern also cleans up ScrollTriggers automatically, which is worth the price of admission by itself.