EP 70

Ngobrolin Interop 2024 - Ngobrolin WEB

Bagikan:

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 ----------------------------------------------------------------------------------- Bergabung menjadi anggota elit di kanal ini: https://www.youtube.com/channel/UCHhAlFGFCGgIusQkQIqJLYw/join Donasi dapat meningkatkan kualitas kanal ini: 💰 https://karyakarsa.com/rizafahmi/tip 💸 https://saw Kunjungi https://ngobrol.in untuk catatan, tautan dan informasi topik lainnya.

Ringkasan Episode

Bantu Koreksi

Episode ini membahas Interop 2024, sebuah inisiatif kolaboratif antara empat browser mayor (Chrome, Edge, Firefox, dan Safari) untuk meningkatkan interoperabilitas web. Interop 2024 adalah kelanjutan dari Interop 2023 yang telah dibahas sebelumnya, dengan tujuan utama menyamakan perilaku fitur-fitur web platform di berbagai browser sehingga developer tidak perlu lagi melakukan workaround atau "akal-akalan montir" untuk mengatasi perbedaan implementasi antar browser. Proyek ini dimulai dari riset oleh WebDX Community Group yang mengumpulkan masukan dari developer melalui survei dan GitHub, kemudian diimplementasikan melalui Web Platform Test (WPT) dengan pendekatan test-driven development di mana semua browser menjalankan tes yang sama untuk memastikan konsistensi. Dalam episode ini, tim membahas berbagai fitur yang menjadi fokus Interop 2024 termasuk JPEG XL, View Transitions, Popover API, Textual Balance, Pointer and Mouse Events, CSS Nesting, dan berbagai fitur lainnya. Menariknya, tahun ini Edge memiliki kolom tersendiri dalam dashboard Interop, menandakan bahwa mereka sudah mulai forking dari base Chromium dan mengembangkan engine sendiri. Episode ini juga menyoroti pentingnya backward compatibility dan accessibility dalam pengembangan web platform, di mana ratusan ribu test case dibuat untuk mengakomodasi berbagai skenario termasuk bahasa dengan arah teks berbeda (kanan-ke-kiri, atas-ke-bawah) serta berbagai perangkat input dan assistive device. Diskusi juga mencakup progres implementasi masing-masing browser, dengan Safari sering kali memimpin dalam beberapa fitur sementara Firefox tertinggal namun memiliki skor eksperimental yang baik.

Poin-poin Utama

  • Interop 2024 adalah inisiatif kolaborasi antara empat browser mayor (Chrome, Edge, Firefox, Safari) untuk meningkatkan interoperabilitas web dan mengurangi perbedaan implementasi antar browser
  • Proyek ini menggunakan pendekatan test-driven development melalui Web Platform Test (WPT) di mana semua browser menjalankan test suite yang sama untuk memastikan konsistensi perilaku
  • Fitur-fitur yang menjadi fokus Interop 2024 antara lain JPEG XL, View Transitions, Popover API, Textual Balance, Pointer and Mouse Events, CSS Nesting, Custom Properties, dan lainnya
  • Tahun ini Edge memiliki kolom tersendiri dalam dashboard Interop, menandakan bahwa mereka sudah mulai forking dari base Chromium dan mengembangkan engine sendiri
  • Progres implementasi bervariasi antar browser, dengan Safari sering memimpin dalam beberapa fitur seperti HTTPS URL untuk WebSocket, sementara Firefox tertinggal dalam stable release namun memiliki skor eksperimental yang baik
  • Web Platform Test mencakup ratusan ribu test case yang sangat detail, mengakomodasi berbagai skenario termasuk bahasa dengan arah teks berbeda, berbagai perangkat input, dan assistive device untuk accessibility
  • Interoperability penting untuk developer karena mengurangi kebutuhan akan workaround, mempercepat adopsi fitur baru, dan memudahkan pengembangan library serta framework web
  • Proses seleksi fitur untuk Interop melibatkan survei developer, diskusi di GitHub, dan voting oleh komunitas untuk menentukan fitur yang paling penting dan paling bermasalah dari sisi interoperabilitas
Transkrip Bantu Koreksi

0:00Halo halo halo selamat malam selamat malam ketemu lagi dengan kita bertiga di Selasa malam

0:23waktunya ngobrolin ngobrolin eh bisa kompak eh sudah udah udah bagus soundboardnya udah udah

0:37dong udah diperbaiki gimana kabarnya mudah-mudahan teman-teman sehat-sehat semua seperti biasa kita

0:45bertiga lagi, dengan format bertiga

0:48ada Ivan, ada Eka, dan ada

0:51saya Riza

0:51untuk

0:54episode ini tayang di tanggal

0:5720 Februari

0:59walaupun ini

1:00edisi rekaman, lagi-lagi rekaman

1:03kalau kemarin karena ada

1:05narasumbernya jauh

1:07di belahan dunia yang berbeda

1:08kali ini kita

1:11rekaman karena kita tiga-tiganya

1:13gak bisa besok hari Selasa

1:14jadi terpaksa kita rekaman

1:17mudah-mudahan minggu depan kita bisa live lagi ya

1:19ada meeting bersama ya

1:22meeting bersama

1:23oke

1:27nah malam hari ini

1:28kita akan, mumpung masih ini ya

1:30masih bulan Februari kan, masih awal tahun ya

1:33jadi

1:34kita akan coba

1:37bahas tentang

1:38ini kayaknya masih masuk preview ya

1:41preview yang waktu kita

Lihat transkrip lengkap

1:43awal tahun kemarin ini preview tapi versi bukan preview apa ya ini kalau yang kemarin itu kan

1:51kita jadi ibaratnya memprediksi kalau yang kali ini itu seperti bukan lebih prediksi lagi sudah

1:58sudah kejadian kemungkinan-kemungkinan besar akan arahnya ke sana kemungkinan besar sudah

2:05tindakan nyata

2:06selanjutnya

2:09perkembangan web itu akan

2:11mengarah ke sana

2:12tinggal disesuaikan dengan

2:14base masing-masing browser

2:16sanggup gak menyelesaikan

2:18feature-feature ini

2:22feature-feature yang akan dibawakan

2:24tapi sudah disepakati bersama

2:264 major browser

2:28sudah sepakat

2:29ini hal yang akan kita develop bersama

2:32di 2024

2:33Namanya adalah Interop 2024

2:37Kita pernah bahas ya di episode 22

2:43Nah ini dia reviewnya, kita melihat foto kita sendiri

2:48Di tahun 2000 lalu

2:51Ini kita bahas tentang Interop 2023

2:56Dan malam hari ini kita akan bahas tentang Interop 2022

3:02dua eh 2002-2004 ya mungkin buat penyegaran setiap awal tahun emang di-announce nah buat

3:14penyegaran ada yang bisa menjelaskan nggak tentang apa itu intro ini apa sih

3:21topik-topik topik-topik

3:24antar browser jadi salah satunya si project interop ini jadi apa vendor 3 vendor browser

3:39menjelaskan empat ya sekarang sekarang jadi 4 sudah 4 Chrome Edge Firefox sama Safari itu

3:50kerjasama untuk jadi gambaran besarnya adalah mengimprove meningkatkan interoperabilitas

3:56of the web apa itu interoperabilitas yaitu ke di setiap browser sama karena selama ini kan

4:03semuanya kalau webdev itu beda-beda sama UI males kalau misalnya CSSnya begini itu sering

4:11ada apa sih hacknya yang depannya ada prefix harus di dash webgit mungkin temen-temen yang

4:17sekarang udah nggak ngejamanin ya tapi dulu banyak banget workaround yang kayak gitu kalau sekarang

4:23sudah pakai post CSS jadi sudah otomatis apalagi pakai Tailwind nggak berasa ya

4:30ya ya ya pokoknya dulu orangnya menurut apa karena orang zaman dulu Enggak dulu banget Antara browser itu bukan cuma CSS tapi misalnya web API yang javascript juga kadang ada beda tipis lah behaviornya

