克制是个技术指标

“动效要克制”这句话，如果只当成审美偏好，最后一定会失控——因为每个人对“克制”的阈值不一样，而写代码的人永远觉得再多一点会更帅。

所以我把它拆成了几条能验证的规则。

三条硬线

第一条，只动 transform 和 opacity。这两个属性能被合成器单独处理，不触发重排重绘。凡是要动 width、top、margin 的，换成 scale 和 translate 重写。

第二条，动画必须被门控。元素离开视口时不该在后台空转。IntersectionObserver 负责这件事。

第三条，时长上限 800ms。超过这个数，用户就开始等它了。等待感一旦出现，优雅就没了。

呼吸感从哪来

真正让人觉得“舒服”的，往往不是动画本身，是节奏差。

全站所有淡入如果都是 0.7 秒，看起来会很机械。所以我给列表项加了一点递进延迟——第一项 50ms，第二项 140ms，往后每项加 90ms 左右。差值不大，但视线扫过去的时候，会感到一种依次落下的次序。

这就是“呼吸”。它不是某个特效，是一组时间差。

不做什么

明确不做的清单反而更重要：

• 全屏粒子和 WebGL 背景——这类东西的注意力份额太大，会盖过文字
• 自定义光标——把系统光标换掉，是在跟用户的手感作对
• 首屏长预加载——进门先让人等，是花钱买差评

写下来之后我发现，这份“不做”的清单比“要做”的清单更长。这可能就是克制本来的样子。

最后

顺带说一句，上面这些规则没有一条是我自己总结的。翻了几轮参考站之后，把别人做得好的地方拆成可执行的约束，比凭印象模仿要靠谱得多。