Pemutaran otomatis dengan suara bisu untuk video didukung oleh Chrome untuk Android mulai versi 53. Pemutaran akan dimulai secara otomatis untuk elemen video setelah terlihat jika autoplay
dan muted
ditetapkan, dan pemutaran video yang dibisukan dapat dimulai secara pragmatis dengan play()
. Sebelumnya, pemutaran di perangkat seluler harus dimulai oleh gestur pengguna, terlepas dari status bisu.
<video playsinline autoplay muted>
<source src="video.webm" type="video/webm" />
<source src="video.mp4" type="video/mp4" />
</video>
Anda dapat melihat cara kerjanya dengan membuka contoh ini. Pemutaran video muted
dimulai secara otomatis di Chrome 53 atau yang lebih baru.
![Screenshot pemutar video.](https://developer.chrome.google.cn/static/blog/autoplay-2/image/video-player-screenshot-f3aadca7e17ed.jpg?hl=id)
Selain itu, pemutaran yang dibisukan kini dapat dimulai menggunakan metode play()
. Sebelumnya, play()
hanya akan memulai pemutaran jika berasal dari gestur pengguna seperti klik tombol. Bandingkan dua demo berikut di Android — coba di Chrome 53, lalu di versi yang lebih lama:
Sebaiknya gunakan atribut autoplay
jika memungkinkan, dan metode play()
hanya jika diperlukan.
Anda dapat membunyikan video secara terprogram sebagai respons terhadap gestur pengguna seperti click
, tetapi jika Anda mencoba membunyikan video secara terprogram tanpa gestur pengguna, pemutaran akan dijeda.
Perubahan muted autoplay
juga akan memungkinkan penggunaan play()
dengan elemen video
yang tidak dibuat di DOM, misalnya untuk mendorong pemutaran WebGL.
Metode play()
juga menampilkan promise, yang dapat digunakan untuk memeriksa apakah pemutaran terprogram yang dibisukan diaktifkan. Anda dapat melihat contohnya di simpl.info/video/scripted.
Mengapa ada perubahan?
Pemutaran otomatis dinonaktifkan di versi Chrome sebelumnya di Android karena dapat mengganggu, menghabiskan banyak data, dan banyak pengguna tidak menyukainya.
Menonaktifkan pemutaran otomatis memiliki efek yang tidak diinginkan, yaitu mendorong developer untuk menggunakan alternatif seperti GIF animasi, serta hack <canvas>
dan <img>
. Teknik ini jauh lebih buruk daripada video yang dioptimalkan dalam hal konsumsi daya, performa, persyaratan bandwidth, biaya data, dan penggunaan memori. Video dapat memberikan kualitas yang lebih tinggi daripada GIF animasi, dengan kompresi yang jauh lebih baik: sekitar 10 kali lipat rata-rata, dan hingga 100 kali lipat pada kondisi terbaik. Decoding video di JavaScript mungkin, tetapi akan sangat menguras daya baterai.
Bandingkan hal berikut — yang pertama adalah video dan yang kedua adalah GIF animasi:
![Klip video yang diputar.](https://developer.chrome.google.cn/static/blog/autoplay-2/image/clip-video-playing-19c3aa36efcc.gif?hl=id)
Keduanya terlihat cukup mirip, tetapi ukuran video kurang dari 200 KB dan GIF animasi lebih dari 900 KB.
Chrome dan vendor browser lainnya sangat berhati-hati dengan bandwidth pengguna. Bagi banyak pengguna dalam banyak konteks, biaya data yang tinggi sering kali menjadi penghalang yang lebih besar daripada konektivitas yang buruk. Mengingat banyaknya solusi, pemutaran otomatis yang dibisukan bukanlah sesuatu yang dapat diblokir, sehingga menawarkan API dan setelan default yang baik adalah hal terbaik yang dapat dilakukan platform.
Web semakin berfokus pada media. Desainer dan developer terus menemukan cara baru dan tak terduga untuk menggunakan video — dan mereka menginginkan perilaku yang konsisten di seluruh platform, misalnya saat menggunakan video latar sebagai elemen desain. Pemutaran otomatis dengan suara bisu memungkinkan fungsi seperti ini di perangkat seluler dan desktop.
Detail yang lebih mendetail
- Dari sudut pandang aksesibilitas, pemutaran otomatis dapat sangat bermasalah. Chrome 53 dan yang lebih baru di Android menyediakan setelan untuk menonaktifkan putar otomatis sepenuhnya: dari Setelan media, pilih Putar otomatis.
- Perubahan ini tidak memengaruhi elemen
audio
: pemutaran otomatis masih dinonaktifkan di Chrome di Android, karena pemutaran otomatis yang dibisukan tidak terlalu masuk akal untuk audio. - Tidak ada putar otomatis jika Mode Penghemat Data diaktifkan. Jika mode Penghemat Data diaktifkan, putar otomatis akan dinonaktifkan di setelan Media.
- Putar otomatis yang dibisukan akan berfungsi untuk elemen video yang terlihat dalam dokumen, iframe, atau lainnya yang terlihat.
- Ingat bahwa untuk memanfaatkan perilaku baru, Anda harus menambahkan
muted
sertaautoplay
: bandingkan simpl.info/video dengan simpl.info/video/muted.
Dukungan
- Pemutaran otomatis yang dibisukan didukung oleh Safari di iOS 10 dan yang lebih baru.
- Putar otomatis, baik dibisukan maupun tidak, sudah didukung di Android oleh Firefox dan UC Browser: keduanya tidak memblokir jenis putar otomatis apa pun.