4:49Atau misalnya kalau CSS paling banyak behavior collapsingnya atau apa dan kadang itu hal-hal yang kecil loh.

4:54jadi kita nggak langsung tahu waktu dites nggak muncul nanti tiba-tiba di production ya ada yang

5:01komplain di Firefox atau di iPhone tiba-tiba beda jadi itu stigma nya sekarang terus kan orang itu

5:09kan kurang bagus buat perkembangan web secara umum jadi nggak bagus buat mereka sih semua

5:14stakeholder itu juga makanya dibikin kayak kesepakatan ya udah kita bikin project bersama

5:19yang tujuannya membuat, ya ngompakin lah, ngompakin cara kerja fitur-fitur web platform di masing-masing browser.

5:29Nah, terakhir yang di kanan itu how, bagaimana.

5:32Nah, jadi di awal, jadi sebenarnya bukan bagian langsung dari proyek ini,

5:37ada yang namanya research, research dari community group yang namanya WebDX Community Group.

5:44Jadi, bentuknya macam-macam. Jadi, kayak ada yang paling public itu ada GitHub-nya,

5:49kayak bikin apa ya bikin isu gitu lah buat developer pada voting fitur apa yang buat mereka paling penting

5:59dan kelihatannya behaviornya diantara browser tuh kayak masih kurang.

6:04Terus ada riset mungkin teman-teman juga sering denger atau sering lihat kan kita developer suruh misi-misi

6:11survei-survei begituan lah.

6:13Survei developer, terus secara publik ada GitHubnya, ada diskusi-diskusinya juga ya gitu.

6:20Nah terus itu kan sebelum, selama proyek berlangsung itu dijalannya di yang namanya proyek lain yang namanya web platform test.

6:31Oke.

6:32Web PT tampilannya kayak gini nih sekilas.

6:34Ini dashboardnya, nah fokus area itu yang di kanan ya bisa dilihat tuh ada item-itemnya.

6:40Jadi berdasarkan hasil survei di awal tadi, seluruh browser ini sepakat kita ngerjain ini, ini, ini, border image, color space function, blablabla.

6:52Terus angka-angka itu dari mana tuh? Nah itu dari tes yang toping. Jadi ini bisa dibilang kayak test driven development lah.

7:02Jadi mereka semua sepakat bikin tesnya.

7:11Menjalankan tes yang sama gitu ya?

7:13Tesnya sama. Jadi kan sebenarnya browsernya beda, programnya juga, codingannya juga beda kan masing-masing browser itu gak masalah.

7:22Yang penting tesnya passing.

7:24Bagi teman-teman yang ingin mengerti lebih dalam,

7:29Jadi sebenarnya dari sisi web consortium itu, web specification, namanya web specification, web API specification,

7:38itu hanya dokumentasinya itu hanya menyatakan sebuah feature, behavior-nya seperti ini, expected-nya bagaimana,

7:49terus kemudian fitur itu untuk apa, itu yang ada di API documentation-nya.

7:55Sedangkan bagaimana implementasinya di browser, implementasi secara coding ya, secara codenya, itu tiap browser beda-beda.

8:07Beda-beda. Karena engine-nya berbeda. Contohnya kalau di Chromium Base itu kan engine-nya Blink.

8:14Kalau di Firefox pakai Gecko engine-nya. Rendering engine ya, sini maksudnya.

8:20Rendering engine-nya.

8:22Dan Safari pakai WebKit.

8:24Dan itu benar-benar beda arsitektur, beda code base.

8:32Jadi supaya kita sebagai web developer itu punya kesamaan, contohnya mau pakai border image.

8:43Saat dirender di Safari ataupun saat dirender di Firefox harusnya sama.

8:50Kodenya sama, harusnya hasilnya sama.

8:52nah itu maksudnya Project interop ini jadi dari sisi developer nggak usah mikir lagi nih border

8:59image di Safari tuh harus diginiin di Chrome harus digimanain ya udah biar selalu ada lagi

9:06akal montir nah ini persentase passing test tadi udah dibahas nah terus kenapa ya kemarin Oh kita bisa lihat ini temen bisa lihat di wpt fyi itu web platform test kita bisa lihat

9:25tuh tes kesehatan ini enggak pakai framework eh up react atau apapun ini tes kesenya itu menak

9:33ini hal yang paling menarik sih buat gue bahwa test case-nya HTML CSS JavaScript biasa beneran

9:40itu bisa dibuka file-nya langsung jadi ini contohnya nih kita ngeklik container queries

9:45terus muncul tuh semua test case-nya apa test suit lah semacam test suit dan itu banyak hal-hal yang

9:54kita kayaknya nggak mikirin kayak misalnya container queries kalau di-animate kan parent-nya bisa

10:01berubah tuh ukurannya terus gimana dong Nah itu tuh para para pembuat browser itu mengantisipasi

10:09berbagai skenario dan mereka mensepakati apa expected nya harusnya kayak gimana ya kalau

10:16tertarik bisa dilihat sendiri ini kan 2023 nih contohnya karena ini slide dari tahun lalu nanti

10:23kita bakal lihat yang 2024 nah terus bagi apa gunanya buat kita developer ya itu tadi udah

10:31dibahas sama Ivan juga yang pertama ngurangin akal-akalan montir jadikan ya udah coding-nya

10:38sekali konsisten di semua browser yang kedua ya dari sisi user juga kan mengurangi bak performanya

10:45lebih bagus karena enggak ada akal-akalan montir seperti tadi nah yang ketiga nih yang agak

10:51yang kita nggak terlalu notice jadi biasanya kalau udah fitur-fitur baru walaupun kita tahu ada

10:57fitur baru kan kita males kan kita ragu-ragu karena kita mikir ah jangan-jangan belum disupport atau

11:03belum disupport dengan baik atau konsisten di semua browser kita males developer males mengadopsi

11:09fitur baru nah mau mengurangi mengurangi cenderungan seperti itu juga dan yang keempat ya ekosistem

11:16library framework seperti Halloween atau apa juga majunya lebih cepat karena kayak kita bahas kita

11:24bahas kapan ya kemarin deh minggu lalu atau minggu lalunya lagi ya pokoknya kalau misalnya udah

11:31stabil di semua browser library seperti tailwind juga akan mengintegrasikan fitur-fitur mereka

11:37jadi ya semua terbantu yang kira-kira planningnya juga lebih jelas kan ya jadi misalkan kita bikin

11:46library seperti telwin poh ini view transition nih bentar lagi nih kita siap-siap atau gimana

11:52gitu kan jadi bisa diantisipasi dengan lebih cepat ya oke nah terus juga ini apa ada ada

12:02prosesnya tuh kayak gimana ya katanya ada food food gitu ya ada-ada macam-macam sih ada yang

12:08dari kek tadi developer survey jadi ngisi survei ada yang dari GitHub repo coba enggak reponya

12:17kalau ini kalau enggak salah ya dari GitHub repo nih tuh ada kalau diklik dia akan menuju

12:24ke github.com slash web platform test slash interop jpg XL apa itu jpg XL kita udah sempet

12:34ya udah sempet kita ngobrol tadi di belakang layar ya Jadi dulu kan Iya dulu kan yang

12:42support sama browser kan hanya PNG, JPG, SVG, sama BMP mungkin ya

12:50nggak tau BMP

12:51GIF ya

12:57nah kemudian kan muncul kan ini WP, AFIF, terus apalagi tuh macam-macam yang baru-baru

13:04nah pada saat Google Chrome mengeluarkan AFIF

13:08AFIF apa AFIF ya?

13:09ya itulah pokoknya ya

13:10AFIF ya

13:12mereka ngedrop support untuk JPEG XL

13:16oh iya iya

13:18untuk sebuah alasan

13:19entah alasan apa ya, kita gak tau ya

13:23entah alasan apa, dia ngedrop JPEG XL

