Konsep yang disederhanakan dalam penamaan animasi web

Dukungan native untuk Animasi Web pertama kali dikirimkan di Chrome 36, dan diperbarui dengan kontrol pemutaran di Chrome 39. Metode Element.animate() dapat digunakan untuk memicu animasi imperatif langsung dari JavaScript, dan objek yang ditampilkannya dapat dimanfaatkan untuk mengontrol pemutaran animasi ini. Metode ini dijelaskan dalam draf spesifikasi W3C Animasi Web saat ini.

Ada polyfill yang dikirim yang sedang dalam pengembangan aktif yang melacak semua fitur Animasi Web yang diterapkan secara native, dan didukung di semua browser modern. Metode inti ini siap digunakan sekarang, dan layak menjadi bagian dari toolbox Anda untuk membuat pengalaman yang kaya yang mendapatkan manfaat dari animasi (seperti untuk aplikasi web Google I/O 2015.

Perubahan konstruktor dan grup

Spesifikasi Animasi Web juga menjelaskan grup dan urutan, serta konstruktor untuk animasi dan pemutar. Fitur ini telah tersedia di polyfill web-animations-next, yang telah dirancang untuk menampilkan fitur yang masih dalam pembahasan dan belum diimplementasikan secara native. Sebagai respons atas masukan developer, tim yang mengembangkan Animasi Web mengganti nama fitur ini agar lebih mudah dipahami.

FXTF baru-baru ini bertemu di Sydney, Australia, dan mendiskusikan pemberian nama, karena sejumlah developer mengajukan poin valid tentang beberapa nama yang membingungkan. Oleh karena itu, perubahan penamaan berikut disepakati:

  • Animation menjadi KeyframeEffect
  • AnimationSequence menjadi SequenceEffect
  • AnimationGroup menjadi GroupEffect
  • AnimationPlayer menjadi Animation

Perlu diingat bahwa meskipun animasi dan pemutarnya tersedia secara native di Chrome dan sebagai bagian dari polyfill, keduanya saat ini dibuat langsung melalui metode Element.animate(). Kode yang sudah ada yang menggunakan metode Element.animate() tidak akan memerlukan perubahan.

Nama baru lebih akurat dalam merepresentasikan perilaku yang diberikan oleh setiap objek. KeyframeEffect, misalnya, menjelaskan efek berbasis keyframe yang dapat menargetkan elemen HTML. Sebaliknya, objek Animation baru mewakili animasi dalam salah satu dari banyak status (seperti diputar, dijeda, dll.).

SourceCodeEffect

Jika menggunakan bagian dari spesifikasi draf melalui polyfill web-animations-next, Anda harus memperbarui kode dalam periode penghentian penggunaan untuk mencerminkan nama baru ini. Sesuai dengan kebijakan perubahan polyfill, kami berupaya mendukung versi lama selama tiga bulan dan memberikan pernyataan peringatan konsol jika situs Anda menggunakan fitur atau nama yang tidak digunakan lagi.

Jika Anda ingin mencoba fitur ini, nantikan rilis v2 polyfill untuk memanfaatkan nama baru ini. Terakhir, pastikan untuk berlangganan grup web-animations-changes untuk mengetahui perubahan lainnya.