当 requestAnimationFrame 遇上 CSS:一场关于丝滑动画的恋爱 各位看官,咱们今天聊点什么好呢?不如聊聊动画吧!不过,咱们今天要聊的不是那种拿着铅笔一帧一帧画出来的老式动画,而是前端开发中让人又爱又恨的 CSS 动画。爱它是因为它简单易上手,恨它嘛……嘿嘿,有时候跑起来真的有点“卡顿”,像喝了假酒一样。 咱们前端er,追求的可是丝滑般的动画体验,要让用户感觉像是在用冰淇淋勺挖丝绸一样。那么,如何才能让 CSS 动画摆脱“卡顿”的阴影,变得更加流畅呢?今天的主角就要登场了,它就是——requestAnimationFrame,咱们就叫它“rAF”吧,听起来更亲切。 CSS 动画:便捷与局限并存的小可爱 CSS 动画,说白了就是通过 transition 或者 animation 属性,让元素在一段时间内,从一个状态平滑过渡到另一个状态。这玩意儿确实方便,写几行代码就能让你的网页“动”起来。比如: .box { width: 100px; height: 100px; background-color: red; transition: transform 0.5s …