13:26jadi gak bisa tuh di Chrome

13:27padahal menurut pengakuan beberapa orang

13:33JPEG XL itu katanya lebih optimis, lebih kecil dibandingkan A5

13:38entah kenapa sih, Chrome gak mau

13:41kita nggak tahu, nah

13:43uniknya di Interop 2024 ini paling tinggi vote jadi ada kemungkinan iya ada kemungkinan Chrome akan mengendap si ulang lagi si JPEG XL ini

13:57dia kan belum tentu

14:00tapi

14:00boleh vote-nya

14:03betul, berharap ya

14:04coba lihat

14:07reponya lagi deh

14:09itu tadi yang ada vote-nya

14:12nah, lihat issues-nya

14:14ini isu nih kegedean itu berupa isu Oke ini ada ada ada thumbs up thumbs down nya tututu

14:25600 ini berapa di sini 400 belum di update ya ini kan blog post ya blog post 400 cuman

14:39popular dan bawahnya orang ngobrol apaan komentarnya

14:43please make the case here this issue is what will be considered and discuss

14:50is itu bisa bikin isu terus bilang Kenapa itu penting ya ini nih ini di sini bisa di highlight

14:59nih blablabla salah satu yang menurut dia baguslah gitu ya argumennya kenapa ini perlu

15:07diutamakan, dimasukkan ke project interop. Karena kan nggak mungkin semua fitur baru langsung sekaligus segamring masukin interop kan harus ada pilih beberapa untuk prioritas.

15:21Betul, makanya ini juga interop juga salah satu cara untuk si browser developer untuk prioritas.

15:31Menentukan prioritas kan apa yang banyak dipakai dan penting buat developer.

15:35betul itu terus yang lain apa isinya coba lihat view transition kalau nggak salah yang kedua nih

15:45transition level 1 ini juga cukup banyak betul maksudnya level 1 level 2 karena topiknya iklan

15:53gini di air extended udah dibahas ya tapi ya boleh diulang sedikit lah ya transition itu intinya

16:00bikin animasi dari satu yui state yui state lainnya yui state itu kan bisa macam-macam ya

16:09kita ngeklik tombol muncul model atau muncul apalah membuka kartu itu lebih handle di level

16:16satu client-side jadi client-side navigation juga misalnya kita punya SPA single page app

16:24ya atau misalnya kita pakai framework yang punya client-side router semacam

16:29Swellkit atau Next.js itu kan kalau client-side kalau JavaScriptnya aktif

16:34dia meng-hijack kan maksudnya kalau kita nge-click suatu link yang jalan adalah

16:39yang meng-intercept click eventnya adalah client-side routernya Next.js misalnya.

16:45Nah itu view transition yang level 1 meng-handle yang di client-side.

16:50tapi yang level 2 akan mengendal yang server-side alias link hyperlink biasa ah rev bla bla bla

16:57kalau saya mau region itu bisa langsung ada animasinya nah yang sekarang cuma yang level

17:041 yang level 1 udah lumayan mateng lah di Chrome udah shipping vendor browser lain walaupun belum

17:11shipping sudah menyatakan persetujuan mereka udah bilang Oh ya boleh deh kapan-kapan kita

17:17adopsi walaupun belum cuma kalau yang level 2 masih belum ada kesepakatan seperti itu masih

17:24digodok jadi yang makanya itu kenapa yang dipropos untuk interop 2024 ini adalah yang

17:31level 1 yang udah shipping dan browser semua browser lain juga udah bilang Oke lah tapi

17:38tapi tidak terpilih nih tulisannya

17:41developer berusaha

17:45para browser vendor menentukan

17:48eh kalau yang tadi diterima gak ya?

17:52jpxl ini

17:53jpxl terima ya?

17:55ada gak jawabannya?

17:57oh paling bawah ya?

17:59cus

17:59opulichrome reconsider

18:02ininya coba lihat

18:06wpt.impro

18:08ya dia ininya apa namanya si yang balasnya yang balasnya kata-katanya aja kata-katanya aja itu itu

18:28Deskintrop coba coba cari

18:29Oh Dash

18:30Tadi titik

18:32Ada nih

18:34Sama

18:35Ini bot ini kayaknya ya

18:38Kata-katanya sama

18:41Tidak ya

18:43Oh iya sebelum kesana

18:44Di klik dong

18:45For an overview of our process

18:48Si proposal selection

18:50Oh prosesnya ini dia tanyaannya

18:52Kalau temen-temen pengen

18:55Tahu prosesnya seperti apa

18:57terus tadi kan kita sempat nanya juga tuh

18:59gimana cara milih

19:00fitur boot fokus areasnya

19:03nah jawabannya ada disitu

19:04iya jadi

19:07udah decide ya

19:09Desember 1 sampai 14 ya

19:11udah selesai ya

19:12di announce nya di Januari

19:14nah tapi sebelum kita lanjut lagi yang menarik

19:17menarik menurut kita

19:18ini ada yang baru nih dari

19:20si intro 2024

19:23walaupun tadi udah sempat dibahas

19:25sedikit 2023 kan

19:27si Chrome sama edge itu jadi satu ya deketan gitu ya karena dia premium bisnis bukan Iya jadi baru

19:35jadi kolomnya cuma satu woi ada chromium kan kolomnya satu kalau sekarang kolomnya satu jadi

19:43sekarang it punya kolom sendiri ya berarti artinya ya kita enggak tahu ya kita enggak tahu layout

19:52engine yang berbeda sudah berbeda lihat aja contohnya berbeda di diseksi layout ya lihat

19:59beda-beda beda-beda saat ini si itu udah nge-porting dari bling mulai forking ya sudah

20:12sudah beda

20:14apa yang terjadi disini

20:18wah seru

20:20seru

20:22age is a new chrome

20:24buat informasi juga kan

20:26kayaknya minggu lalu ya

20:28sempet kita bahas, walaupun mungkin

20:30gak dibahas di waktu rekamannya

20:32waktu di belakang layar mungkin ya

20:34kalau gak salah

20:36si webkit itu kan

20:38dari

20:40KDE kan dari Linux kan

20:41K-Browser

20:44namanya kan. Habis itu

20:45engine-nya namanya WebKit. Habis itu

20:48WebKit ini dipakai sama

20:50Safari.

20:52Iya dan kemudian

20:53setelah dipakai sama Safari di-forb

20:55jadi Blink akhirnya jadilah Chrome.

20:58Iya kan?

21:00Jadi ini juga

21:01ada kemungkinan kenapa ini dipisah

21:03ada kemungkinan si

21:05Edge ini bisa

21:06memodifikasi

21:09mungkin base-nya sama

21:11basisnya sama, sama-sama Chromium

21:13tapi dia memodifikasi mungkin ada beberapa hal

21:15yang dioptimize atau ada yang dikurangin

21:17ada yang ditambahin untuk

21:18optimasi disesuaikan dengan

21:21mungkin OS-nya ya, Windows gitu ya

21:23jadi lebih optimal, akhirnya

21:25menjadi

21:26engine tersendiri yang sedikit berbeda

21:29dengan Chrome, mungkin

21:31karena kita tahu juga

21:35udah pasti ya

21:36kalau sudah beda hasilnya coba eksperimentalnya Iya sih eksperimental

21:42Chrome kanaris sama HD itu beda berarti ada minimal berarti mereka kan sudah nge-forking

21:55sudah punya repot sendiri ya ngedevelop something dan mereka belum belum ngambil

22:00request gak ngambil lagi mereka enggak ngirimnya enggak enggak ngebackport lagi berarti mereka sudah

22:08jalan sendiri mereka enggak enggak Fetch lagi ya enggak enggak pulang enggak full dari chromium

22:13ya bisa aja mereka nge-pull lagi cuma mereka jadi mereka ngambil update-an chromium kan bisa aja dan

22:22bisa aja tapi yang mereka develop tambahan bumbunya mereka sendiri itu enggak di enggak

