SVG

SVG 动画最容易“看起来像魔法”。这组示例会用 xjs 展示几种常见玩法：
路径描边、沿路径运动、属性动画、以及 transform 动画。

你会看到什么？

draw

把路径变成“正在被画出来”的效果。适合 logo / loading / 强调线条。

motion

一个点沿着 path 跑，像小飞机/小精灵巡航。用 update 回调把进度映射到路径长度。

attr

不是所有 SVG 属性都走 WAAPI；有些会走 JS fallback，但写法一样简洁。

一句话总结

核心心法：
- SVG 动画的“视觉冲击力”来自路径与形状变化。
- 你可以把“进度（0..1）”当作万能遥控器：它能驱动位置、旋转、描边、透明度……几乎一切。

SVG