Dalam artikel pendek ini saya akan memberi tumpuan kepada HLS, protokol bitrate adaptif yang paling luas untuk penghantaran video. Saya akan menjawab beberapa soalan utama yang mungkin ditanyakan oleh sesiapa yang mempertimbangkan HLS untuk pertama kalinya: apakah itu, kapan menggunakannya, dan bagaimana menggunakannya.
Untuk membantu, saya akan menunjukkan beberapa contoh menggunakan alat penerbitan video dalam talian yang boleh anda gunakan secara bebas untuk menguji prestasi HLS anda sendiri.
Apa itu HLS dan bagaimana ia berfungsi?
HLS adalah protokol yang ditentukan oleh Apple untuk melaksanakan format streaming bitrate adaptif yang dapat disokong pada peranti dan perisian mereka. Sepanjang masa, ia mendapat sokongan yang meluas.
Ciri terpenting HLS adalah kemampuannya untuk menyesuaikan kadar bit video dengan kelajuan sambungan yang sebenarnya. Ini mengoptimumkan kualiti pengalaman.
Video HLS dikodkan dalam rendisi yang berbeza pada resolusi dan bitrate yang berbeza. Ini biasanya disebut sebagai tangga bitrate. Apabila sambungan menjadi lebih perlahan, protokol secara automatik menyesuaikan kadar bit yang diminta kepada lebar jalur yang tersedia.
Berbanding dengan video progresif, HLS mengelakkan penyanggaan semula dan menghentikan kesan serta membengkak sambungan pelanggan. Kita dapat melihatnya di tempat kerja dalam video ini.
Pada hakikatnya, HLS memberikan pengalaman pengguna yang jauh lebih baik ketika kami menggunakan kandungan video di aplikasi atau laman web kami.
Ia mempunyai sokongan asli di iOS dan Android. Ia juga didukung oleh Safari, dan dengan menggunakan beberapa JavaScript, ia didukung di semua pelayar utama (Chrome, Firefox, Edge). Walaupun menggunakan HLS memerlukan sedikit usaha, itu bukan masalah besar.
Mari lihat bila kita harus menggunakannya dan bagaimana.
Bilakah kita harus menggunakan HLS?
Terdapat kes di mana video tidak terlalu berat. Sebagai contoh, anda mungkin mempunyai urutan gambar yang dikodekan sebagai video 1-2 saat, dengan berat kurang dari 1 MB. Dalam hal ini, video progresif - yang dapat dimakan, seperti gambar, menggunakan HTML5 biasa - pasti merupakan pilihan terbaik. HLS tidak menawarkan kelebihan di sini.
Tetapi, HLS memang masuk akal ketika kita ingin menyampaikan video beresolusi tinggi (HD atau lebih) dengan berat lebih dari 3MB. Jenis kandungan ini boleh membunuh UX web kami apabila dilihat pada sambungan mudah alih yang rata-rata.
Perlu diperhatikan bahawa ini terjadi dalam peningkatan jumlah kandungan media, termasuk banyak video pendek kurang dari 20 saat yang digunakan dalam konteks e-niaga dan pemasaran. Dalam contoh di awal siaran, kami mempunyai video HD penuh dengan hanya 9 saat yang beratnya melebihi 6MB.
Bagaimana kita boleh menggunakan HLS di laman web kita?
Untuk menggunakan HLS kita harus menangani beberapa aspek. Saya akan memberi tumpuan kepada dua perkara penting:
- keperluan untuk menyandikan video, dan,
- keperluan untuk membenamkannya di halaman kami.
Untuk pandangan yang lebih komprehensif mengenai apa yang diperlukan saluran penerbitan video umum, anda boleh menyemak siaran ini.
Pengekodan HLS
Kami dapat menyandikan video dalam HLS secara dalaman atau dengan menggunakan perkhidmatan pihak ketiga. Untuk membina pengekod dalaman, pilihan terbaik adalah menggunakan FFMPEG, perpustakaan sumber terbuka yang kuat untuk pemprosesan dan pengekodan video. Dalam hal ini, kita harus menganalisis konten yang akan kita encode dan menetapkan sejumlah parameter.
Dalam HLS kita harus menentukan tangga bitrate (bitrate dan resolusi setiap langkah) dan panjang potongan. Apabila kami menyandikan video, kami diakhiri dengan satu set senarai main dan potongan. Biasanya, kami mengakhiri yang pertama dengan .m3u8 dan yang terakhir dengan sambungan .ts. Kita dapat melihat contoh pada gambar seterusnya.
Kita dapat melihat satu senarai main induk, satu senarai main tambahan per rendisi, dan semua bahagian setiap rendisi. Senarai main induk menentukan tangga bitrate dan jalan relatif ke setiap rendition.
Apple membuat cadangan umum yang menentukan tangga bitrate dan jangka masa 10 saat. Walau bagaimanapun, ini tidak begitu berguna untuk banyak jenis kandungan, seperti video pendek yang biasa terdapat dalam e-dagang dan pemasaran.
Sebenarnya, pendekatan terbaik adalah menyesuaikan tangga bitrate secara khusus dengan kandungan video. Dalam kes ini, jika anda ingin memanfaatkan HLS secara maksimum dan anda tidak mahir dalam pengekodan, perkhidmatan pihak ketiga yang menyediakan pengekodan per-tajuk (dengan HLS) kemungkinan merupakan pilihan yang tepat.
Pemain HLS
Di sini, kita dapati dua pilihan utama. Kita boleh berpegang pada pemain HTML5 atau kita boleh menggunakan pemain yang dilaksanakan dalam JavaScript.
Pemain HTML5
Versi Safari terkini menyokong HLS. Dalam kes ini, anda boleh menggunakan senarai main HLS dengan cara yang sama seperti video progresif. Dengan penyemak imbas lain, anda mungkin menggunakan pustaka JavaScript kecil untuk menerapkan protokol HLS dan sekali lagi menggunakan pemain HTML5 untuk video progresif.
Ini boleh dilakukan dengan HLS.js. Perpustakaan ini hanya melaksanakan perundingan rendition, berdasarkan lebar jalur yang tersedia. Sokongan hampir universal, hanya bergantung pada sokongan API elemen media.
Pemain JavaScript
Sekiranya kita perlu menyesuaikan pengalaman video - yang sangat biasa di halaman pemasaran dan cerita - maka kita perlu menggunakan sesuatu selain pemain HTML5 lalai.
Walaupun terdapat banyak pilihan komersial di luar sana, Video.js adalah pilihan yang baik. Ini pemain sumber terbuka yang menyokong tahap penyesuaian yang tinggi, termasuk kulit dan kawalan yang berbeza.
Pemain seperti Video.js juga menyokong penjejakan peristiwa yang berkaitan dengan video (seperti tindakan main atau jeda) sehingga kami dapat memasukkannya ke dalam analisis kami sendiri. Sebenarnya, memasukkan data ini dalam Analitis Google kami sangat mudah.
Ringkasan
Saya telah menjawab soalan pertama mengenai HLS yang akan dimiliki oleh kebanyakan pengguna berpotensi: apakah itu, dan kapan kita harus menggunakannya.
Walaupun saluran paip penerbitan video yang bergantung pada HLS dapat dilaksanakan dan digunakan secara dalaman dengan alat sumber terbuka seperti FFMPEG dan video.js, sebaiknya menggunakan perkhidmatan penerbitan video jika anda bukan pakar dalam bidang teknologi. Mereka membawa ciri-ciri canggih seperti pengekodan per-tajuk, mengurus semua kerja keras, dan membiarkan kami fokus pada keperluan penyesuaian kami.