22:28dising enggak di push ke chromium ya bumbu mereka ya buat mereka sendiri aja jadi bisa

22:35bisa jadi bisa jadi tapi bisa jadi kan sama-sama opens baik sebelum saya ngomong saya enggak tahu

22:47open source itu open source apa enggak nggak tahu juga sama nggak tahu harusnya

22:52enggak deh premiumnya yang open mungkin engine-nya Iya tapi edge-nya enggak

22:58coba googling secepatnya dulu ya jangan lah bing bing bing oh microsoft edge

23:12seems like open source

23:16why kenapa kenapa kenapa seperti open source

23:22karena belum tahu bener nggak

23:25Oh itu ada ininya itu ada film paling atas jadi Microsoft Edge ya MSH ada GitHub nya tapi itu cuma

23:37license doang belum bukan iya ya nggak biar berhubungan atau lalu ada search code browsernya

23:43ini apa MSH cuma kayak Oh license update-nya 4 tahun lalu web view-nya enggak ada enggak tahu

23:53mana enggak ada tuh makanya saya bilang saya enggak yakin Iya ini kan Microsoft juga melakukan enggak

24:02tahu ya Apakah melakukan hal yang sama dengan Facebook Facebook kan sebenarnya open source

24:07source bisa dilihat tapi yang kita pakai yang sudah dikompilasi itu beda-beda ya sama dengan

24:17yang aslinya kromium

24:19betul betul betul

24:20aslinya kromium

24:23yang open source itu kromium

24:25bukan google krom

24:26jadi kalau kita mau pakai

24:29mau pakai vs code yang versi

24:31open source nya kita harus compile sendiri

24:33gak disediain tuh

24:35kita compile di mesin kita sendiri

24:37kalau yang sudah

24:39dijadikan executable

24:41baik itu

24:42apa namanya exe atau

24:44kalau di mac itu mungkin .app

24:46atau di Linux apa gitu ya

24:48ya dev dan lain-lain

24:51itu udah racikan Microsoft

24:53ya

24:53gitu, mungkin hal yang sama

24:56bakal terjadi juga di

24:58Microsoft Edge, kita gak tau ya

25:00ditambah lagi kemarin

25:02ada itu kan, ada

25:04info dari orang dalam kan, katanya

25:06apa, tim Google Chrome

25:08berdel desa ke Microsoft Edge

25:10nah ini tanda-tandanya juga sudah

25:12sangat jelas gitu ya

25:14seru ini

25:16seru, biar makin banyak ya

25:19biar makin banyak browser

25:21kalau dulu

25:21mungkin hanya didominasi oleh

25:25chromium base, termasuk juga opera

25:27terus sekarang

25:31sudah ada 4 lagi

25:33kalau kemarin 3

25:34makin banyak kerjaan gak ya

25:37mungkin mudah-mudahan sih dengan adanya

25:39interop jadi semakin

25:40berkurang ya, kita cukup tes mungkin di

25:43salah satu atau salah dua browser

25:45udah cukup mewakili gitu ya

25:47tes nih semua

25:49tapi kan gak banyak yang harus

25:51di fix

25:52karena udah seragam

25:55gitu ya kira-kira gitu ya

25:57mudah-mudahan, niatnya begitu

25:59niatnya begitu

26:00nah yang menarik apa lagi nih

26:03tadi jpg excel udah, view transition

26:05udah

26:06navigation API gak masuk ya

26:09coba-coba balik ke

26:11navigation API, ini yang kita

26:13bahas dua minggu yang lalu kalau salah ya

26:15tapi gak masuk

26:18gak masuk sepertinya

26:20apa tadi ininya

26:21WPT Interop nih

26:24ini kopasan

26:26kopasan

26:28Anda tidak terpilih

26:30Anda tidak beruntung

26:32apa lagi

26:33CSS Nesting

26:36yang di reput

26:37masuk

26:38kita mau lihat nih

26:41kata-katanya apa nih

26:43Oh ini, this proposal has been accepted.

26:47Yay, accepted. On behalf of the entire interop team, thank you for proposing it.

26:55Lihat itunya dong list issues-nya.

26:58List issues semuanya?

27:00Oh 27? Nggak banyak ya?

27:03Kayaknya sampai ratusan.

27:04Itu kan masih open.

27:05Nggak, itu beda deh kalau yang proposal.

27:08Oh iya, yang udah di-close ya?

27:09begitu di respon selamat terpilih atau maaf tidak terpilih

27:14yang tidak terpilih di close

27:16oh iya benar-benar

27:17ininya apa

27:24mungkin ada tag tertentu

27:26fokus area proposal ya

27:28oh iya

27:29fokus area proposal kita klik aja

27:32nah gak ada

27:34udah selesai kan

27:35is open nya ilangin di search nya nah 214 berarti ada dua ada 214 issue oke CSS modul script

27:48Yesus modul script starting style apa itu asli belum pernah lihat starting style

27:56following SR insert select udah bisa ya sekarang ya masuk kemarin belum belum

28:03Itu kan proposal coba aja lihat ini ya keterima nggak?

28:08Oh iya kita nggak lihat terima atau nggak ya.

28:10Semua di close aja gitu ya.

28:11Coba tadi lihat yang CSS nesting.

28:13Diterima ataupun nggak di close.

28:15Oh iya.

28:16Ini ada.

28:18Ini apa? Ini kayaknya belum ya.

28:21Coba cari WPT-intro.

28:25Nggak ada.

28:27Nggak ada?

28:28Nggak ada.

28:29Itu habis.

28:30Tuh, tunggu.

28:31yang balas itu tuh si GS

28:35oh ini masih belum itu

28:38masih belum buat

28:40ini masih orang nih

28:41lama-lama capek dia harus

28:43diping terus buat ngejawab

28:45lama-lama di otom

28:46lucu juga ya

28:50search

28:51scrollbar with

28:54search apa coba itu

28:56scrollbar nya bisa di

28:59di-style bisa dikecilin tapi bagus juga sih kalau bisa ada ya Iya di mobile ini baru bisa di Geko

29:10baru bisa di Firefox ya karena implementation nih coba tebak ini diterima atau tidak udah tahu

29:19juga sih dashboard Iya tapi itu deh bisa ketebak juga ini masih orang ini diterima Oh diterima loh

29:31salah mana lagi Oh bukan ini ada coba coba dashboardnya ada enggak sih ada

29:42ya ada yang diterima kan kita aja kayaknya otos kurang styling tuh

29:48oh ini 73% tadi di Gecko yang banyak ya 80% karena dia di luar

29:57Safari belum ketinggalan zaman dia itu apa sih yang Safari ini banget berantakan banget 18%

30:0818% starting style transition behavior beneran apa sih beneran punya punya nya si Chrome itu

30:17dosa lain belum belum start sama sekali Iya tapi browser lain alam saya vendor browser lain udah

30:25mau menarik ya kalau sudah masuk di sini kau sudah masuk di sini batin sudah setuju inilah

30:32yang parah walaupun yang lain udah mau 100% di mesin 7% custom property belah makanya Iya betul

30:41jadi yang di interop ini bukan selalu belum diadopsi tapi masih udah diadopsi tapi bisa aja

30:48speknya tuh kurang jelas speknya rancu jadi Chrome Edge dan Safari menginterpretasi spesifikasi yang

30:55di W apa ketiga C itu menafsirkannya a terus Firefox menafsirkannya beli karena mungkin

31:04speknya belum jelas bisa aja ada kasus kayak gitu jadi mereka akan kerjasama buat memperjelas

31:11spesifikasinya juga biar expectednya nggak rancu bisa kayak gitu atau bisa maksudnya udah di support

31:18tapi kayak behaviornya lain sendiri agak lain. Coba-coba klik dong custom property seriusan

31:25Coba klik custom propertynya. Mas Riza ada Firefox gak di sini? Enggak ada. Download dulu.

