Web Animations的命名简化

Web Animations的命名简化

这篇文章翻译自HTML5Rocks的Simplified Concepts in Web Animations Naming

最早支持Web Animation的浏览器是Chrome 36,在Chrome 39中又更新了对播放的控制。在Javascript中我们可以调用Element.animate()方法来声明式地播放动画。详细的信息可以在W3C Web Animation规范中找到。

这里有一个正在开发中polyfill库,实现了Web Animation标准。所有的现代浏览器都支持它。核心方法现在都处于可用状态,十分推荐大家用它来构建富客户端的Web App。

Constructor和Group的变化

Web Animation标准同样也描述了动画的groups、sequences和constructors。这些特性可以在web-animations-next这个polyfill找到。这个polyfill被用来展示正在讨论中未被实现的特性。为了响应开发者的反馈信息,Web Animation的标准制作团队正在修改部分命名,使得其语义更加清晰易懂。

FXTF最近在澳大利亚悉尼举行了一次会面讨论重命名方案。很多开发者提出有些命名非常另人困惑。讨论之后对如下命名变化取得了一致同意:

  • Animation修改为KeyframeEffect
  • AnimationSequence修改为SequenceEffect
  • AnimationGroup修改为GroupEffect
  • AnimationPlayer修改为Animation

记住只要是Chrome原生支持的Web Animation或者是polyfill提供的,都是通过Element.animate()来创建animation和player的。所以现有的使用Element.animate()的代码不需要改动。

新的命名更加贴切易懂,例如KeyframeEffect描述了HTML元素基于关键帧的动画效果。想对应的新Animation对象描述了动画的各种状态(例如playing、pause等等)。

对现有代码的影响

如果你正在基于web-animations-next这个polyfill来使用部分draft规范,你必须要更新你的代码来使用新的命名。因为polyfill修改策略的原因,我们将会依旧支持旧的版本,并且在你使用即将废弃的api和命名时打印出告警日志。

如果你想尝鲜新的特性和命名,那么可以使用v2版本的polyfill。最后请一定要订阅web-animations-changes小组来了解最新进展。

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏编程思想之路

Android6.0源码分析之menu键弹出popupwindow菜单流程分析

例如上图,在按下菜单键后会弹出对应的菜单选项,准确来说,是在菜单键弹起后出现的一个popupwindow,那么从菜单键弹起到popupwindow创建所涉及到的...

50360
来自专栏FreeBuf

如何让微信丢骰子永远只出“666”

每次宅寝室一起点外卖谁下去拿都是个大问题,小编寝室一般选择微信色子谁小谁去拿,但是小编运气不太好 总是输,所以寻思着能不能每次都让色子是6点,皇天不负有心人,果...

45480
来自专栏Phoenix的Android之旅

其实热修复就这么简单

上几篇内容介绍了Java的ClassLoader和相关的知识点,总的来说 · Java加载class逻辑是双亲委托模式 · 对于不在class path中的cl...

10410
来自专栏tkokof 的技术,小趣及杂念

爬坑笔记

  游戏开发过程中遇坑在所难免,没遇到的话基本上也是因为爬的不够远不够深罢了,近日自己便遇到一坑,虽小但又觉的挺微妙(subtle),在此一记~

7410
来自专栏程序员互动联盟

【专业技术第十讲】嵌入式系统的中断流程剖析

存在问题: 搞嵌入式特别是底层,常常提到中断,中断时干什么的呢? 解决方案: 做嵌入式肯定要了解中断。本文根据实例详细介绍中断过程,包括软件和硬件方面。 示例:...

47660
来自专栏葡萄城控件技术团队

提高性能:用RequireJS优化Wijmo Web页面

上周Wijmo 2014 V2版本刚刚发布(下载地址),  有网友下载后发现仅仅使用了40个Widgets的一小部分,还需要加载全部的jquery.wijmo-...

21650
来自专栏Flutter入门到实战

Android M Launcher3主流程源码浅析

关于Launcher是啥的问题我想这里就没必要再强调了。由于一些原因迫使最近开始需要研究一下Launcher3源码,为了不再像以前那么傻逼(研究Settings...

22120
来自专栏ShaoYL

iOS逆向实战与工具使用(微信添加好友自动确认)

49680
来自专栏Android干货园

Android 百度地图SDK 实现获取周边位置POI

版权声明:本文为博主原创文章,转载请标明出处。 https://blog.csdn.net/lyhhj/article/details/49...

19920
来自专栏ShaoYL

iOS逆向实战与工具使用(微信添加好友自动确认)

62660

扫码关注云+社区

领取腾讯云代金券