Ngobrolin Video Player
Ringkasan Episode
Bantu KoreksiEpisode ini membahas perjalanan Imbre Nagi, seorang Cloud Engineer yang berbagi pengalamannya dalam mempelajari front-end development dan membangun platform course online menggunakan Astro. Imbre menceritakan awal mula karirnya sebagai iOS engineer, transisi ke cloud infrastructure, dan tantangan yang dihadapi ketika belajar front-end framework seperti React dan Next.js. Diskusi juga mencakup filosofi Astro sebagai framework yang mengutamakan server-side rendering dengan JavaScript minimal, serta insight tentang teknologi yang digunakan dalam platform course-nya seperti TypeScript, Ansible untuk deployment, dan integrasi dengan Firebase untuk autentikasi.
Poin-poin Utama
- •Imbre Nagi berbagi perjalanan karir dari iOS engineer hingga menjadi Cloud Engineer yang fokus pada database infrastructure (Postgres, Redis, Kafka)
- •Pengalaman belajar front-end yang cukup menantang karena harus beradaptasi dengan perubahan paradigma dari server-side rendering ke client-side rendering (SPA)
- •Pilihan menggunakan Astro untuk membangun courses.imbranagi.com karena filosofi server-side rendering dan JavaScript minimal yang sesuai dengan background back-end
- •Platform course menggunakan Astro dengan TypeScript, pure CSS (tanpa Tailwind), dan Ansible untuk deployment ke VM di Singapura
- •Diskusi tentang pentingnya memahami dasar-dasar web development dan tidak terjebak dalam abstraksi framework yang terlalu kompleks
- •Imbre menciptakan platform course sebagai bagian dari 'nazar pemilu' dan sekarang menjual materi course baik dalam format markdown maupun video
- •Pendekatan pragmatis dalam belajar teknologi: fokus pada pemrograman fundamentals daripada terpaku pada bahasa tertentu, sesuai dengan kebutuhan karir atau minat membangun produk
Halo, hai hai selamat malam, malam ini kita berdua ya tapi tenang aja nanti akan
ada narasumber udah ketahuan kan ya, udah ada namanya juga di poster iya
gimana kabarnya mengundang-undangin temen-temen siar-siar, oh enggak, iya selama
kita menjalani ngobrolin web tiap selasa malam baru menyadari kalau selasa
malam itu adalah malam yang krusial sering bentrok ya, kenapa? bentrok sama
Dua Timnas gitu kan, bentrok sama meetingnya GDG waktu itu sama Mas Danang
tuh sempat berapa kali bentrok sama meeting GDG, terus Ivan juga malam ini dia
ada meeting sama komunitas WordPress kalau nggak salah ya, jadi absen dulu
makanya kita cari-cari narasumber yang bisa diundang kebetulan akhir tahun
lalu tuh ada yang menawarkan diri untuk bahas tentang video, video di sini bukan
kayak yang kita bahas sama Mas Johan sebelumnya, kalau itu kan video streaming
ya, video conference, kayak Google Meet dan lain-lain, kalau ini
video kayak YouTube lah yang temen-temen nonton kan, ya cara menampilkan
kan semua nontonnya kalau nggak di app pasti di web kan ya, banyak kan juga di web ya
kalau misalkan nggak punya appnya juga bisa buka di handphone, buka youtube.com atau
em.youtube.com tuh kan ada playernya, terus bisa di play, bisa di pause, bisa di
ya kalau mungkin live streaming nggak bisa di pause ya, eh bisa nggak ya, bisa-bisa
bisa di pause tetap, nggak bisa di ini kalau yang nonton live, yang klik tombol
live itu nggak bisa di, speednya dicepetin, karena kan nggak mungkin kedua
karena live gitu kan, ya ada speednya bisa dilambatin, bisa dicepetin
terus ada subtitle dan lain-lain, teknologinya tuh banyak banget
jadi kebetulan banget malam ini kita bisa mengundang narasumber ini yang
pas karena bekerja, pekerjaan sehari-harinya yang ngurusin video
jadi langsung saja kita undang, Mas Yudi, halo Mas Yudi
-halo -tupu tangan lu, tupu tangan
-kabar gimana kabar? -alhamdulillah, baik
baik ya, buat mungkin buat temen-temen yang belum kenal, boleh dong kenalan dulu singkat
oke, saya Yudi, nama panjangnya, bukan nama panjang ya, nama lengkap
-nama lengkapnya Yudi Satu -nama panjangnya Yudi
-Yudi, bukan, nama lengkapnya Yudi Satu -sedap
Lihat transkrip lengkap (848 segmen lagi)
biasa kerjaan sehari-hari sih sebenarnya yang ngurusin, ngurusin, ngurusin
apa ya ngomongnya, video, website, terus webnya, webnya klien yang mau embed video kita gitu
-oke -gitu-gitu, dan kebetulan juga ya paling banyak di sana sih
karena teknologinya web, ya jadi pasti berurusan sama yang punya HTML, CSS dan JS itu sih
-oke, sekarang kerjanya di Daily Motion -Daily Motion, ya udah 5 tahun lebih ini
wow, mantap, itu boleh di ceritakan sekilas nggak, itu perusahaan seperti apa sih?
ya, Daily Motion itu perusahaan sebenarnya kalau orang banyak tahu YouTube ya sebenarnya
-udah duluan ya -posisinya seperti itu, walaupun sebenarnya
-Daly Motion lahir lebih dulu ketimbang YouTube -ya, sudah duluan sebenarnya
-cuma kalah kamor ya -ya, cuma kalah kamor aja, mungkin juga kalah
-jadi video platform ya -yes, video platform
by the way kalau lihat yang disini kan ini yang seperti YouTube-nya, sebenarnya kalau saya
saya bukan yang ada kerja untuk yang di bagian ini, tapi saya di bagian yang lain yang harus
apa ya ngomongnya, harus mikir gimana caranya embed di websitenya klien dengan baik dan benar gitu sih
-oh, jadi ada service untuk B2B juga ya? -ya, saya B2B
bagian B2B nya untuk serving video, jadi bisa jadi kayak hosting video gitu ya modelnya
ya, ini nggak tau nih, nanti pikirnya lagi ngiklan nih kalau saya terus ini
-gapapa, nggak masalah kan berbagi pengalaman -ya ya ya
intinya itu sih B2B, terus kita juga ada semacam yang monetize videonya
terus kita juga lagi kebetulan sejak 2 tahun terakhir kita juga lebih menjual infra nya untuk B2B
jadi bisa di white label gitu, misalnya apa ada news apa ada media gitu
yang pengen kayak daily motion cuma buat mereka sendiri gitu
ya, beberapa bahkan di Indonesia juga sudah ada beberapa yang embed playernya daily motion di website mereka
hmm, iya sih, kalau yang pakai infra nya itu namanya dia nggak, harus pakai playernya
itu juga bisa pakai playernya, atau mungkin kalau mereka punya player sendiri
-oh, iya iya iya, jadi misalkan kita mau, iya kan kalau infra untuk video kan lumayan mahal ya?
dan urusannya banyak sekali, udah storage, terus ada DRM, ada macam-macam gitu ya
-mendingan pakai service yang udah ada jadi lebih simpel gitu ya -ya
-berarti masih di bagian yang buat B2B nya gitu ya -ya
hmm, menarik, nah, jadi malam hari ini kita akan bahas tentang bagaimana berbagai hal
berbagai aspek bagaimana menampilkan video di web ya, di web
jadi ada banyak faktor sebenarnya, karena mungkin sebelum kesana kita bahas tentang sejarahnya dulu ya
kan sebelumnya kan kalau HTML awalnya kan dokumen ya
video itu mungkin awal banget kayaknya dari gif dulu ya, dari gif ya kan
animasi sebelah sana, iya awalnya, iya, tapi gak tau ya bisa itu bisa dibilang video atau engga
-cuman... -belum-belum video ya
-sebetulnya HTML element video itu mulai ada tahun berapa sih? -HTML5 bukannya?
ya, sejak HTML5 dipublish tapi mungkin belum cover semuanya ya, mungkin waktu itu karena videonya masih
masih, oh deck nya terutama ya, encoder nya ya, encoder nya masih terbatas ya
ya, dan waktu itu kalau masalah, yang pertama formatnya FLV
ya dari Flash, ya dulu inget banget kalau misalkan menampilin video di web itu harus menggunakan
Macromedia Flash, ada plug-in nya, jadi kalau browser baru, apa menampilin video ada ini ya
ada tombol bawah, download, download dulu ya
udah gitu kita mau bikin videonya, mau bikin file videonya itu
kita bisa menggunakan formatnya juga Macromedia Flash ya, jadi kita harus punya software nya
untuk mungkin konversi dari format video kayak, jaman dulu apa ya, MPG, AVI, 3GP, 3GP kan
itu dia, coba buka wiki page yang di private, itu juga ada inform narik tentang format formatnya terutama
history of video element, coba 2006
begitu ada element video, berarti kayak diakuin bahwa platform web ini, platform yang solid buat nampilin video kan
justru dipropos oleh Oprah ya, luar biasa ya Oprah
ya betul, apalagi ya mobile, semua itu Oprah mobile
makin ke bawah ini makin ribet soal format nih, kalau soal konsep, ok lah platform web bisa buat nampilin video
pasti awal konsepnya tuh simpel kan, ada kontrolnya, ada semua fitur-fitur umum
ke bawah tuh bahas format, pusing, formatnya macam-macam, pusing, ada MP4, WebM, OGV
ini yang bagian front-end aja udah ribet
apalagi yang back-end, kebayang sih, kalau yang back-end itu kalau gak salah, begitu kita upload satu file
misalkan kayak di YouTube lah contohnya ya, kita upload satu file, itu dia convert satu-satu ke format-format yang ini
yang dibutuhkan
dan itu dipecah-pecah kan, gak mungkin satu file belondongan gitu kan
terus nanti juga belum urusan apa namanya resolusi juga ya
resolusinya 480, 720, 1080, terus nanti bisa adaptif kan, kalau misalkan lagi lambat dia turun gitu kan
ya, jadi setiap sekian detik ke depan tes, selalu apa, ngecek kan, kalau misalnya lambat bisa tiba-tiba nge-drop
iya, jadi memang banyak sekali yang diurus ya oleh si...
- Nah ini nih, itu menarik tuh kelimat yang di atas tuh yang ada kursornya
"polarization of HTML video" antara yang industri standard, kayak udah HDF isunya, yang kayak udah...
itulah, cuma dapatinnya versus open format, kayaknya dapat yang... maksudnya apa? - Tidak akan berakhir ya
saling tarik menarik yang tribut, sebenernya soal image, soal format gambar juga mirip-mirip kan
- Sama sih, iya iya iya
- Kalau sekarang lebih prefer format apa kalau dari Mas Yudi?
- Pakai WebM atau masih MP4 atau? - Sekarang sih paling universal menurut diriku sih
ini sih MP4 sih, karena MP4 juga nggak cuma video juga, MP4 juga untuk audio kan
- Audio, betul, oh oke - Bisa memuat dua itu
- Iya iya iya iya, kalau WebM itu hanya video ya?
- Ya kan, karena formatnya WebM kayak semacam apa ya, nggak semua player bisa muter videonya
- Karena masih baru juga, tersitung baru lah ya dibandingkan MP4 yang udah lama ya
- Ini kalau misalnya diterusin kenapa saya lebih condon ke MP4, ini ada urusan yang sama
"player native di masing-masing OS"
- Nah itu di Wikipedia juga ada tuh, scroll terus ke bawah
- Google punya sendiri, Cisco juga ada, Apple juga ada sendiri
- Ya itu, challenging banget - Linux, kalau Linux apa? OGG yang paling ini ya?
- OGG ya - OGG, kalau Linux OGG
- Kalau Apple - Apple itu apa dia ya?
- Formatnya QuickTime ya kalau nggak salah ya?
- QuickTime itu MP4 juga kalau nggak salah - MP4 ya
- Ada sendiri kayaknya yang... - Ada yang beda ya?
- Yang dia bawaannya dia lah - Ini masih di ranah digital ya
- Kalau misalnya udah ada TV yang minta untuk formatnya mereka bisa masuk itu juga lebih ribet lagi
- Hmm, ya ya, QuickTime Component, oh nggak ada tulis, nggak ada di sini
- Tidak disebutkan, tapi MP4 sih - Ya saya ingat itu cuma MP4 mereka juga
- Oh yang sekarang agak beda itu format image ya, justru ya
- Mereka lagi ngeluarin image baru ya, image baru buat foto
- Apa sih, lupa namanya? - H-A-E-C
- Kata deh bacanya gimana deh
- Tapi di handphone Android juga udah pake H-A-E-C sekarang
- Oh belum tahu sih kalau yang itu
- Iya soalnya beberapa kali mau download lu H-A-E-C tergantung distro nya
- Tergantung distro nya - Distro
- Tapi kan Android sudah kan - Iya sih, maksudnya distro dalam arti
- Ada Android Vanilla, ada Android yang Samsung punya, ada yang tergantung merek
- Ada Android yang namanya jadi Harmony OS kan
- Oh iya bener, ada yang di Forking ya, jadi Harmony OS, ada yang jalan di Kindle juga
- Jadi udah kayak Linux juga ya
- Nah ini format-format baru ya, kayak FFP8, FFP9, H-A-E-C ini yang baru juga kayaknya
- Yang sama image? - Iya
- Tapi belum terlalu populer di dorakannya
- Served in mp4 container, berarti itu kayak cross compatible sama mp4
- Kalau denger container kayak mkv bukan, mkv itu biasanya isinya ada audio, video, sama subtitle
- Oke
- Iya, kalau misalkan kita punya format mkv itu biasanya ada, kadang-kadang ada yang ada subtitlenya langsung
- Jadi dia kayak di-zip gitu modelnya
- Before HTML5 era, the only way to playback, yang tadi kita sebutkan ya, yang melalui Adobe Flash Player
- Nggak panjang umur juga sih, udah pernah
- Ingat banget waktu itu Youtube lagi migrasi dari Adobe Flash
- Iya bener, Flash itu dibunuh oleh Apple
- Salah satu alasannya karena baterai katanya ya
- Eh nggak tau deh kalau yang itu, nggak ngikutin
- Iya, nah ini kan kita juga tadi sebutin, ini banyak banget, ada DRM ya, Digital Res Management
- Jadi kalau misalkan temen-temen sekarang nih, misalkan nonton video apa gitu yang berbayar
- Misalkan kayak Netflix lah, atau di Netflix, atau video.com gitu ya
- Gak bisa di screenshot kan ya, pertama kali nyoba pushing
- Oke, kita nyapa-nyapa dulu ya, ada Mas Ahmad Muwafak
- Halo, ada Mas Sinar Hadiwijaya, selalu Mas Yudi, ada Claudius
- Ivan lagi meeting ya, dia udah nggak ikutan meeting selama beberapa minggu akhirnya
- Wordpress ya, apa persiapan acara apa ya itu?
- Wordcam dimana gitu pokoknya
- Ini kenapa Pak Dika nggak ikutan nih?
- Kenapa ya?
- Loh biar pada nonton channelnya Pak Dika dong
- Sekarang udah jadi gym bro
- Iya, Pak Dika kan kalau nggak salah, Pak Dika tuh punya program yang hampir sama ya
- Kayak ada update-update juga, jadi kita undang bisa sesekali, tapi kalau misalkan seterusnya
- Kayaknya masing-masing channel ngeserv sendiri-sendirilah
- Kita nanti kadang-kadang kita nampil disana, kadang-kadang Pak Dika disini
- Jadi biar semakin beragam juga
- Oke, selanjutnya kita bahas apa, ini sudah, ini kan apa namanya, history
- Sedikit historinya udah diawali dari usage
- Apa tuh?
- Ya tadi yang baru sam banget kita bahas
- Ya ada Dailymotion tuh, HTML video was not widespread as flash video, though there were rollouts of experimental HTML based video players from Dailymotion
- Video player berbasis saten L, pioneer ya
- Ya pioneer juga
- Format awalnya OGG itu salah satu format awal berarti ya
- Open, soalnya open format dia
- Mungkin yang lebih aman license-nya kali ya
- Ya betul, kalau Youtube dia lebih ke MP4 atau WebM, kalau Vimeo MP4 juga, A264, ini MP4 kan ya
- Iya, itu kayak apa namanya ya?
- Codec ya atau encoder ya
- Codec, codec, codec, codecnya itu kalau formatnya beda lagi
- Hmm, oke, setelah itu baru munculah kayak Netflix dan seterusnya dan seterusnya
- Jadi Januari 2015 ya, Youtube baru switch ya dari HTML ke, dari flash ke HTML ya
- Waktu itu aku ngikutin kalau gak salah, sejak 2011 mereka sudah mulai setengah-setengah kalau mau eksperimen pakai yang HTML
- Oh iya pakai flag something gitu ya
- Kalau gak disuruh balik gitu gak gitu kan
- Benar, benar
- Sampai 2016 by default desktop, browser desktop masih ada flash-nya itu
- Sampai 2016
- Di HP, generally gak ada flash-nya
- Iya
- Nah, kalau pengalamannya Mas Yudi nih dengan menampilkan video di web gitu, tantangannya apa aja sih?
- Justru kalau di webnya itu teknisnya bukan teknis ngonding sebenernya, tapi teknis lebih, kita itu harus tahu segala jenis apa namanya ya
- Aturan yang memperbolehkan kita untuk memutar sebuah video
- Oh, ribet ya
- Ribet, itu ribet, bahkan sempat yang hampir 1 atau 2 bulan gitu ya
- Saya berkutat banget sama yang namanya behavior itu
- Jadi by default kan memang video itu ada dalam sebuah webpage atau alaman gitu kan
- Kalau dia memang, si user ini memang kehalaman itu untuk ngeliat video itu masih aman untuk bisa dilakukan auto play
- Tapi kalau misalnya video itu bukan bagian dari titlenya apa, videonya apa gitu kan
- Atau yang suka kayak pop up gitu ya? - Yang menjual sesuatu gitu kan atau ads dan sebagainya
- Itu banyak sekali yang harus dipenuhi untuk behavior itu, dan disitu yang susahnya
- Dan itu waktu itu saya bisa makan sampe 2 bulanan hanya untuk itu, karena begitu sudah rilis, ternyata ini udah bener nih di Chrome, ke air force, ke safari gagal
- Jadi memang harus banyak ini juga, harus klik juga dan harus punya pengetahuan soal apa yang boleh dan apa yang gak
- Terus mengakalinya itu gimana? Harus testing di banyak browser, ada otomasi testing yang dipakai atau apa?
- Itu berarti kan IP, IP address, connection, yang gitu-gitu mesti di cek semua gitu ya?
- Itu sebenernya kalau yang sudah di behavior ini sudah lepas, saya sudah lepas tanggung jawab soal yang itu ya
- Ada department lain ya? - Ada tim sendiri kali ya? - Maksudnya ada di tempat yang lain, kebetulan saya juga yang kerjain
- Tapi untuk yang behavior ini, ngering-ngering sedap juga sih
- Terus kadang misalnya gini ya, ada video yang diperbolehkan untuk memutar terus, kita masuk ke satu alaman untuk melihat video itu ya
- Kalau ada website lain yang video itu terutama kalau videonya bukan main videonya, itu kita harus browse kalau misalnya kita scroll
- Oke iya iya iya benar benar
- Dan itu harus viewable, kalau gak viewable itu muter videonya itu dianggap ilegal
- Oh gitu, kalau kita punya isilahnya element video, terus diputar, terus display-nya none itu ilegal?
- Ilegal - Oh oke
- Karena maksudnya itu kali ya, advertiser sudah bayar, dia sudah bayar duit, kalau misalnya ternyata gak dilihat, bisa dimanai
- Ada hubungannya sama itu juga, tapi pointnya adalah kalau sebuah alaman website itu untuk menunjukkan memang main videonya itu
- Alah di website itu, itu gak apa-apa misalnya youtube kan, kita satu video kan kita scroll-scroll, dia masih nyala itu videonya
- Video utamanya - Video itu bukan video utama dan bahkan mungkin juga jauh dari artikel mungkin misalnya ya
- Terus kita mainin gini terus dia masih muter, itu kayak abuse of, apa namanya?
- Oke, wah - Nah itu, ini ngerempet ke monetize
- Monetize ads - Yes
- Nah ads ini juga menarik ya, maksudnya belum kebayang misalkan kita lagi nonton video, terus di menit ke lima tiba-tiba ada ads kan
- Video nya kan itu kan formatnya kayak, antara itu dia pasti streaming kan, chunking gitu kan, terus tiba-tiba ada diselipin iklan
- Berapa detik gitu, lima detik, itu - Dan iklannya juga kan lain-lain kan, tiap user
- Iklannya di query kan tergantung sama usernya, itu gimana cara kerjanya?
- Itu sebenarnya kerjaannya si Google juga sih, jadi ada Google apa namanya ya, saya lupa namanya, tepat package, package nya itu namanya apa
- Cuman nanti dia itu ada, kita nyelipin di player kita, kalau dia, jadi tugasnya dia adalah mencari query di belakang
- Kalau misalnya dia menemukan ads untuk digambil kan, dan panang package nya nih, ads manager, tapi itu part of Google ads manager
- Oh part of Google ads manager, jadi udah ada package nya tinggal dipake ya
- Iya - Tapi di player nya sendiri kan udah ada fitur itu kan, jadi gak perlu ngatur manual ya
- Gak - Terus ada iklan yang bisa diskip, ada yang tidak bisa diskip, ada yang tiba-tiba muncul tombol skip atau engga gitu kan
- Itu juga tugasnya si package, lupa lagi disana, lagi cari namanya nih - Iya ngomongin tombol yang diskip berarti
- Ada selain laptop atau PC, terus ada handphone, ada juga smart TV kan ya sekarang ya, itu termasuk di handle juga?
- Itu juga sama Delimotion itu handle gak sih? - Delimotion ini sebenarnya sempat punya itu, dan punya divisi nya juga
- Terus beberapa tahun terakhir kalau gak salah 2 atau 3 tahun lalu ditinggalkan, terus jadi ada lagi, terus akhirnya tapi
- Jadi gue suka apa sih namanya, explore juga soal itu karena ada kebetulan ada klien juga yang base nya PC, menurut Delimotion untuk bisa memang support
- Support ya - The problem sama TV adalah device nya lama
- Device nya lambat? - Bukan, tapi device nya lama, orang kan gak mungkin di TV tiap tahun tuh
- Oh iya rolling nya ya - Terus mereka masih menginginkan layarnya mereka bisa diputar di TV tersebut
- Dan itu ribet ya, karena TV itu punya OS sendiri-sendiri kan, punya OS sama kayak ada semacam gak tau dibalik itu apa, tapi kayak ada native app nya kan, kayak misalnya Samsung TV gitu, ada semacam play store lah, bisa buka dari situ
- Ajamnya ada browser nya juga, gak tau browser engine nya apa, tapi browser nya kacau banget lah, tapi bisa dipakai buat buka, bisa dipakai buat video, ada edge nya sendiri juga tapi
- Bisa cerita dikit misal yang isi TV OS nih, jadi sebenernya TV OS TV tuh juga engine nya adalah Chromium - Oh, oke, aman lah ya harusnya ya, sedikit aman lah ya - Tim teori aman - Nggak juga
- Jadi ada beberapa player, jadi player ini limosan itu sudah gak support untuk Chromium versi itu - Versi sekian, oke - Ya versi sekian itu udah gak support, tapi masih ada kemungkinan bisa muter video
- Tapi dengan menggunakan terpati player di luar dalemun, ya ini player paling terkenal sih, dan paling banyak digunakan namanya video.js, ini pun gak bukan versi-versi yang baru, versi-versi yang sudah agak lama gitu kan
- Iya, iya - Dan waktu itu sempat bergulat dengan ini sekitar 2 bulanan karena, kenapa 2 bulan karena saya susah cari TV nya
- Susah cari TV nya, oh iya gak bisa di-automasi juga ya - Gak bisa - Sulit ya - Kliennya kudungan CTV - Iya kudungan CTV, bener juga, susah itu ya
- Dan ini, dan penggunanya masih yang liat, yang nonton video mereka di TV itu, masih sekitar 30 persenan - 30 persen gede dong - Iya - Banyak
- Banyak, tapi bukan di Indonesia ya, di negara Amerika Latin ngelupakan namanya, di Indonesia itu masalah - Oke, oh wow
- Lumayan, berarti lumayan signifikan juga ya untuk - Akhirnya, jadi ada tekanan juga sih karena memang harus itu dan sales juga harus jualan, ikutan ceritanya
- Jadi ya, gak mau support mereka juga - Kalo kita cari versi browser nya yang sama aja, gitu masih belum cukup mumpuni untuk dicoba?
- Sudah melakukan seperti itu, jadi by development saya coba pakai di browser dengan versi yang sama dan versi yang itu - Versi yang sama
- Yang terakhir sih katanya sih sudah bisa - Sudah aman gitu ya? - Sudah aman, cuman ya itu tadi, petualangannya nyari TV nya ke tempat service TV berapa?
- Niat banget - Niat banget, udah sempet nyari ya berarti ya? - Udah sempet nyari, sudah sempet nyari
- Oke, dan versi TV nya juga masih yang lama jadi gak ada yang baru, jadi cari di bengkel - Iya
- Akhirnya gak ketemu? - TV nya pada akhirnya gak ketemu cuman mencoba matching versi chromium sama versi teks - Versi chromium nya aja, untungnya masih ini ya, masih chromium untungnya ya bukan browser yang lain
- Oke, siap, siap, siap, nah ini ada pertanyaan yang menarik nih tentang performance, sering kali video membuat loading cukup lama berpengaruh ke core web vital
apalagi kalau di above default, ada tips dan trik nya gak buat supaya lebih cepat loading nya?
- Agak susah sih kalau dia above default, kalau dia below default itu lebih mudah - Lebih mudah ya
- Kalau yang above default sih sebenernya, apalagi dengan kondisi yang internet nya juga gak rata ya, sebenernya pakai streaming, kalau gak tau sih karena teknologinya agak gimana ya, agak ribet juga jadi kalau misalnya kita streaming, kita gak streaming langsung ke spesifik, resolusi tertentu gitu
misalnya 480 pixel atau 720 pixel, gak begitu kan, kalau kita sudah dipelajari seperti kaya youtube itu sebenernya mereka juga pakai teknologi, bukan pakai cara yang sama saya yakin
kita nge-load nya bukan nge-load mp4 nya tapi .sls atau biasanya kalau ada .m3u, itu kaya playlist yang buat chunking stream ya, dia akan adaptive secara otomatis
- Nah berarti biasanya kalau main video kan gak kalinya pakai placeholder image kan, selama masih loading, kaya masih loading video benerannya, itu pasti ya kaya youtube atau semacamnya yang ditampilkan kaya thumbnail image nya kan
- Thumbnail nya, oh iya beneran, ini jadi promo lagi nih, kalau di daily motion, daily motion itu kita semacam ada bukan image status ya, tapi kaya semacam gambar tapi jalan ya, bukan gif juga
- Gambar tapi jalan - Iya, saya lupa formatnya, betul kan bukan saya kerjain cv itu, cuman di daily motion kaya semacam ada potongan-potongan video tapi benerannya berbagai gambar
- Oh cuplikan-cuplikan gitu ya kaya, apa istilahnya kalau di efek di foto itu kalau kita foto liburan gitu kan, foto efek gitu yang kaya muncul pop up atau muncul fade in fade out gitu ya
- Semacam itu kalau di daily motion aja, kita bisa akalin dengan itu, jadi seolah-olah videonya sudah muter gitu
- Hmm oke, ya salah satu tipsnya mungkin itu ya, kalau videonya belum keload secara full atau setengahnya atau seperempatnya, tampilin thumbnail nya dulu atau api solder lah ya api solder
- Kaya beli waktu buat thumbnail itu, tapi secara core web vital kan itu gak apa-apa kan, maksudnya karena gak CLS juga kan, aspek rasio nya udah segitu
- Dan kalau pakai, ya gimana Mas Gidi lanjut-lanjut
- Kalau tadi membahas CLS nih, biar dia gak lompat-lompat, kita juga harus sudah di placeholder juga sih, jadi kan
- Placeholder nya ya, dengan aspek rasio yang pas ya, jadi dia gak shift nya minimal height nya sama gitu ya
- Kalau kita pakai teknik seperti preload gitu, ngaruh gak sih untuk performance
- Sejauh ini, masalahnya gini sih, karena daily motion ya, jadi load videonya juga gak
- Kalau video semua
- Video semua ya, bener juga
- Karena kalo kita mau preload kan, kita harus tau url nya dimana gitu kan, kita gak tau url nya kemana
- Tapi kalau misalnya itu di luarnya mongol, agak susah juga, sempat kita mau bikin seperti itu agak susah karena, ya tadi apa
- Susah ya
- Apalagi kalau embed, gimana deteknya, kalau misalnya di website nya sendiri, yang tadi apa, kaya feed gitu kan, ya masih agak mendingan ya
- Kalau user berhenti atau mulai mouseover, berarti preload aja halaman itu
- Ya, preload yang dimaksud ini ya, jadi kita menggunakan link rail preload as video gitu ya
- Ya
- Ini salah satu cara untuk, kalau ada halaman terus ada videonya, kita bisa minta browser untuk preload dulu walaupun belum di play gitu ya
- Ya
- Sehingga ketika di play lebih lancar gitu
- Tapi kalau yang seperti ini, harus punya macam punya infra nya sendiri gitu, dan player nya mereka sendiri
- Tapi kalau misalnya pakai player seperti Delhi motion, youtube dan teman-teman famil, gak bisa
- Gak bisa ya
- Oke
- Iya bener juga ya, filenya harus udah jelas lokasinya dimana ya
- Itu proteksnya halaman kita sendiri
- Halaman sendiri, betul
- Dan videonya juga gak kayak m3u8 dan lain-lain kan, padahal ya mp4 gitu kan, satuan lah ya
- Iya
- Kalau m3u8 kan kayak playlist
- Oke
- Ada apa namanya, kalau selama ngerjain projek-projek yang berhubungan dengan video, seringnya pakai web API apa aja ya?
- Web API
- Apa tadi yang kayak apa, tadi above the pole, terus picture-in-picture, pakai dong
- Pertanyaan menarik dan sering juga ditanyakan
- Oke
- Maksudnya ditanyakan sama klien ya
- Oke
- Yang sebenernya ini sih, picture-in-picture itu fitur default dari browser dan OS-nya
- Kalau di dalam browser dan OS-nya gak ada, atau tidak aflame
- Gak bisa dipaksa
- Gak bisa dipaksa
- Oke
- Ini bisa dimunculin terus gak? Gak bisa, atau mungkin
- Susah, kliennya kan bukan lu, Deff, gak tau prinsip apa-apa, apa yang browser, apa yang OS, klien gak mau tau
- Kadang-kadang gitu, jadi susah, akhirnya menjelaskan terus kasih link, ini kenapa kalau gak bisa gitu
- Hmm
- Tapi ini, kita punya, tadi kan karena juga bisa dimunitasi ya, player juga harus flow
- Kalau sering lihat, apa namanya, player floating di kanan atau di kiri, terus tiba-tiba nyentai iklan
- Pada akhirnya, kita ngakalinya seperti itu, biar iklan tetap bisa dilihat
- Hmm
- Yang gak bisa itu kan keluar dari, gak bisa keluar dari window-nya
- Gak, iya itu
- Yang kuda edukasi klien kan
- Ya, jadi kita punya semacam PIP, artificial PIP
- Artificial
- PIP di halaman itu masih bisa
- Oh iya, ngerti-ngerti, oke, nah terus kalau fitur-fitur lain misalkan kayak playback speed dan lain-lain itu udah di handle sama komponen videonya kah, atau ada algoritma sendiri
- Itu sebenarnya sih jadinya kayak sudah handle by si komponen, kalau misalnya
bare-hand mau bikin player sendiri pakai HTML5, perjalanannya masih jauh
- Jauh ya
- Kalau baru mulai ya, sekarang kan sudah ada banyak open source video komponen ya, kayak video.js ada, random macam-macam
- Yes
- Kebanyakan sih sebenarnya, turunan-turunan apa, sorry, open source-open source yang lain itu sebenarnya turunan dari video.js
sering liat, sering liatnya seperti ini
- Video.js ya
- Video.js berarti yang paling, yang paling lengkap gitu ya
- Ya paling lengkap dan paling top dan paling mature
- Paling mature, tapi kenapa mereka forknya dari video.js, karena video.js ini lumayan low level kah, atau gimana
- Apa yang ngomongnya, bisa jadi dibilang antara fitur yang lengkap dan pelaginnya juga banyak
- Oke, jadi kadang-kadang terlalu banyak pelagin juga membingungkan ya
- Sama kayak lama-lama udah jadi standar kali ya, karena orang udah yang terbiasa pakai sinteksnya, apalah pakai API-nya video.js ya udah
- Setipada pakai atau bikin library baru lagi, ya harus bikin kayak konsensi baru lagi kan
- Iya
- Oke
- Tapi ada beberapa lagi sih kalau yang ada, satu-satunya yang memang lepas dari video.js
- Jwplayer, jwplayer ini gak?
- Jwplayer itu sebenarnya dia berbayar sih
- Berbayar, freemium bukan, ada yang gratis yang gak ada ya
- Seingat saya sih, semacam gini sih jwplayer itu kayak sudah di owned by some type of open source
- Tapi ini ada open source nya, mungkin ada, tapi ada watermark nya atau gimana gitu ya
- Mungkin gak selengkap yang berbayar pasti
- Iya, oke oke
- Oh itu udah keterananya, it does not contain the same, kayak mungkin fitur setnya lain, scroll ke atas sedikit
- This is non-commercial version of jwplayer
- Oh fiturnya lain
- Ya, ya seperti itu lah, kalau sudah advanced itu biasanya dia udah demonetized lah
- Ya, udah ada key nya di sini ya, udah di nambahin key
- Kalau pengen pake penggunaan yang simple, ya udah pake yang free, kalo banyak maunya
- Berarti kan orang yang butuh use case sedih complex, kemungkinan kan itu buat sesuatu yang profitable
- Ya, kalau tau video.com itu sebenarnya dulu ya, sekarang gak tau ya, dulu itu masih pake video.js
- Wah, you have been blocked, enabled to access kinsta.cloud
- Sorry, tadi video.com menggunakan jwplayer ya?
- Video.js
- Oh video.js
- Dulu ya, sekarang gak tau
- Dulu, ya mungkin sekarang udah bikin sendiri kali ya
- Mungkin ya
- Siapa tau ada kebutuhan khusus kan, maksudnya yang berhubungan, terutama berhubungan dengan DRM dan lain-lain ya
- Iklan
- Iklan ya, termasuk iklan
- Iklan, biasanya kalau yang apa namanya, kayak semacam user generated content itu pasti jatuhnya ke iklan sih
- Saya tuh beberapa kali ngalamin ya, terutama untuk website-website video yang tidak begitu populer
kalau youtube, youtube juga pernah ngalamin beberapa kali pas tiba-tiba videonya macet, ternyata gara-gara ads yang macet
- Gara-gara ad blocker, enggak? - Enggak, enggak, jadi kayak apa ya, kayak oh ternyata server-nya ads itu lagi sibuk, jadi dia gak bisa ngeserve, akhirnya videonya yang ke pause gitu
- Iya
- Karena kan pada cara menampilin ads kan, video ke pause dulu kan gitu
- Iya, iya
- Dan itu gak ada time out-nya ya, gak ada auto time out gitu, berarti kalau misalnya ads-nya macet di ads, ya udah videonya macet
- Itu kayak semacam ada algoritma di belakang yang kalau misalnya harus ngasih tahu nih, kalau macet atau gak ada atau apa, langsung balik ke video, harusnya ya
- Iya, mungkin belum tertangani dengan baik gitu, jadi menyebabkan begitulah
- Oh, jadi untuk ads itu udah ada platform dari Google-nya, sebagian besar menggunakan itu gitu ya, enggak bikin sendiri role center
- Ini namanya, saya baru dapetin, Google IMA SDK
- Google?
- Google IMA SDK, kita bisa masukin XML dari Google Ads Manager gitu ke situ nanti
- Google apa tadi? Google?
- IMA, IMA
- IMA Manager?
- SDK
- SDK, itu kayak semacam plug and play, tapi tetap moding juga sih
- Interactive Media Ads ya
- Iya, SDK kan berarti kayak udah ada rapper-nya, kayak tinggal panggil-panggil aja kan
- Iya
- Yang ini ya
- Iya
- Oh, oke, ini pilihannya hanya ada satu atau ada alternatif yang lain?
- Sejauh ini pakai ini dan dia enggak, maksudnya memang kayak semacam seperti terafiliasi sama Google doang ya, tapi sebenarnya enggak
- Kebetulan aja yang punya Google gitu ya
- Bisa pakai ad service manapun
- Oke
- Karena yang terpenting si fast tech-nya itu sih
- Fast compliance ini?
- Iya
- Oh
- Terus kita masukin video ads-nya itu ada di, ada back-end-nya, ada back-office-nya berarti?
- Iya itu tadi, di gam-nya, di mananya gitu, apa bukan?
- Ada kayak Facebook, Google
- Google Ads Manager-nya gitu lah
- Oh, Google Ads Manager-nya, iya iya, ngerti, ngerti
- Nah ngomongin tadi analytics, kalau video itu gimana tuh analytics-nya?
- Macam-macam, ada view, ada semacam misalnya, berapa persen video itu dilihat
- Sampai menit berapa atau berapa persen dari total gitu ya?
- Berapa persen
- Terus?
- Apa lagi ya, sebentar, sebentar
- Replace tiap nonton ulang, saya satu orang nonton satu video sepuluh kali gitu
- Iya, itu ditung tetap satu view atau?
- Kalau yang gitu kurang tahu teknisnya ya, misalnya secara teknis, karena kan nanti
- Unique ya
- Ya, secara ini sih sebenarnya manfaatin Google Analytics juga
- Oh, kalau Google Analytics kan ada views, ada unique views kan ya
- Jadi mungkin itu, kayak gitu juga kali ya
- Jadi kayak kita, apa namanya, listen event, kalau misalnya orang nge-click atau seek
- Atau pause, atau play, berapa lama kita nonton, gitu-gitulah
- Oh berarti itu service yang terpisah kali ya?
- Iya
- Berdasarkan event si user nge-click, atau seek, atau pause, atau close gitu ya?
- Iya, gitu
- Pokoknya interaksi user
- Interaksi user, apalagi yang unik ya kalau di video ya?
- Di video itu apa ya?
- Kebanyakan itu sih, kayak cuma lock-up
- Kalau misalnya, ini nggak tahu sih termasuk analisa atau bukan, misalnya
nonton video setelah setengah, ditinggal, terus nanti balik lagi, masih setengah, gitu
- Hmm
- Kayak kissing ya
- Iya, kissing tentu ya
- Dan itu disimpen kan pasti di store kan, jadi kita nonton video setengah
- Ya
- Lepas kita tutup, kita buka lagi di page lain
- Kalau misalnya emang login, pasti kan udah ada indikator
- Udah ada historinya ya
- Iya
- Betul-betul
- Nah, terus ngomongin ini, sedikit deh, kita nyerempet sedikit ke accessibility
Gimana tuh kalau video accessible?
- Ya, accessibilitynya video pasti nggak jauh-jauh dari bisa dinikmati sama semua orang ya
- Kalau misalnya dia teman tulis, dia paling nggak video juga setinggal sepatu
- Sepatu, iya
- Sepatu, terus keyboard navigasi nya si video itu memang harus bisa
- Berarti semua tab navigasi tappable bisa dioperasikan tanpa mouse, atau sebaliknya tanpa keyboard
ya pokoknya nggak terpatok ke satu mode throsing
- Ya, macam itu sih, terus apalagi ya
Yang pasti kalau dia, apa ya dibutinya, Tuna Netra, juga Screen Reader Support juga
- Screen Reader Support
- Jadi, ya itu tadi sih, apa namanya?
Apa istilahnya ya, bukannya bisa dinavigasikan dengan baik lah sama si Screen Reader
- Sama semua kalangan, gitu ya
- Sama semua jenis device, misalnya, apa ya?
Kan ada tuh orang yang tifabilitasnya bukan penglihatan atau pendengaran
bisa lihat, bisa dengar, tapi nggak bisa bergerak
Nah, terus mereka tuh pakai, maksudnya nggak bisa gerakin tangan gitu
Buat kita nggak sih yang pakai ponnya kayak headband gitu
- Mata itu?
- Mata atas itu, geleng atau ngangguk, itu tuh mensimulate sama kayak tab event di keyboard
ya tab arrow atau apalah, jadi kalau misalnya, misalnya buat, apa?
Kita mau ngegeser keberapa, kalau itu puduh pakai mouse, ya udah telar
maksudnya orang yang pakai device kayak gitu kan berarti nggak bisa
melakukan itu, jadi kayaknya semua harus di-mapping segala jenis input
- Ya kurang lebih kalau yang penting itu sih, yang focusable komponen harus di-access gitu aja
- Apakah player-player open source seperti Video.js sudah mendukung aksesibility sebegitunya?
Atau masih harus kita custom?
- Sebenarnya sih by default sudah ya
- Sudah ya
- Mungkin itu salah satu alusannya juga ya, karena ya udah misalnya contoh tadi Video.js
ya udah pakai Video.js saja lah, ya udah
- Karena udah mendukung banyak hal ya
- Yang pakai udah banyak mungkin kemungkinan besar di negara-negara
yang udah punya apa sih kayak tukung undang-undang soal aksesibility
jadi apa kemungkinan itu kan udah di-improve lah soal
- Di Indonesia belum ya
- Seberapa ribetnya ngurusin aksesibility kalau di Dailymotion?
- Kebetulan diriku bukan yang ada di sana, bukan yang main developer
yang untuk bikin playernya, jadi kurang tahu untuk yang soal yang itu
cuma kalau misalnya nyerempet sedikit ke hal lain ya
GDPR
- GDPR
- Terutama ini aja sebenarnya lagi ada project
cuman sudah awal tahun yang tadi saya bilang
itu masih di sisi GDPR dan CPK-nya belum selesai
- Oke, iya sih
kita buka website kayak buka aplikasi web atau website gitu
kayak ada pop-upnya dulu mau accept atau deny
terus bisa di-manage juga
- Itu ada 2 komponen, satu ke division legal
pasti lawa ya, hukum juga, terus yang kedua
yang tadi itu ya, allowing beberapa consent gitu kan
itu CMP dan legal yang tadinya diriku kira cuman
ya mungkin kita bisa bikin sendiri, ternyata tidak se muda itu
- Dan karena masing-masing tempat kan sekarang ada aturannya
jadi nggak cuma sekedar kotak, accept atau reject
kan karena orang awam pengen jemput pasti accept
nah sekarang ya tergantung negaranya kayak harus ngasih link
user itu kayak harus dapet project, bukan project knowledge
kayak untuk bisa consent, kan kita harus memahami dulu
nah suka ada aturannya, kata-kata apa, wording apa
maksudnya jadi kayak, jadi udah pop-up, dibuka, pop-up lagi
isinya text panjang, kalau misalnya Anda setujui
ini misalnya akan membuka ke 10 atau 25 atau berapa data Anda
akan di-share dengan 25 pihak eksternal yang fungsinya
nah jadi kayak masing-masing tempat tuh
kayak apa yang harus di-info-in tuh, lain-lain
- Nah itu musing banget - Musing banget
yang musing bukan riba lepernya sih
kalau in this case kalau yang ngalaman ku sendiri
tapi kayak harus ya back and forthnya agak banyak
dan kayak harus proaktif memperjelas
jadi maksudnya apa aja sih yang harus di...
jadi maksudnya biar nggak bermasalah
kayak kita harus dapet input apa dari user
dan input itu terjadi saat apa
nah itunya tuh yang lama
pada akhirnya yang tadinya mau bikin sendiri
akhirnya kita pakai vendor
- Oh iya itu business ya, business yang... - Ya
- Sudah ada vendor-nya ya - Memperbarui gitu
Jadi daripada ribet ngurusin ya satu-satu
mendingan pakai vendor lebih cepat ya
- Ya keliatannya simpel dan cuma konsen - Gampang
dan cuma konsen, oke gitu kan
tapi sebenarnya itu di belakangnya aduh
- Iya, cuma dari sisi ya nggak tahu ya
mungkin bukan ranahnya developer juga
tapi dari segi UI atau UX juga harus diperhatikan kan
kebanyakan pop-up juga bikin user jadi males kan
- Iya, benar - Apalagi yang berkaitan dengan video
atau kita dituntut, kan itu ada kita cari middle ground
kita orang produk pengen jualan
user pengen jualan
developer pengen punya seideal performa
terus punya rapi yang kodingannya bagus, indah
kita di antara segitiga itu harus cari titik tengahnya
- Ngomong sekaligus ini kan
beberapa tahun belakangnya menampilkan konten
yang bukan domain, yang berada di domain yang sama itu kan
sudah tidak sebebas dulu ya
kalau dulu kan tinggal iframe dan lain-lain
kalau sekarang kan harus ada QoRS lah, course, dan lain-lain gitu
kalau nampilin embed video di, apa namanya
mungkin di website pribadika atau di website client itu
ada kendala seperti itu nggak sih?
ngalamin kendala seperti itu nggak sih?
- Ini sebenarnya jadi agak nge-eject sih
skill issue jatuhnya
- Sebenarnya untuk video yang seperti itu
mau nggak mau, kita juga untuk embed ke tiga client
kita embed mereka juga tetap dengan cara yang sama seperti youtube iframe
- Karena di apa sih namanya, semacam di-package
biar styling dan segala macemnya itu nggak bertrok sama root website
- Isi halaman itu
- Oh, ok
kalau boleh tahu si Dalian Mohsin steknya, teknologinya menggunakan apa?
- Kalau di player-nya setau pake React dan teman-temannya
- Oh, standar lah ya
- Iya, standar lah ya
- Dulu, sebenarnya ini baru sih, baru pindah ke sana sih
- Baru ke TS, baru mau migrasi ke TS gitu ya?
- Sudah, sudah
- Oh, sudah, sudah selesai
- Temasuk yang sudah tadi sebelumnya pake framework yang dibuat sama orang-orang twitter
apa namanya, flag apa-apa gitu loh
tapi karena flag-nya nggak continue, akhirnya diganti ke dia
- Oh, kok kirain pake webcomponent, nggak ya?
- Enggak, nggak
- Enggak ya, karena kan ini share, apa namanya, player-nya kan di-share ke client juga
oh, nggak ya, nggak open juga ya
- Gak open juga, script-nya inject itenya
- Oke
- Biar isolated loh, apa namanya si player-nya gitu
- Hmm, iya, iya, iya
Jadi tinggal kasih script, udah bisa ini ya
Oke, oke
Nah, ini ada yang nanya tentang iklan, tapi ini nggak tahu nih
- Yang masih mengikan bidang-bidang kita
- Yang bayar iklan siapa?
- Yang bayar
- Bayar, bayar
- Ini rananya siapa nih?
- Gak, ini sebenernya kalau pengiklan gini
kalau udah ke, seperti Dailymotion dan YouTube sebenernya
- Iya
- Kita ya
- Yang tadi ya
- Tapi deal antara sales dengan si pengiklan gitu
- Hmm
Oke, kalau ngomongin iklan lagi nih
kan kalau misalkan di web gitu kan
iklannya tuh ada yang mungkin di atas, ada yang di tengah
ada yang di kanan, kiri, atau di belakang gitu
jadi in background macem-macem
terus banyak permintaan-permintaan
iya, pengalaman pribadi sih, pernah ngurusin portal berita
kadang-kadang ada iklan yang bikin website-nya jadi lambat
kalau di video, ada nggak sih yang kayak gitu?
Gak ada kan sama video semua
- Nggak, nggak, kebetulan nggak
- Hmm, lebih, justru lebih aman ya dibandingkan web ya
- Nah, tapi ini sekarang
kalau konvensional kan video, eh sorry, iklan kan
waktu video terus cari
sekarang ada yang namanya SSIE
dia, apa namanya SSIE? Apa sih namanya?
kepanjangannya lupa, pokoknya intinya si iklan ini sudah ada
diambil dari sana
jadi bukan request by the client
- Hmm, oh gitu, oke
- Dan beberapa klien sudah request soal ini sih
- Hmm, menarik, menarik
Nah, ini apa nih?
Undang-undang perlindungan data pribadi di Indonesia jadi visitor
ketika masuk ke website harus memahami datanya
- Ada Indonesia kayaknya
- Ada ya undang-undangnya ya
- Ada, ada, ada
- Ada ya undang-undangnya
- Enforce-nya yang belum ya mungkin ya
- Belum, ya belum
- Kita aja, berarti sosialisasinya belum ya
kita aja belum tahu ini
- Nah, kita kan itu apa yang diminta klien
berarti misalnya klien yang di Indonesia
orang-orang yang bikin, misalnya pihak-pihak yang punya pentingan
di web site di Indonesia belum ada yang kita bikinin dia
- Tapi setauku juga ada beberapa negara di Asia Tenggara
juga punya seperti GDPR
bahkan kayak cloning cuman di depan namanya
- Diubah-ubah sedikit
- Diubah-ubah sedikit untuk karyanya
- Oke
- Apa lagi ya
- Bahasa apa lagi
- Kalau cookies, itu kan iframe ya
berarti itu nggak nge-set cookies apapun dari sisi videonya kan ya
- Nggak, kalau misalnya memang ada kebutuhan seperti itu
ya itu tadi, diri kula yang bergerak untuk bikin custom script
biar cookiesnya ada
- Karena kan beda origin kan
kecuali interaction videonya sendiri ya
di click mirim atau di cepetin atau di text atau apapun
ya kan itu interaksi
tapi kalau nge-set cookies, tracking cookies, gimana-gimana
- Nggak, ada yang menarik soal interaction
kadang ada beberapa kasus yang apa namanya ya
macam klien minta kalau "Aku nggak mau videonya jalan dulu"
- Nggak bisa di pause
- Nggak boleh di pause
- Ada kasus seperti itu yang kadang-kadang memang memerlukan beberapa device
memerlukan user interaction dulu entah tab, entah apa, pokoknya
dan itu ada beberapa klien yang nge-yel untuk
"Loh, kok videonya seperti ini sih, kok nggak seperti itu"
"Ya, ini perlu interaction, user interaction dulu"
"kalau nggak, nggak bisa jalan"
- Oke
- Nah, itu harus mengedukasi, nggak bisa melawan OS
- Iya, nggak bisa
- Nggak bisa melawan browser
- Nggak bisa melawan aturan browser, pokoknya nggak bisa melawan
- Browser, iya
- Ya, berarti mereka belum dapat konsepnya itu ya
mereka kira itu sebagai player yang terpisah gitu ya
atau aplikasi terpisah ya
- Ya, ya
- Kecu juga ya
Oh, berarti menangani klien-klien yang seperti itu juga ya
pokoknya saya mau ini tombol play-nya di atas gitu
kalau yang itu masih bisa
- Masih bisa lah ya
- Tapi kan nggak bisa overwrite behavior browser
ataupun OS, tapi kan kalau klien yang bukan programmer ya
kalau lebih terlihat
- Nggak peduli kan
- Nggak peduli
- Akhirnya edukasi dulu
- Oh, tetap ada proses edukasi lah ya
- Iya
- Mau ini video player-nya terbang-terbang gitu
jalan-jalan, buat apa?
- Tep-nya ditutup, videonya tetap nempel ke luar
- Ya itu dari pikir-in-pikir ya
- PIP
- PIP
- Ini juga sebentar ini, nggak tahu ya
nggak atau nggak, cuman misalnya di...
terutama untuk di device Android dan iOS
itu mereka kalau player yang kita gunakan untuk muntah video
itu sebenarnya player native yang ada di device itu
- Di OS-nya
- Jadi tampilannya bisa berubah-ubah ya, bisa beda-beda
- Bisa berbeda
- Kadang-kadang yang kelihatan banget kalau tampilannya berubah itu
kalau misalnya kita fullscreen
- Oh, fullscreen
- Fullscreen itu button-button itu kayak button-button native-nya si player-nya
- OS-nya ya
- OS-nya itu jadi muncul lagi
- Kalau di produk Apple, jadi estetik
kalau di Android atau iOS, jadi agak harus
- Oke
Ada lagi challenging-challenging yang pernah ditemui pada saat develop
atau pada saat nama klien?
- Kalau sekarang sih ngerasa sudah punya banyak library
jadi nggak terlalu challenging sebenarnya
- Nggak terlalu, iya
- Cuman kalau misalnya bicara pengalaman ya
paling parah itu ya sebenarnya kalau udah kemasalah si behavior sih
kayak browser A itu boleh diperbolehkan untuk muntah video dengan audio
di-browsering, A, 50/50, jadi semacam harus ada sesuatu dulu
biar bisa kelihatan semacam itu
- Kalau untuk nampilin video, browser mana yang paling sulit?
- Permisif
- Gimana? Bisa dibilang?
- Browser untuk nampilin video, browser mana yang
paling permisif, kirain malah paling yang paling gampang
- Paling sulit dan paling gampang lah ya
- Yang paling sulit untuk, yang terutama behavior ya
jatuh kepada safari
- Safari
Kenapa? Yang paling sulit ya? Apple-nya ya
karena nanti klien-nya kan punggungnya si OS
jadi kalau misalnya kita pakai video.js, kalau misalnya kita pakai video.js
video.js-nya kadang-kadang juga belum 100% menguasai
jadi ya itu tadi, sempat ada isu, jadi semua browser aman
tiba-tiba ada report, kalau di safari nggak jalan
- Aduh
- Oke
- Oh iya iya iya bener bener bener, pernah halamin
- Sekarang kalau mau misalnya mau beli laptop baru atau minta device baru
aku selalu minta apa namanya?
- Karena ada safarinya
- Bukan karena gaya-gaya, cuma karena yang ada safarinya cuma dia yang bukan
terus di tes ya iya iya iya
bukannya safari ada di Windows ya?
- Sudah nggak
- iTunes ya, iTunes yang ada di Windows, safarinya nggak ada ya
- Safarinya sudah nggak dulu, dulu sempat pasti
- Udah nggak, dulu sempat ada kan ya?
- Iya, ada ya, pernah
- Iya, pernah ada ya, hmm
itu mungkin behavior-nya beda lagi ya
- Ini kalau di iOS safarin begitu, kalau di Chrome sebenernya
Android sebenernya player-nya adalah yang dipunya sama Chrome
jadi apapun apa namanya ya, browser misalnya
- Kayak stop browser yang browser bawaan HP itu juga pakai Chrome-nya
- Iya, jadi player-nya kalau mau nggak mau juga pasti akan mengikut si Chrome juga
- Mengikuti
- Untungnya sih gini, untungnya si Chrome ini menurutku ya itu lebih friendly ketimbang yang lain
- Safari, oh jadi si iOS kan kalau iOS semua browser itu adalah safari-based kan ya
sampai saat ini ya - Iya
- Iya sampai saat ini, katanya bakal berubah tapi nggak tahu
kalau di Android kebalikannya, Chrome semua gitu
- Chrome semua, apapun merepnya
- Meskipun Firefox itu juga sebenernya Chrome
- Video player-nya kan, kalau renderer-nya, kali oi renderer-nya
- Kira-kira lebih open si Android, enggak ya?
- Enggak juga
- Oke, baru tahu nih, kirain si Android lebih demokratis
terlihat nggak juga ya, berpikirnya gitu
tapi ternyata setelah ada masalah dan segala macemnya, ternyata Chrome lagi
- Chrome juga ya, istinya Chrome-Chrome juga ternyata ya
oh oke, oke
iya, iya, iya, iya, wah menarik ya, baru tahu ini infonya
dari teman-teman ada yang mau ditanyakan lagi, kita sudah kehabisan bahan
- Oh, ada lagi testing, jadi kayak selain testing device
kayak misalnya unit test atau end-to-end testing-nya
itu kayak testing React App biasa atau malah nggak ada sama sekali?
- Ada yang berbeda
- Kalau di, aku sejak sebelum, bahkan sebelum di Dailymotion itu sebenarnya saya kerja di kompetitor
itu kita beneran kalau testing, testing di manual ya
tapi kita ada semacam test case banyak banget, kita harus terperlu di semua
karena sempat kita pakai automated test, kayak semacam ada kelopasan
akhirnya test-nya manual, bahkan kalau misalnya test di device
kita tancapin device-nya itu ke laptop, terus kita dibug di situ
- Oh, untuk device yang sifatnya kayak TV yang stick gitu, atau gimana?
- TV atau HP?
- Oh, HP
- Banyaknya kalau Chrome dan Firefox bisa dikonekin ke HP gitu
- Oh, ya ngerti, buat dibugging ya
- Tapi biasanya kalau yang sampai dibugging ke device beneran itu
kalau case khusus itu mungkin kalau normal itu nggak sampai ke test
- Kalau misalnya sifatnya eksternal nih, bukan folding-nya sendiri
cuman kayak misalnya apalah ke lokasi gitu kan, lokasi yang berbeda
ada konten yang berbeda, itu kayak di spoofing pake VPS atau gimana?
- Iya itu ada, kita disupport juga VPS, terus kita juga browser testing itu
- Oh, browser testing
- Kita juga pakai itu juga
- Jadi testing-nya itu yang otomatis ada, yang manual juga ada
tapi yang otomatis nggak terlalu, bukan yang behavior ya
- Tetap manual, itu yang ngerjain developer atau ada tim QA?
- Kalau yang itu, yang bagian si playernya ya, saya kurang tahu
cuman kalau yang di division yang di SC Pacific ini, ya developer sendiri jatuhnya
- Oh, developer sendiri yang melakukan manual testing tadi
tapi test case-nya udah ada ya, udah disiapin ya?
- Disiapin
- Kalau implementasi PIP gitu ribet nggak sih? Tadi udah sempat dibahas sedikit ya
dari OIS-nya udah ada
- Mohon nggak perlu diapa-apain
- Ada keputingannya tapi dikit
- Bisa di-custom makanya
- Semua elemen video bisa PIP
kayak YouTube pun sebenarnya bisa, tapi harus diklik kanan dua kali
karena di heightened sama dia
kalau diklik kanan sekali itu dia menu-nya YouTube kan
bukan menu OS atau menu browser-nya
- By default bisa, terus kita bisa tambahin button sendiri apalah buat minimize
atau trigger IP-nya
kalau emang di-support
- Ada API-nya ya?
- Kayak kadang-kadang ada kalanya kalau browser error nggak muncul juga
- Oh iya, kalau ada browser error jadi nggak muncul ya, jadi hilang ya
- Karena kalau ada error dia berhenti, nggak lanjut
ya kalau ada error kan udah nggak lanjut ke bawah kan
proses coding
- Oke, Eka ada lagi yang mau ditanya kan?
- Nggak ada, oke, kalau nggak ada, terima kasih Mas Yudi
ada yang mau disampaikan lagi terakhir?
- Terakhir mungkin ini ya, apa namanya, teknologi
ini aja sih, mungkin kayak apa namanya, conclusion lah ya
teknologi HTML
itu sekarang sudah by default sudah bisa support media
video, audio, dan segala macemnya
cuman kalau memang ada kebutuhan khusus
memang, apa sih namanya, kebutuhan khusus yang banget
yang custom sekali ya, kalau bikin native-nya
apa namanya, momentnya HTML
ya akan perlu banyak kerjaan
jadi kalau bisa menggunakan yang
yang stereo atau video JS atau
dan turunannya itu akan sedikit memudahkan hidup kita
- Dan itu berlaku untuk segala bidang sih ya
mirip-mirip kayak UI pompong, CSS
kita harus paham fundamental ya
cuman kalau butuh yang common use case ya
pake yang DND lah
- Bahkan elemen videonya sendiri
yang vanilla HTML, bawaan dari HTML-nya pun
kalau kita mau customize
misalkan button-nya di gedein kah
atau di warnanya agak diubah
itu juga tidak sesulit
mungkin tidak sesulit dulu ya
kalau sekarang lebih gampang lah
kalau nggak mau pakai library ya
- Oke, mungkin untuk malam ini segitu dulu
Mas Yudi, terima kasih banyak
kalau ada teman-teman yang mau kontak
biasanya aktifnya dimana nih?
- Kalau saya di Twitter
@isa_trio
suka sitposting sebenernya sih
dan kritikum merintah
- Kritikum merintah
Oke, gas!
- Oke, gas!
- Ini kapan-kapan seru nih kayaknya
menjelurin sama Imre
- Wah, bahaya ini
- Terus channel Youtube gue dihidupkan
Ya, kita udah mau udahan Mas Yudi
eh, Mas Yuda baru join
nanti di-replay aja nonton
kalau ada yang mau ditanyakan
boleh di-komen aja nanti
kalau emang pertanyaan yang berhubungan
dengan Mas Yudi nanti saya akan sampaikan
Oke, untuk malam ini segitu aja
terima kasih banyak buat semuanya
terima kasih banyak buat Mas Yudi yang udah mampir
lain waktu nanti kita undang lagi
untuk membicarakan
mungkin lanjutan atau
bukan pemerintah
topik yang lain ya
sampai jumpa
di minggu depan
selamat malam, bye bye
Deskripsi asli dari YouTube
Yuk mari kita diskusi dan ngobrol ngalor-ngidul tentang dunia web. Agar tetap up-to-date dengan teknologi web terkini. Topik, tautan dan pertanyaan menarik bisa dilayangkan ke https://ksana.in/ngobrolinweb Kunjungi https://ngobrol.in untuk catatan, tautan dan informasi topik lainnya.
Episode Terkait
15 Jan 2025
Ngobrolin Video Singkat bareng @dannydwic
Episode Ngobrolin WEB ini berbincang dengan Dhani Dwijaya Putra, seorang software engineer di Hijra sekaligus konten kre...
4 Sep 2024
Ngobrolin Buku Halo Koding
Episode ini membahas buku "Halo Coding" karya Hilman, sebuah buku yang membahas dunia pemrograman dari sisi manusianya, ...
3 Jul 2024
Ngobrolin Elixir
Episode ini membahas tentang Elixir, bahasa pemrograman fungsional yang berjalan di BEAM (Erlang Virtual Machine), bersa...
Suka episode ini?
Episode baru setiap Selasa malam. Dengarkan lewat YouTube, Spotify, atau feed podcast favoritmu.
Memuat komentar dari GitHub Discussions...
Jika komentar tidak muncul karena ekstensi privasi / adblocker, kamu bisa berdiskusi langsung di GitHub Discussions .