31:34saya coba saya coba tempat saya jadi masih buka di masih pakai apa ini sekarang Chrome

31:40ya kalau saya coba apa yang tesnya banyak itu 739 property CSS om oke CSS objek-objek model

32:00Coba saya buka pakai Chrome pakai Firefox Mas Riza buka pakai itu tuh linknya oke

32:10ya terus nanti kita bandingkan ini 7 dari ini ya kan run in run in your browser on wpt live paling atas

32:27paling atas eh buka masuk dulu at property CSOM dibuka dibuka terus diatas itu ada run in your

32:38browser atas-atas yang ada bullet point bawah-bawah ini ya Nah kita bisa lihat tuh pas pas pas pas

32:48kan ya kalau di sekarang saya saya coba lan saya coba pakai Firefox

32:55ada tetep tetep

33:01nih

33:03tuh pas pas pas pas pas pasus fail fail fail fail apa yang dijalankan juga bisa kelihatan

33:14nah ini kalau teman-teman pengen lihat hasilnya itu bisa lihat langsung view

33:21page source Bagaimana cara ngetes itu ada ada ada asursionnya juga jadi ada CSS

33:29property valid CSS property valid reverse valid ini ini ibaratnya styling CSS

33:37objek ini objek model kan ya ini custom propertinya intinya ya kan gedein gedein zoom zoom zoom oh iya

33:45maaf maaf nah ini custom propertinya terus di di tes tes invalid tes CSS text asset

34:00fullnya jadi di tes satu-satu nih cara mengakses no descriptor ada nggak sih no descriptor ada nih

34:10kalau salah ngetes apa propertinya no descriptor itunya rulesetnya kosong jadi kalau no descriptor

34:20no descriptor dia is invalid pas ya kan asset true asset true kelihatan nih kok teman-teman

34:30belajar tuh bagaimana cara ngetes tanpa perlu ada mocha bisa ya kan karena cuma

34:42eset kalau eset dong kan ada sebenarnya dari JavaScript yes yes yes file sudah ada

34:50jadi nggak perlu mocha dan ini ngetesnya ya di browser yaitu beneran cuma HTML CSS JavaScript

34:59lirang kelihatan oke oke dan bisa berribu-ribu berribu-ribu tes scenario yang lainnya jadi

35:10pelajari setiap hari kan mereka ngejalanin itu mereka punya kayak test suit automation lah

35:15macam seperti itu di ada kayaknya on-source juga tuh di GitHubnya web platform test ya

35:22tiap hari kerjanya cuma kayak gitu ngebooting kebuka versi terbaru masing-masing browser ya

35:29jalanin itu semua terus update angkanya dengan kata lain dengan kata lain kalau jadi browser

35:36tester developer tinggal nulis kodenya aja sudah ada ada orang lain yang nulisin tes-tes ke

35:46senarionya ini tinggal ya tinggal kodenya aja tinggal kodenya aja gitu itu yang susah

35:56kita sudah susah jangan dibikin susah lagi lah dibantu mereka gitu loh

36:05platform tes ini WPT ini juga kolaborasi sebagai project kolaborasi ya orang-orangnya

36:14sebenarnya orang yang kerja di Chrome orang yang kerja di ini kan Safari juga ini kan

36:20Mozilla, Microsoft

36:22Tapi beda

36:24Belum tentu sama loh Eka

36:25Karena si developer

36:28Untuk nulis

36:29Implementasi itu DC

36:31Sedangkan yang nulisnya kan JavaScript

36:34Beda orang sekantor

36:35Beda orang

36:38Sekantor

36:39Nah apalagi yang menarik ya

36:42Kalau buat saya ini salah satu

36:44Yang menarik itu ada

36:45Ini HTTPS URL for WebSocket

36:48karena kan selama ini

36:50selama ini kan ws.2

36:52jadi sekarang ada wss

36:56Yes udah ada kan lama ya belum safa konsisten safari 100% safari udah 100%

37:04loh yang lain ketinggalan jauh tuh jauh-jauh 20% masih merah-merah ini gimana kodenya kita

37:13lihat aja ya yang mana nih boleh yang gagal ya nih sih gimana ada kodenya gak kelihatan

37:21itu dan in your browser on web orang masih ada karena semuanya kayaknya semuanya kodenya ada

37:27di ini kok ada kodenya ada di GitHub ini ya ini cara ngetesnya kita bisa tahu dia pakai

37:40atau WC So ini dia yarel protokol ya kan terus itu asetnya apa tuh WS website equal kalau WS URL

37:50WS dot URL yang dari websocket ini luar kalau https dia otomatis WSS kan di tesnya gitu kan

37:58ya WS URL ini apa URL dot ref kalau ini WSS jadi yang dites adalah apakah url-nya WS kalau

38:08http kalau https URL nya https maka yang dites apakah sama wss ya gitu obati otomatis dikonfet

38:19ya Iya tergantung sama pas kita buka webnya pertama kali dan si Safari Safari sudah support

38:32sudah selesai kerjaannya tapi menariknya ada yang Chrome yang Chrome dan edge yang udah udah kelar

38:39100% atau 90 sekian yang lain ketinggalan ada yang Safari yang udah selesai yang lain harus

38:48yosul Iya kan masing-masing punya kepentingan jadi yang mana prioritasnya jadi kelihatan kan

38:55Project ini bukan dominasi provider tertentu.

39:02Ya, betul.

39:06Dan kayaknya mereka nggak bisa menerima semua proposal karena bisa jadi kayak tadi JPEG, JPEG Excel gitu.

39:14Mungkin si Chrome-nya merasa nggak ini.

39:20Nggak penting, nggak penting.

39:22nggak mau gitu, nggak bisa konsen gitu, nggak bisa fokus karena masih support-in Afih mungkin

39:28iya iya, tapi kalau dan ini adalah kumpulan proposal yang secara serentak

39:35berdiri sepanatnya ya, yes gitu, oke dan apa istilahnya kayak commit gitu ya commit untuk menyelesaikan ini tahun ini gitu

39:47Karena di tahun 2003 kayaknya lolos semua deh. Coba, eh ada gak sih yang failover?

39:53Ada.

39:54Ada.

39:55Oh ada.

39:56Yang di cross ya?

39:57Kayaknya ada yang di cross.

39:58Yang mungkin selesai semua sih. Pasti banyak yang carryover.

40:01Itu kan yang stabil.

40:02Ini masih banyak yang belum 100% ya.

40:03Ya udah.

40:04Yang stabil.

40:05Yang stabil.

40:06Tapi bagus banget.

40:07Ya udah.

40:08All focus area dari graphnya tuh kan bagus banget tuh.

40:12Oh ini?

40:13Ya.

40:14ya ada perkembangan pasti tapi enggak 100 belum 100% ini 82

40:21eksperimentalnya udah udah rata-rata di atas 60 kan ini carryover nih

40:28custom properties carryover nih iya berarti si Firefox

40:35kalau eksperimentalnya ya ada at least ada efek udah udah batik ibaratnya bakal rilis yang

40:492024 Kenapa masih ini mungkin belum kelar harusnya semua Oh iya bener coba kita lihat

40:59setuju tujuannya 100 custom properties 90 Iya sedikit lagi nih sekarang udah serat 9 berapa

41:07Oh experimental nya udah tapi yang disininya belum Oh tinggal dirilis ya

41:11sabar-sabar kesabaran juga ya melihat ini kan udah dibikin ya kodenya cuma tuh kapan sih rilisnya

41:25itu loh jadi nggak perlu di itu kan kelihatan tuh previous focus area tuh berarti tahun 2023 yang yang sorry 2000 di scroll bawah previous focus area tuh ada kanan bawah berarti yang 2022 kumpulannya

41:45dari sini semua tuh ya berarti makin lama bakal makin panjang ya yang bagian itu ya karena butuh

41:51di tes juga bisa jadi ada regression kan

41:53tapi udah bagus-bagus

41:57kok rata-rata 90an kata semua

41:59itu

42:00tapi ini ada yang menarik nih

42:02si Firefox nih

42:04ini posisinya di bawah

42:06tiba-tiba naik nih

42:08menyemai sama yang lain

42:11oh release ya

42:13itu siapa sih

42:15yang paling bawah apa sih

42:16intro

42:17total

42:19total-total ya nggak bisa di-zoom ya Hai rezeki Zoom ya buka PR dan bikin graf yang lebih bagus

42:28Oke apalagi yang menarik yang menarik

42:33index.db kok bisa bukan itu sudah stabil gitu Kenapa masuk apa yang apa yang belum apa yang

42:46fail kita lihat ya Oh ini dev ya yang interop stable udah belum hampir ya

42:55ya itu ada sqs tertentu kali itu back forward cash back forward cash jadi berhubungan sama

43:05fitur yang lain ternyata index.db nya mungkin belum support lihat di sini tesnya mana ini ya

43:14apa yang dites sama dia

43:16kode pop-up dulu berarti ada ada ininya coba klik pop-up mungkin ada backport case nya untuk

43:28ngetes back-forward case buat itu mana Iya ini itu ada ada tanda cek ada tanda merah tuh kanan

43:37kanan atas url Oh ini ya kena blog udah refresh ya refresh ya Oh iya bener ada buka loh nggak ada

43:53mana ini kosong kosong kosong kosong Oh ini tuh asing ya kalau lihat kodenya yang tadi ya yang

44:12tes harnes

44:13apa yang dites

44:16ya itulah ya

44:18kira-kira ya back forward case itu kan

44:20kalau kita

44:21forward misalkan kita ada

44:24disini terus kita ke

44:26halaman

44:27nah kalau kita balik lagi

44:30dia sudah di cage nah sepertinya

44:32si index db ini belum support

44:34sepertinya ya

44:36belum support untuk semua edge case

44:38kasus-kasus tertentu mungkin ada yang

44:40yang belum mungkin support tapi ada skenario tertentu yang dibuang menyebabkan dia tidak

44:47bekerja waktu ya waktu bikin slide yang tahun lalu itu kan ngelihat lihat contoh-contoh pesek

44:54nya detail banget semua skenario hal yang kita enggak pernah ngebayangin itu dibuat semua jadi

45:00emang menyeluruh itu menyeluruh banget tesnya coba letak directionality apa sih Emang bisa kayak

45:08atas bawah gitu ya kan diagonal lihat aja yang cari yang belum dari kanan ke kiri kali atas

45:20ke bawah kan bisa bahasa-bahasa kayak Arab itu kan kanan-kiri Arab Hebrew kanan kekiri

45:27nah bahasa Asia Timur kayak ada yang dari atas ke bawah pasti Oh ya sih apa yang atas-bawah

45:37atas bawah atas ke bawah maksudnya Oh emang ada ya baru tahu ini ada deh ini apanya mungkin

45:48tes pasif itu box is below look exactly the same ya udah berarti pas itu kan hebat itu pas

45:58Oh ya pes yang enggak pasti sama lah itu pas semua semua itu yang ada kuning yang ada kuning merah kuning ini apa yang mencari ya ini Pes semua dulu Coba ini pas semua semua tuh 22 pas Riran pas semua berarti udah ini

46:26mana Mas Riza klik yang ini yang kuning Oh nih dear auto form associated window apa itu

46:39kalau melihat beginian tuh saya merasa pengetahuan webdesk saya cetek amat ya

46:49ini apa terus pas dibaca sebenarnya kalau udah dibaca dibiarkan tuh ngerti cuma selama ini kita

46:58mikir nyampe situ deh karena kita enggak pernah mengalami belum pernah mengalami atau kita mungkin

47:04mengalami tapi kita nggak bisa enggak tahu keyword untuk nyari ini itu apa gitu ini kan apa pesan

47:11mungkin ada satu orang yang dapat bug ini nah bagusnya sih buat platform test ini kan menyembatani

47:16dari sudut pandang si developer browser orang yang loading browser tadi yang pakai situs bos

47:22atau apalah bahasa-bahasa level sama dari developer web kode yang ditulis yang apa

47:32mentrigger masing-masing skenario itu nah kan sudah menghubungkannya maksudnya biar

47:38kayak speaking the same language lah itu ya kalau kita mau tahu ini apa itu ada informasinya di

47:46mana ya itu makanya buka itu dong yang webkit blog yang di-release

47:54Hai nah iya itu ada ada ringkasannya kan ada penjelasannya ada di sini

48:02Hai teks direksionaliti in which takes flow is a vital aspect of setting in web some language

48:11flow from left to right while

48:13other right to left. Bener kan?

48:15Berarti kan. One of

48:17many bits of technology supporting

48:19text directional is

48:21the dear attribute.

48:23Iya.

48:26Left right atau auto.

48:28Iya.

48:29Nah ini mungkin udah ribet

48:31pas apa itu

48:32shadow trees.

48:35Interaction of directionality

48:37and shadow tree.

48:38Oh buat

48:40ngerender shadow nya kali ya kalau ada teksnya yang pakai shadow gitu bukan bukan seringnya yang

48:47dokumen objek mobil itu ya ya ya Shadow dom Shadow dom nah mungkin itu kayak nggak nggak ngebaca selama

48:56ini mungkin nggak ngeinherit itu kan jadi semua diasumsikan di tebak left to right semua jadi

49:07mungkin proses rendering nya jadi ngaco ya jadi kurang optimal ya karena semua dianggap dari kan

49:14dari kiri ke kanan gitu ya ini bagian-bagian tetap jarang buat jarang buat situs bahasa Arab

49:21atau bahasa Hebrew sih Iya kliennya belum ada dari sana request video frame callback ini apa ini cari

49:34itu lihat kalau itu adalah minimum value ya bukan rata-rata ya Iya iya iya iya kalau

49:54interoperability kalau value interoperability adalah the lowest value kalau bukan bukan

50:01Hai effort seperti benar berarti

50:03ada lagi-lagi Nah untuk overall berarti sekarang sebagian besar sudah 70 ah apa

50:18itu apalagi sih masalahnya ya real cari lihat ada detailnya coba di-scroll kebawah ini

50:26urls bla bla bla without them the web will not exist

50:32url living standard packed with details on exactly how url should work

50:41oh jadi ini kurangnya di standarisasi gitu dokumen standarisasi URL living standard itu apa Spek apa

50:53Spek spesifikasi. Jadi selama ini belum ada speknya apa?

50:58Belum terstandarisasi kali.

51:00Belum ada dokumentasinya gitu?

51:02Belum ada spesifikasi.

51:04Oh mungkin ada.

51:05Belum ada spesifikasi.

51:06Iya atau ada fitur-fitur baru dari url yang belum didukung tuh pas ratenya 77-85 iya

51:15coba aja lihat itu apa isi url

51:19baru Safari doang yang pas Oh banyak ada yang merah tapi ya banyak banget ya udah hampir

51:30semua exclude file JavaScript mel2 apa ini

51:35protokol-protokol banyak tuh ada mel2.2 coba yang film mana yang sel apa langsung ke paling

51:46atas Mas Riza centang Iya enggak bisa nggak bisa bukan nggak bisa lama rerun nah lama

51:56Oh iya Eh udah nggak tahu coba lihat ke bawah enggak ada error-error buat ini

52:07yang ditesnya apa tesnya error ini ya nim varian itu paling bawah paling bawah a

52:15element bukan ini ya Iya resources dash and resources slash a element nah

52:24run skip kode bikin-bikin element ring ini

52:37itunya sesekisnya pakai Jason tur paling atas tuh coba paling atas diambil dari juara tes data Iya

52:48dari resources resources ada Oh iya ini Oh bisa ini juga ada username password HTTP

53:03Nah ini mungkin hal-hal kayak gini

53:06Belum didokumentasiin kan selama ini

53:08Atau belum disupport

53:10Udah kayaknya deh

53:12Udah ya

53:13Harusnya sih udah ya

53:15Kita ada episode URL kan dulu

53:19Itu apa lagi

53:20Input http test.2

53:22Oh itu username password

53:24Passwordnya kosong

53:26Apakah dia dukung atau enggak

53:28Banyak sekali

53:30URL doang padahal

53:32oke oke pas dilihat Oh kita kan paham nih oh ya maksudnya tadi tadi kode tesnya kayak gimana

53:42terus ini fix apa fixtures nya eh apa pokok datanya kayak gimana kita ngerti cuma selama

53:49ini ya nggak pernah mikir sejauh ini itu paling nilai dengan special apa coba

53:55nah ini kan jadi ngompakin karena most dengan ngetes segala macem kayaknya sambil mereka

54:06nulis spesifikasinya technical apa tekniknya spesifikasinya untuk si url itu kalau kejadiannya

54:14begini gimana suatu browser harus apa merender memparsingnya nyekapnya kalau ke depannya besok

54:22yang bikin browser layout engine baru ya harus ada ada patokan yang mudah untuk diikuti nah

54:31di sini ada nggak di sini di sini juga good support di project2 realnya mereka ngebangun

54:42banyak juga tes kestiok harinya ya Oh iya ada yang kerjaannya nulisin tes kes ya

54:49capek gak sih?

54:53harus kayak gitu

54:54ya harus dibayarkan kerjaannya

54:57ya kan kerjaannya itu

54:58emang kerjaannya begitu

55:00sama aja kayak

55:01mungkin mereka juga mikir

55:04capek gak sih bikin kurut-kurut aja

55:06kerjaannya bikin kurut-kurut doang

55:09tiap hari ngoding

55:10tiap hari ngoding

55:11mikirnya capek ya

55:15wow

55:17ini nih

55:18Ini berarti ada masalah di URL parsing, seperti tadi ada yang pakai username,

55:24username kosong ada ada beberapa isis yang belum tercover buka gitu ya WPT buka GitHubnya WPT untuk

55:37semua codebase di itu ya di chat private Oh itu langsung WPT WPT itu semua codebase ada di situ

55:47itu nah ini siswa-siswa etsuitnya semua dari sini banyak banget isunya aja ada 1300 puluh

55:58request 1200 dong Nah itu yang kerjanya sehari-hari buat ngurus itu lumayan pusing

56:06juga ya kita lihat ya orangnya siapa ya ada yang dikenal enggak ya banyak 1600 juga kontribuser

56:13tinggi adalah MS2 gear WPT PR bot-bot yang paling sibuk PR bot ini tadi yang jawabin nih Oh Mozilla

56:24dari Google Chrome X Opera ini enggak tahu siapa ada Mas Riza pahami enggak enggak nah ini juga

56:38tadi yang jawab ini dari mana dia Oh enggak dikasih tahu dia ini imigran imigran Geko hacker

56:52Geko hacker jadi masing-masing ada spesialisasinya juga ya mau saya yang ya ya apa ngerjain buat

57:03ini browser layout engine developer tuh spesifik sekali ya berarti yang dia ngurusin flexbox gitu

57:16ya gribe bikin ada Rakhina Rakhina Rakhina kita enggak tahu ininya apa enggak ada itu

57:30Google tuh yang Fransua bubur yang sampingnya yang kanannya Oh iya yang yang inter Google

57:38jadiin ya

57:40oh wow

57:42mantap lah mantap

57:50ini webkit

57:51oke overall

57:56sudah 75% ya

57:59walaupun masih bulan Februari ya

58:01tapi kita kan gak tau ya

58:03progressnya ya

58:03overall 75 73 58 75

58:07jadi masih tertinggal di Firefox tapi karena Firefox belum rilis ya kalau kita lihat

58:13eksperimentalnya dia lumayan tinggi juga lumayan tinggi juga walaupun masih setara-setara sama

58:21sama S dan Chrome juga enggak terlalu jauh bedanya Nah mungkin jadwal rilis dari night

58:29ke stabilnya dia kayaknya lebih lebih lebih jarang ya nggak sesering apa Chrome Chrome sama

58:38edge Safari dong yang lebih susah ngerilis tiap tahu dia rilis tahun sekali kalau nggak nggak

58:46kalau nggak hotfix kalau nggak hotfix dia enggak rilis tuh kalau update Iya update kok suka sering

58:53update kok enggak enggak sering-sering banget tapi ada gitu enggak tiap hari sih sebulan sekali itu

58:58bulan-bulan sekali ya ada ada ada ada update kalau yang major ya Emang sekali

59:05Oke apa lagi yang kita bahas favorit favorit masing kalau gue yang oke popover nih akhirnya nggak nyangka secepat itu apa masih ada kasih semua browser oke dan masuk ke interop

59:31popover itu ya itu apa shadow custom element tapi yang bawaan di browser yang buat untuk

59:39model dan lain-lain ya kalau nggak salah coba deh buka di blog webkitnya

59:45popover

59:50build into the browser way to have element pop onto the top layer of page

59:59jadi kayak ada dialog model dan temen-temennya

1:00:02kalau di hover terus tiba-tiba muncul dialog gitu ya

1:00:05ada tooltipnya atau semacamnya

1:00:08ya kultif ya kultif ya kultif dan ini udah jadi itu ya saya dodong ya Iya ini custom element ya

1:00:16ini kan kayak nggak hampir nggak ada website atau web-app apapun yang nggak pernah ada pop-up nya

1:00:23sama sekalian itu masih itu yukis yang sampai semua developer bakal tunggu dan selama ini

1:00:28kan Oh ya masih relatif banyak bergantung sama library kan Nah ini nih kalau pop-up overnya

1:00:36sudah interoperable itu ya bakal lebih gampang dibuat tanpa external library Oke kalau Iwan

1:00:48atau karena semuanya bingung tapi tekstur balance itu salah satu yang Oh ya itu menarik saya looking

1:00:59forward karena ya saya orangnya developer yang lemah untuk untuk bagaimana menyesuaikan layout

1:01:10supaya gitu ngabisin waktu dengan ada textual balance mungkin mempermudah hidup saya tahun ini

1:01:17kalau saya tadi ya apa awet socket.tps URL for web socket itu sih ada pointer dan

1:01:30mosin itu apaan sih sama CSS nesting juga menarik sih tapi saya sesuai

1:01:36juga CSS nesting itu bahas juga ya kemarin pasti ya episode describe

1:01:43apa tadi Ivan pointer and mouse iya pointer and mouse event bisa dibuat

1:01:54apa kayak behaviornya behavior waktu kita mouse over bisa diklik atau enggak

1:02:01Mouse pen stylus or touch one finger karena ada touch nya yang kita enggak enggak kepikiran bahwa

1:02:17sekarang kalau dukan Mouse ya udah Mouse gitu kan Iya karena ada tablet nggak dapat

1:02:22kalau tas kan nggak bisa klik nggak bisa klik nggak bisa apa ya klik kanan

1:02:37bisa dong sebelumnya caranya bukan ada sepersekian detik pasti ada hitungannya

1:02:45kita nggak ngerti Oh ya berapa nahan jadi kalau klik and hold ya klik and hold ya itu kan kayak

1:02:54left click kalau kita tep and hold itu kayak right click ya itu berarti kan harus harus disesuaikan buat kasus gitu ya dan ternyata kalau ini nyambungnya ke accessibility nih kalau buat orang yang penglihatannya kurang

1:03:12terus pakai semacam voice over atau semacamnya,

1:03:16kalau di HP, kalau di laptop, desktop kan tinggal nge-tap ya,

1:03:21tap atau mouse over.

1:03:23Nah kalau di mobile, itu emang caranya dengan cara nge-tap lama.

1:03:31ngetap lama dia baca itu apa jadi emang ya perlu penyesuaian lah

1:03:35nah mungkin ini juga mau di streamline kan behaviornya

1:03:39iya inilah salah satu alasan kenapa platform web berasa update-nya agak lambat gitu

1:03:48karena dia ingin itu kan bisa dibuka di semua platform kan gitu

1:03:54gak cuman desktop doang kalau desktop doang

1:03:56dengan segala jenis manusia yang accessnya

1:03:59yang berbeda-beda

1:04:00OS-nya lain-lain

1:04:02browser-nya beda-beda

1:04:05orangnya juga lain-lain dari yang bahasanya

1:04:07kiri ke kanan, kanan ke kiri

1:04:09dari yang misalnya fisiknya

1:04:12apa, inderanya

1:04:13lengkap semua sampai yang

1:04:15perlu bantuan assistive device

1:04:17nah gimana tuh, keren dernya

1:04:19harus diakomodasi

1:04:20harus bisa adaptasi untuk itu semua

1:04:23dan antar browser harus kompak

1:04:25ya sekompak mungkin

1:04:26makanya tadi testnya sampai ada ratusan ribuan

1:04:29buat mengakomodasi itu semua

1:04:32jadi keingat

1:04:38pesannya mas Arya

1:04:40kayak ngebangun

1:04:41yang waktu dia buat sebuah

1:04:44Phantom JS itu

1:04:46test case itu buahnya

1:04:47banget

1:04:48untuk stabilitas dan backward compatibility

1:04:52betul

1:04:54backward compatibility itu yang

1:04:55yang terus dijaga ya sama platform web

1:04:58ya dan kalau dalam kasus ini ya cara apa cara komunikasi cara ngompakin keempat browser ya

1:05:05cuma ini kan satu-satunya tesnya ya jadi kayak dari end user lah dari end user masing-masing

1:05:12browser kayak tadi dibuka dari Firefox ternyata fail lah kan gitu udah karena kalau kode kan

1:05:18nggak bisa di-stream lain dan masing-masing punya sendiri ya udah ini hasil akhirnya yang dites

1:05:22relatif kalau sinteks masuk interop capen yang push retokol sinteks itu apa ya itu yang yang

1:05:33itu HC apa yang kemarin ya kemarin ya Oh itu adalah yang ngepost pasti Adam argyle

1:05:43ini baru-baru kan eksperimentalnya gimana eksperimental sudah sudah pada baru enggak

1:05:59ada enggak ada pergerakan sedikit-sedikit cuman 0,3 persen ya berarti emang dibikinnya

1:06:06Kenapa ini dia enggak penting ya Kenapa dimasukin gitu ya Kenapa dia enggak penting

1:06:10Iya karena semua berasa itu penting Nah iya kenapa penting kenapa penting itu

1:06:18cari di isunya isu interop ada enggak kenapa banyak berarti banyak yang

1:06:28accessibility impact batik kalau color to be created from an original

1:06:38manipulasi with map function or replace with only deskripsi doang kebawah alasannya accessibility

1:06:47terus pada bilang apa tuh FTT is my mistake gak ada ininya Tau itu berarti mungkin penjelasan yang masuk yang apa kemungkinan besar

1:07:10Mas semua browser panggil semua aja.

1:07:12What is that? Coba turun dikit accessibility impactnya apa?

1:07:17Gampang buat bikin kontras mungkin.

1:07:20Color palette.

1:07:24Nah kan kontras kan, jadi karena udah ada hitungannya yang

1:07:28maksudnya ada algoritma bikin warna yang streamline yang konsisten buat semua browser.

1:07:34Jadi lebih gampang bikinnya, gak perlu bergantung ke tools external buat ngitung

1:07:40itu proporsi-proporsi yang kontras.

1:07:45So, in this example, a hover variant is created,

1:07:50ensuring, memastikan bahwa warna barunya, warna hovernya 30% lebih terang.

1:07:58Ya, mengerti tujuannya tapi masih belum mendapat, mengapa pentingnya gitu.

1:08:06Belum bisa terima, karena masih baru juga kan ya.

1:08:08ya Iya pentingnya itu jadi kita kan mikir kita pas bikin CSS ya udah mikir ada standarnya misalnya

1:08:160,3 atau 30% lebih terang bayangin deh kalau kita harus mikir misalnya abu-abu abu SDD itu abu-abu

1:08:25ee abu-abu aa abu-abu juga buat kita musim web developer itu semua abu-abu kan walaupun kalau

1:08:34mungkin kalau UI designer kan lebih lebih paham kalau buat kita mau apa kalau pakai

1:08:40Hex aab bbcc ddd itu semua abu-abu kita nggak bisa bedain nah ini dikasih bahasa yang lebih

1:08:48lebih lebih mudah dan lebih bisa lebih terstrim lain buat kita bahwa kontrasnya tuh 0,3 bisa

1:08:5520% lebih terang yang lebih bagus aja sih kayaknya buat aksesibilitas Yes Oke ada lagi yang mau kita

1:09:05bahas mungkin sebelum mungkin kita sudahi terakhir itu aja dulu itu dulu ya oke berarti untuk malam

1:09:15topiknya, loh Ivan hilang

1:09:18Ivan hilang

1:09:19kita ngomongnya samaan

1:09:21ya, untuk malam ini mungkin

1:09:24udahan dulu topik tentang

1:09:26interop 2024

1:09:27mungkin nanti tahun depan kita lihat lagi

1:09:30review lagi

1:09:31mungkin sekalian kita masukin ke topik review

1:09:34kali ya, eh preview dan review

1:09:36kali ya

1:09:37kalau emang udah selesai gitu maksudnya

1:09:40kan Januari itu udah selesai ya

1:09:42mungkin agak diundur sedikit

1:09:44supaya kita bisa sekalian review juga

1:09:46nah buat teman-teman yang

1:09:48mau apa

1:09:50mau kasih-kasih

1:09:52ide, saran

1:09:54atau ada yang mau nanya

1:09:56tentang seputar dunia web

1:09:58bisa langsung ke kesana.in

1:10:00slash ngobrolin nanti

1:10:01langsung aja di discussion

1:10:03ditanyain pertanyaannya

1:10:05atau ada topik yang mau

1:10:08disarankan ke kita

1:10:10atau ada narasumber

1:10:12yang mau diundang silahkan

1:10:13kalau perlu di mention

1:10:16atau di text kalian

1:10:18oke, Ivan ada

1:10:20ada masalah dengan teknis

1:10:23komputernya

1:10:24jadi Ivan udah cabut

1:10:27duluan, dan sekarang kita tinggal berdua

1:10:29kalau begitu kita juga udahan

1:10:30kita ketemu lagi minggu depan, mudah-mudahan

1:10:33minggu depan kita udah bisa live lagi dengan topik

1:10:35yang berbeda, selamat malam, selamat

1:10:37istirahat, sampai jumpa

1:10:39bye-bye

1:10:43Terima kasih.

Suka episode ini?

Langganan untuk update episode terbaru setiap Selasa malam!

Langganan Sekarang

Episode Terkait

Web Interop & Baseline - Ngobrolin WEB
EP 134

30 Jun 2025

Web Interop & Baseline - Ngobrolin WEB

🗣️🕸️ Selasa malam waktunya #NgobrolinWEB! Malam ini kita akan membahas tentang web interop dan baseline. Masih bersama...

Ngobrolin Safari - Ngobrolin WEB
EP 87

19 Jun 2024

Ngobrolin Safari - Ngobrolin WEB

Yuk mari kita diskusi dan ngobrol ngalor-ngidul tentang dunia web. Agar tetap up-to-date dengan teknologi web terkini. ...

Inovasi Web dari Google I/O 2024 - Ngobrolin WEB
EP 83

21 Mei 2024

Inovasi Web dari Google I/O 2024 - Ngobrolin WEB

Penasaran dengan perkembangan terbaru di dunia web yang diperkenalkan oleh Google pada konferensi tahunan mereka, Google...

Komentar