EP 82

Ngobrolin Web API Baru - 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 berbagai Web API baru yang sedang trending atau akan menjadi tren di tahun 2024. Diskusi dimulai dengan penjelasan tentang apa itu Web API—bukan REST API melainkan API yang disediakan oleh browser seperti Storage API, Performance API, dan Observer API yang berlandaskan pada spesifikasi teknis. Beberapa API yang dibahas meliputi View Transition API yang kini sudah mencapai level 1 (client-side) dan sedang menuju level 2 (server-side), Popover API yang kini telah menjadi baseline dan bisa digunakan tanpa JavaScript murni untuk membuat tooltip atau toast non-modal, serta Web Vitals 4.0 yang menambahkan metrik INP (Interaction to Next Paint) sebagai pengganti First Input Delay. Selain itu, episode juga menyinggung proposal TypeScript type annotations untuk JavaScript yang masih dalam tahap perdebatan (stage 1) dan kontroversial karena berpotensi mengubah cara kerja JavaScript secara drastis. Speculation Rules API juga dibahas sebagai fitur baru yang memungkinkan browser untuk melakukan prefetch dan prerender secara cerdas berdasarkan perilaku pengguna, yang sangat relevan dengan tren kembalinya Multi-Page Application (MPA) dengan adanya server-side rendering. Diskusi diakhiri dengan JSON module import yang kini berstatus stage 3, memungkinkan import file JSON langsung tanpa bundler, serta setHTML API sebagai alternatif innerHTML untuk web components.

Poin-poin Utama

  • View Transition API Level 2 - Memungkinkan transisi antar halaman (MPA) tanpa client-side routing, membuat website multi-page terasa secepat single-page application.
  • Popover API - API native browser untuk elemen pop-up non-modal (tooltip, toast, menu) tanpa perlu library tambahan, sudah masuk baseline 2023 dan didukung semua browser modern.
  • Web Vitals 4.0 - Library terbaru untuk mengukur Core Web Vitals dengan dukungan INP (Interaction to Next Paint) yang menggantikan First Input Delay.
  • Speculation Rules API - API baru untuk mengontrol perilaku prefetch dan prerender berdasarkan prediksi browser, sangat berguna untuk Multi-Page Application.
  • JSON Modules - Memungkinkan import file JSON langsung tanpa bundler atau plugin tambahan, sudah mencapai Stage 3 dan hampir resmi menjadi standar.
  • setHTML API - Pengganti innerHTML untuk custom elements/web components dengan fitur sanitasi bawaan untuk keamanan.
  • Type Annotations Proposal - Usulan kontroversial untuk menambahkan type annotation langsung di JavaScript tanpa transpilasi, masih tahap Stage 1 dan menjadi perdebatan di komunitas.
Transkrip Bantu Koreksi

0:00Halo halo halo selamat malam selamat malam selamat hari selasa seperti biasa bertemu lagi

0:25dengan kita bertiga ada

0:26Eka, ada Ivan, ada Riza

0:28iya, kali ini Eka

0:30udah muncul

0:31kali ini Eka udah muncul, setelah minggu lalu

0:34kabur, menghilang

0:36wah seru banget ya kemarin

0:38ya, semua

0:41serius

0:42itu gak ada topik, justru rame

0:44pertanyaannya gak habis-habis

0:47tapi banyakkan

0:49curhat ya kita ya

0:50banyakkan curhat

0:51jadi kita nanti mau merancangkan

0:54sesekali tanpa topik

0:59jadi ya get in touch sama

1:01ini aja sama teman-teman

1:03semua ya teman-teman yang penonton

1:05malah lebih seru

1:06biar tau kondisi di lapangan

1:08besok lagi dong

1:09ya maksudnya besok-besok

1:13bikin

1:14bikin seri kayak gitu

1:16iya kita rencana bikin seri

1:19ada diskusi santai

1:21ada fundamental

1:23Nah kira-kira malam ini kita bahas apa ya?

Lihat transkrip lengkap

1:28Trending

1:29Yang lagi yang akan ngetrend ya

1:32Yang sedang ngetrend atau yang akan ngetrend ke depannya gitu ya

1:35Jadi malam ini kita akan bahas beberapa web API

1:40Baik itu HTML, CSS ataupun JavaScript

1:44Yang disediakan oleh browser

1:49Jadi web API ini bukan REST API ya

1:53bukan service kayak apa ya swapi bukan ya bukan ya ini API yang bisa kita gunakan secara apa untuk

2:03programming ya bisa buat macem-macem contohnya local storage itu ya storage API lebih tepatnya

2:14Storage API, Performance API, Observer API, observer kan ada banyak.

2:24Dan ini sebetulnya semua API ini bedanya dengan produk lain mungkin ya,

2:31maksudnya fitur-fitur yang khusus browser, ini beda web API ini kan berdasarkan standar,

2:39namanya spesifikasi, jadi landasannya itu spesifikasi teknis.

2:43Jadi API ini fungsinya bla bla bla

2:45Terus jadi kayak semacam test case lah

2:49Kalau user melakukan ini

2:52Atau kalau misalnya inputnya seperti ini

2:55Maka prosesnya akan seperti ini

2:57Jadi itu belum implementasi

2:59Nggak ada codingannya sama sekali

3:01Cuma spesifikasi teknis

3:03Nah masing-masing browser

3:05Pertama bebas mutusin untuk mau pakai atau nggak

3:09Mengadopsi atau nggak

3:11Kedua, coding-annya gimana implementasi di masing-masing browser engine ya bebas terserah masing-masing browser.

3:18Cuma harus berlandaskan si spek itu.

3:23Oke, oke. Nah kira-kira di 2024 ini teman-teman punya apa ya, punya web API baru yang udah dipakai atau yang menarik, yang kira-kira menarik, gak boleh di-share?

3:41siapa dulu Eka dulu ya kak yang menarik yang dibahas duluan malah bukan yang dicatatkan itu

3:53sebet paling menarik tetap transition sih enggak itu kan dari tahun lalu soalnya ini kan topiknya

3:59adalah web API baru Nah kalau kalau view transition itu seneng-seneng pribadi aja sih

4:05dari devest tahun lalu topiknya topik togo bahas itu dan sampai sekarang sekarang udah masuk semua

4:13browser yang level 1 level 1 itu yang client-side cuma kalau yang level 2 yang apa server-side

4:21lah ya antar dokumen antar link tuh sayangnya ya masih belum terlalu tapi udah mulai ada ya

4:28udah ada update baru cuma kalau dari berasanya selesai gimana maksudnya antar dokumen antar

4:35dokumen antar antar part dalam jadi kalau misalnya ikhlas.com mengunjungi page yang lain dia klik

4:49bisa ngetransisinya slash full iya bisa transition tanpa client JavaScript ya bisa Maksudnya kita define transitionnya seperti apa tapi tanpa hijack client routing nggak usah pakai router client

5:02itu yang level 2

5:04cuma belum semua browser

5:06si Chrome-nya sudah bisa?

5:08Chrome bisa, bisa pakai flag

5:11demo, demo, demo

5:13belum, besok-besok

5:15oke, pengen tuh gue liat tuh

5:18di itu khusus aja CSS dan apa pokoknya front-end front-end Magic part 2 kan kita pernah tuh dulu

5:26nah ini yang baru ini yang yang di topik ini juga front-end Magic juga sih popover

5:34sebetulnya malah implementasinya ya bisa dijadiin model atau toast atau apapun lah

5:42yang muncul nongol di layar nah ini ini modal itu udah muncul duluan kan modal tapi ya dialog-dialog

5:51dialog-dialog ya ini bedanya bedanya sama dia lupa beda spesifikasinya cuma enggak tahu sih

5:59kalau gue lihatnya mirip-mirip juga ya beda peruntukan aja kayaknya buat hal-hal yang

6:04lebih kecil sama kayak buat apa nanti ada demonya dibawa ininya dulu tentang si epinya dulu ini tuh

6:16sebenarnya kalau yang di Chrome only udah dari dua tahun yang lalu sih dua atau tiga tahun lalu

6:22punya kontennya Mas ada mergel sama Mbak Una itu bahas ini udah lama banget cuma yang bikin menarik

6:31sekarang tuh udah baseline sudah diadopsi oleh versi stabil semua browser dua versi terakhir

6:39ya itu sudah berarti udah aman untuk digunakan ya Iya tetap tergantung user base kita sih aman

6:50atau enggaknya kan tergantung actual user kita cuma ya apa user generic pada umumnya udah lumayan

6:59nah mose udah cukup tinggi lah 22 versi terakhir dua versi stabil terakhir Nah tetap apa konsep

7:11konsep popover versus model versus dialog segala macem tuh penjelasannya itu tuh cuma sebetulnya

7:21ngerti-ngerti juga sih Oh pop popover is being shown the rest of the page is non-interactive

7:28tidak bisa kita nggak bisa interaksi di elemen lain autofocus dikunci ke dalam situ itu modal

7:38Nah kalau non modal Oh gitu baru ngerti sekarang malah bedanya kalau modal itu pop-up yang kita

7:46dipaksa dikunci fokusnya disitu harus berinteraksi dulu jadi contohnya kayak apa cookie consent atau

7:53apalah kan kita nggak boleh lanjut sampai kita nyelesaikan itu, menutup itu.

7:58Kalau non-modal, itu ya pop-up juga muncul di atas layar,

8:04tapi ya kita cuekin boleh, kita bisa berinteraksi dengan sisa isi halaman.

8:09Nah, kalau pop-over API ini non-modal.

8:14Ya, jadi itu kayak toast atau apalah tooltip atau semacamnya.

8:18Tahu kan misalnya ada fitur baru terus sering melihat kan kita icon i gitu.

8:25Nah terus misalnya kita klik atau hover di situ suka muncul penjelasannya.

8:28Kan itu bukan hal yang kritikal yang harus memaksa user nyelesaikan interaksi di situ baru lanjut ke tempat lain kan.

8:35Itu kayak opsional aja.

8:38Oke.

8:39Iya, iya, iya.

8:40Itu bedanya.

8:41Nah ini kan sebenarnya penggunaan apa?

8:44ini pattern UI yang umum

8:47banget ya, selama puluhan

8:49belasan tahun tuh kita kayak

8:50harus pake, ya harus

8:52kalau iseng, kalau kelebihan waktu dan tenaga

8:54bisa bikin sendiri, atau

8:56yang lebih realistis, kita harus cari-cari

8:59apa, library

9:01atau package yang di install biar bisa

9:03bikin fitur ini

9:04terus mengganggu performance juga kan

9:07bikin gini

9:09pake apa ya namanya, swiper

9:11eh bukan swiper, apa namanya

9:12library.js yang untuk

9:15bikin popover-popover gini

9:17popster ya

9:19popster ada juga ya

9:20popster

9:21pop

9:25apa ya

9:27itu mah di UI

9:31component library apapun ada sih

9:33gue lupa dulu ada yang sering

9:37gue pake dulu tuh apa namanya

9:39nah btw

9:41udah ini bingungnya demo khas developer banget deh secara estetis tuh kureng kureng nggak ada sesuai dengan terus apa sense of of estetiknya ya begitulah cuma mau saya apa kan yang penting bisa bisa nunjukin bahwa itu bisa ini bisa dipencet berkali coba generate

10:03sukses tos lagi deh generate file Hai nge-generate file tos nah kan Oh yang ini maksudnya ia boleh

10:14dipakai buat itu boleh dipakai buat misalnya itu tadi information tooltip atau apapun lah yang

10:20pop-up yang non model yang itu tadi enggak enggak ngunci fokus enggak menghalangi interaksi tempat

10:27lain usap menu Woi zaman kapan banget ini jamannya inget gak jamannya DHTML dulu pernah

10:38kita yang ya iya iya dulu pernah baca cuma nggak ngerti sama sekali terus mikir udah nggak bakat

10:45begini-ginian DHTML ya Iya ya dihapus ya iya masa itu apa sih ya iya html kan berhenti ada

10:56transisi dan transisi antara halaman-halaman web menuju ke web application kan aplikasi

11:04Nah di tengah-tengah itu kan ada orang yang punya kreativitas untuk bikin hal-hal yang tadinya halaman web tapi udah mulai dinamis.

11:12Kayak tampilin menu, ada yang kayak hamburger menu di klik ke kanan gitu.

11:18Pokoknya yang interaktif gitu.

11:19Tapi zaman dulu kan masih belum terlalu banyak hal-hal yang seperti itu.

11:23Karena JavaScript tidak digunakan untuk itu.

11:27Itu sih ya.

11:27Nah maksudnya apa? Itu bahasa tersendiri atau gimana?

11:34enggak cuma HTML ketambahan animasi itu punya dynamic ya gitu aja Oh gitu doang Oh tapi bahasa

11:43klien saatnya mencet bisa jadi CSS bisa jadi atau nah ini coba kalau kalau demo demo popover yang

11:56enak di mata coba deh kalau buatannya Mas Adam rjl itu biasanya bagus Oh oh iya kalau dia puh

12:05dia mah jago CSS pasti bagus kita coba ya hab oh Twitter ada linknya link kopennya ada linknya

12:17tadi nge-search doang sih

12:19random

12:21connection

12:25connection

12:27ini ya minimal popover demo

12:31animated if supported

12:32oh animated if supported

12:35ya karena itu kan

12:36itu kan itu biasa

12:38maksudnya HTML CSS biasa

12:40mau di animasi ya

12:42animasi CSS

12:43progressive enhancement

12:46enhancement Oh ini tip gitu doang cek itu doang ini bikinnya banyak lho opacity nggak

12:56itu kan buat animasinya fade-in fade-out ini oh ininya tag-nya popover target ya popover

13:04popover target sama dengan mytooltip mytooltip dia bakal cari elemen HTML apapun yang id-nya

13:13sesuai microtip coba tulis yang panjang deh tip isi tipnya diganti lorem ipsum dolor sit amet

13:20gitu yang bawah yang bawah yang bawah loh kok hilang render-render uang tip-tip punya hujan

13:33punya ujian dan aku punya ujian Oke finish Oh masih lagi dah Oh akan emang segitu tapi

13:48ini ya apa namanya habis itu lihat bentuknya diatur sama sih CSS terserah diatur yang gimana

13:58Oh javascriptnya bahkan gak ada sama sekali ya ini pure HTML dan CSS ya

14:04Kecuali mungkin kalau yang kayak tadi itu toast yang bisa positioningnya

14:11Tadi sesuai jumlah toastnya

14:14Ya gak tau pokoknya kalau mau di enhance pakai javascript mungkin bisa

14:20Tapi ya gak perlu gak harus

14:22Iya ini minimal banget sih demonya

14:25orang judulnya minimal demo Oke ini udah masuk baseline udah bisa dipakai 2023 udah bisa ya baseline 2023 udah 2024 itu enggak masuk baseline April kemarin bulan lalu tapi kan masuk baseline itu kalau sudah dua versi stabil terakhir

14:56semua browser major

14:58nah berarti kan sebenarnya udah dari tahun lalu itu

15:05cuma baru April kemarin

15:06opera android aja udah bisa nih

15:08opera android ini opera mini bukan?

15:10bukan ya? beda ya?

15:12bukan kayaknya bukan deh opera mini itu enggak pakai browser engine apa enggak pakai rendering

15:17engine yang mainstream yang masuk akal tuh enggak masuk akal sama sekali itu mereka punya bahasa

15:25sendiri obml oprah browser merkap paling besar itu enak banget itu bisa bisa biar mereka bikin

15:37sendiri gimana ngomongin di HTML kan ini ada ada ada ininya ternyata pada pengertiannya

15:45dynamic HTML ini style animasinya aja retro collection of Technologies used together to

15:57create interactive and animated website using a combination of static markup languages client

16:01scripting and presentation definition language CSS and DOM ini sebenarnya ya sekarang ya Cuman

16:14dulu kan belum jadi kita bahas untuk ini ya untuk apa sesi khusus nostalgia ya oke apa nggak nyambung

16:29cuma jadi kepikiran mungkin sekian puluh tahun dari sekarang eh atau mesin learning pun udah

16:36nggak ada termnya tersendiri jangan-jangan karena udah kayak dianggap wajar semua produk digital

16:42semua software mungkin udah udah pakai unsur eh atau mesin learning jadi jangan-jangan nggak ada

16:50termnya lagi ya ini ke si DHTML karena ekspektasi standarnya kayak gitu itu udah ya sama juga

16:57juga udah kurang terdengarkan karena semua sudah sudah melakukan praktek-praktek itu ya ngomong

17:07ke Ali eh TWA sama weks ini bukan web.api sih sebenarnya fitur ya fitur web baru eh ini juga

17:16belum lama nih sekitar bulan lalu Chrome bikin eh apa sih web website yang enggak memenuhi heuristik

17:25kriteria PWA sekarang juga bisa di-install seru ya Oh iya bentar cari itunya cari beritanya ya

17:34sambil lanjut aja bahas yang lain Oke kalau dari Ivan ini ada API apa web Vitals ya web Vitals

17:44kalau saya bukan khusus yang webpress, eh webpress lagi bukan web API tetapi mau waru-waru aja ini web vital 4.0

17:56library nya ya library web vital ini bukan yang buat di web API tapi library untuk web vital JS

18:03mau release soon, release kandidat ya

18:08sebelumnya kan versi 3,5 ini library web Vitals yang sebenarnya wrapper

18:17zoom in bete web zoom in dong

18:19sebenarnya web Vitals ini adalah wrapper untuk dari performance API

18:30dari web performance API untuk mempermudah kita melihat oke CLS nya berapa

18:35INP nya berapa

18:37LCP nya berapa

18:39TTF, gak semua itu

18:40Ini kan core web fighter nih yang dia tunjukin

18:43Web fighter yang lain ada

18:45Kayak FCP nya

18:47Apapun yang kalian lihat di

18:49Lighthouse itu menggunakan

18:51Ada semua disini

18:52Ini yang sama gitu, script yang sama

18:55Underlying

18:56Underlying level V nya itu ya berarti

18:59Under the hood nya seperti ini

19:01Lighthouse tuh kayak front end nya aja

19:02Iya

19:03untuk collect data ini

19:05jadi kalau kalian mau collect data

19:07saya pakai ini

19:09untuk collect data saya sendiri

19:12dan langsung saya

19:13push ke google

19:16analitik

19:16saya proses sendiri dari

19:18saya proses ke bigquery

19:22terus nanti bisa lihat

19:23gak sampai bigquery

19:25saya pakai google analitik

19:27reporting sudah bisa lihat

19:29oh CLS saya berapa, INP saya berapa

19:32saya berapa persatuan waktu yang saya mau kerjakan

19:36ya dia kan di list 4.0

19:43All, which is major update. Apa yang ditambahkan? Yang pastinya INP.

19:49Kan INP yang baru tuh, quite vital yang baru, yang tidak disahkan sebagai pengganti total blocking time.

20:03Atau first input delay.

20:06first input delay atau total

20:09blocking time itu diganti jadi namanya

20:11interaction to next pane

20:13update dari web vital library

20:17ini sudah bisa menghitung

20:19INP

20:20INP itu lab berarti lab ya

20:25bukan user

20:26gak harus nunggu interaksi user

20:28interaction to next pane

20:32dua-duanya ya

20:37kan kalau during page load

20:40dia bisa menghitung INP nya berapa

20:42kalau kita scroll

20:44interaction to next pain cycle nya

20:46dia bisa lagi hitung berapa

20:47sama kayak CLS

20:49kalau CLS kan selama

20:52pagenya hidup

20:53CLS nya tetap dihitungkan nanti yang maksimalnya

20:56kita tak tau

20:57INP sama juga seperti itu

21:00Seminggu lagi kata Mas Barry Pollard

21:05Kira-kira kalau nggak ada feedback yang major

21:07Akan jadi resmi 4.0

21:13Ya nanti semuanya update itu page

21:15Kayak page web dev ke update

21:19Terus kemudian lighthouse yang di chrome juga ke update

21:24Pake ini

21:26Wah menarik

21:29ini berarti eh rapper di dari web performance API ya?

21:37kalau mau hitung sendiri dari performance API bisa

21:42low levelnya berarti performance API ini ya?

21:45salah satunya yang digunakan aja ya walaupun yang tadi yang apa yang di webhackers itu buat browser kan ya

21:53ya betul pakai juga seru ya bikin juga pakai API yang sama masai underlying API nya dia

22:06sebenarnya pakai library yang sama coba mungkin ke library tapi mungkin pakai lebih tepatnya

22:14pakai spek yang sama ah ya spesifikasi yang sama tapi kan jes itu kan V8 enggak ngaruh ya enggak

22:25ngaruh enggak ngaruh ya tetap pakai spek yang sama beda V8 kan runtime bukan ya runtime ya

22:31mesinnya mesinnya ya engine-nya ya ini pakai performance normal ini bukan itu sudah lama

22:38performance total cuman apa yang diukur mungkin apa yang diukur beda ada coba kita lihat perbedaannya

22:47performance.measure performance observer ini sama nggak? performance observer ada juga di web API

22:57apa saya kembali-kembali sekarang ya sebelumnya mungkin ini enggak ada tetapi di web ada ya

23:04performance.now itu

23:06iya performance

23:08maksudnya performance.now itu sebelum

23:11di web udah ada lama

23:12cuma yang saya belum tau

23:15di node ada gak?

23:16mungkin gak ada

23:17jadi kalaupun sebelumnya gak ada

23:21ya orang apa maintainernya

23:23node kan timnya node

23:24ngeliat oh ya ternyata itu relevan

23:27dan berguna buat diadopsi ke node.js

23:29bagus lah, maksudnya kan jadi makin streamline

23:31kayak dulu tuh

23:32bingung banget kenapa fetch bisa di browser tapi kalau di server nggak ada fetch

23:38harus install not fetch atau semacamnya

23:42ini kan kasusnya mirip kan cuma di bidang measure apa mengukur performa

23:47cara pakai sama persis loh ini nggak ada beda sama yang JS

23:52berarti speknya sama

23:53saya curiganya Node.js sekarang-sekarang ini memang sedang mendekatkan diri dengan web standar ya

24:00fetch udah di-include kemudian web socket mulai mau di-include nggak tahu udah apa belum

24:08nah beberapa API-API yang standarnya web juga diadaptasi juga ke node.js

24:15kalau gitu baguslah jadi bisa diukur juga dengan berarti javascript yang sama bisa dipakai di

24:23masih di yang sama dengan server walaupun pengukurannya mungkin berbeda ya ininya dimensinya

24:33berbeda ya Iya yang diukur lain beda alam berbeda beda alam tapi sintaksnya sama oke next apalagi nih kalau

24:46dari saya tadi udah web of humans API ada yang menarik lagi nih ini enggak tahu ya tapi ini

24:51belum jadi API ini baru proposal proposal kita dulu pernah ya di episode entah berapa kita bahas

24:58proses dari pertama mengajukan proposal sampai di apa adopsi jadi standar ya entah episode berapa

25:05cari sendiri nah ini berarti statusnya masih stage one ya stage 1 ya masih stage 1 jadi ceritanya

25:14eh ECMAScript ingin menambahkan type annotation atau wah ini pasti bahan perdebatan banget nih

25:24di Twitter atau di Hacker News orang pasti pada bisa jadi kontroversi ya tujuannya adalah

25:32Oh biar kalau misalnya apa nggak perlu transpilasi type bisa langsung jalan di browser ya

25:41ini juga sekaligus apa ya sekaligus membuat node.js kembali berkembang karena kan yang

25:54membuat orang yang berapa ya contohnya saya kemarin pengen pakai typescript tapi males

26:00pakai typescript compiler karena agak lambat jadi saya memilih pakai antara denu atau bun

26:05karena by default mereka udah bisa transpilasi udah bisa kompilasi ke typescript nggak perlu

26:10pakai transpilasi kan gitu kan kalau ini udah di approve kemungkinan besar node.js juga kena

26:16efeknya dan mungkin bisa jadi native typescript bisa jadi native nggak perlu ada transpilasi lagi

26:22transpire lagi Oh tapi paragraf satu itu menarik deh yang atas blablabla kalimat keduanya lebih

26:31cek by type checker netis nor external to JavaScript jadi maksudnya JavaScript nya

26:38JavaScript nya sendiri enggak dipaksa untuk jadi opinionated mengadopsi typescript atau

26:45flow moshe apa behavior type checking nya enggak enggak perlu punya opini tentang itu ya udah kalau

26:51runtime dicuekin aja yang komen cuma berarti kan kalau misalnya apa berarti kita harus semacam

26:59mendefinisikan type checker eksternal kan pas lagi mau jalanin type check-in semacam

27:07jasdok atau semacam flow kali ya bukan bahasa yang di bahasa superscript seperti typescript

27:13kita lihat lagi contohnya nih

27:16coba kalau gue mengerti maksudnya

27:18misalnya variable itu

27:21didepensikan type-nya

27:22integer, berarti dia gak ini ya

27:25sebenarnya gak peduli ya

27:26cuma bisa menerima

27:29warning aja

27:30gak error, maksudnya itu

27:33gak dianggap sebagai syntax error

27:34syntax error, hanya warning

27:37oh, kalau sekarang

27:38kalau sekarang syntax error ya

27:41kalau sekarang

27:42jalan-jalan kalau ya begitu batik Oh batik diignore gitu ya Oh iya kalau pakai jesdo

27:50kan kayak gini kan Iya kayak yang pertama ini kan Nah kalau proposalnya diterima nanti akan

27:56jadi seperti ini nah tapi oke tetapi string tapi miskipun dirantai salah pesatunya salah

28:05enggak ada masalah ini hanya untuk warning develop pada saat development aja

28:14alias enggak berisik kayak compiler kayak transpolnya si typescript itu

28:23ini nya kompilernya berisik tuh kalau salah kalau kita ingin diganggu kan ya maksudnya masing-masing

28:33developer terserah mau install mau apa pake tools itu kalau direset dulu gitu atau mau yang loose

28:41kelihatan bisa ya bebas ya Oke oke ada lagi nextnya nextnya terus ke bawahnya coba lihat

28:51ke bawahnya ke bawahnya ya maksudnya apa? Deskripsinya kayak gimana? sama pakai titik

28:59ya ini yang nanti ya tapi jadi susah banget ntar itu kan ada dikira objek

29:21bisa dikira objek, bisa dikira kondisional

29:25kan tanda tanya

29:28bla bla bla

29:29titik dua gitu kan oh yeah sedangkan kalau tanda tanya titik ya ah itu urusannya si

29:41programmer browser lah yang mikirin itu

29:43akan dibayar sama google

29:45sama apa sama apple sama

29:47firefox

29:48belum tentu juga diterima ini proposalnya ini

29:51cukup kontroversi sih pasti akan

29:53ada product

29:54sama pihak browser

29:56karena males implementnya

29:59nanti yang duluan nanti itu Microsoft Edge yang duluan karena kan typescript dikembangkan di

30:08Microsoft kan, sisa satu entity. Tadi pas di jalan juga sempat dengar podcast kan ada apa kenapa

30:20typescript itu jarang ada tools yang kayak misalkan type checking only terus ternyata kata nggak tahu

30:27ini bener atau enggak ya bisa ditek benerannya atau kalau salah tolong dikoreksi katanya typescript

30:34itu tidak open untuk spesifikasinya tuh bahas secara bahasa enggak ada enggak di open mungkin

30:41sama Microsoft ya jadi terus seperti biome yang yang apa yang baru kayak linter gitu dia mau

30:50cek typescript itu biar itu menebak-nebak sendiri jadi enggak ada spesifikasinya seperti JavaScript

30:59kalau kita mau bikin parser untuk JavaScript kan udah ada spesifikasinya kan gitu kan kita

31:04mau bikin engine ya kita tinggal ngikutin aja ya typescript enggak ada berarti emang semi apa ya

31:13Hai semi-semi close-up lah ya ya semeter tutup bukan tertutup kodenya tapi cara kerjanya ya

31:24prinsip kerjanya harus melihat source code-nya kan bukan spesifikasi ya begitulah scroll ke yang

31:33menarik ke bawah efeknya tuh kalau misal kalau yang kodingan ini sih ya udahlah kayak gitu

31:39artinya pahamlah ada efeknya di bawah-bawah lagi hausian generik suhu ada jenis gaya

31:48berita script lain intinya type script semua sih ada di sini

31:54omit it cuy Ken ada yang up for debate itu juga menarik ambien file apa DTS

32:04function overload

32:06ini kue peh

32:10kayaknya surem deh

32:11kagak lolos kayaknya

32:13yaudah

32:14lanjut lanjut

32:18lanjut lanjut

32:20oh 3 tahun yang lalu

32:22udah 3 tahun ya

32:23nah

32:25ini optional

32:29jadi argumen, saya argumennya proposal ini

32:31ada kebutuhan dari ekosistem

32:35ini solusinya

32:37tanpa mengharuskan semua developer

32:39untuk pakai type checking

32:41terus yang paragraf ketiga

32:47menarik

32:47bukan perkara javascript

32:51harus punya type atau enggak sih

32:52cuma kalau mau pakai type

32:55gimana caranya

32:56gimana cara

32:57bekerja javascript bisa bekerja dengan

33:00type

33:01oke seru ya masih ini argumen dari sudut pandangnya si proposal ini terus Kenapa

33:13enggak bikin type system sekalian jadi TC 39 di apa itu nya ya badan yang membuat ECMAScript

33:22ini nih is wrong wireless go around web compatibility

33:29jadi secara implicit ini kayaknya kayak kita dikasih tahu nggak akan

33:37gak JavaScript nggak bakal bisa berubah sederastis itu ya entah itu perkara type

33:43atau apapun kedepannya nggak bakal bisa ada perubahan drastis karena nanti nggak

33:48backwards compatible kan Yes bikin dua rantai banyak di browser ya gede lah bentrok nggak jadi

33:57bentrok bisa antara satu sama-sama sama-sama modifi dong ngaco nanti yang satu iya butuh

34:09jokowi 2 sama jokowi 3 nanti nanti ada bikin terus ya oke oke lanjut lanjut lanjut kita lanjut ke mana lagi nih apa ya yang menarik ya spesifikasi itu tuh sorry apa

34:35speculation

34:35speculation rules API

34:38speculation rules nah ini juga baru nih menarik nih

34:41wah ini baru banget ya

34:43baru banget

34:44fresh from the oven

34:46ini ada videonya juga ya

34:51jaseline

34:51iya

34:53pernah kita undang kekian bukan jengkelin ya jeslin itu zaman jengkelin TV show zaman kapan

35:05intinya ini untuk mengkustomize behavior prirender atau privets kan dulu kita semua ditaruh link

35:13apa link teks tuh terus ada yang di ada yang obsolete ya prirender kayaknya terus agak bingung

35:20buat behaviornya antara satu path dan lainnya.

35:26Nah, ini dibikin kayak satu blok untuk mengatur behavior pre-fetch

35:32atau pre-render yang kita mau dan semacam prioritas lah,

35:36semacam urutannya.

35:39Si browser bisa diberikan power untuk nge-prediksi,

35:45meng-spekulasi apakah link itu akan di klik atau enggak, di-render, di-prefetch atau tidak.

35:59Jadi browser yang akan menghitung opportunity itu, probability itu berdasarkan history yang ada di browser kalian sendiri.

36:10jadi gak ada hubungannya sama

36:13terparti jadi berdasarkan

36:15berdasarkan kita punya

36:17behavior sendiri

36:19berarti ini kayak

36:21apa ya

36:22recommendation system ya

36:25ini pake AI

36:26lebih tepatnya

36:29seperti

36:29guest js pernah denger gak

36:32ya ya pernah

36:34itu buatannya google juga

36:37itu dulu guest js

36:39bukan pakai S

36:41S nya menebak

36:42iya iya iya salah

36:44ini

36:46salah satu library yang pernah

36:49saya mau

36:49coba

36:53untuk client project tapi

36:55gak berhasil saya

36:57ini

36:58karena harus

37:01konek ke

37:02harus konek ke itu harus konek ke

37:05google analytics

37:06jadi

37:08data Google Analytics kita

37:10kita kasih, masukin ke

37:12connect ke

37:14ke library ini

37:18nanti

37:19dia connect langsung

37:22yang

37:23ribet lah setupnya

37:26oh, udah ada buat next.js

37:28sebenarnya ya

37:29oke

37:32dan ini kan

37:34contohnya semua

37:35lanjut lanjut lanjut

37:38ya itu kan contohnya semua kan rata-rata kan sudah pakai webpack atau Gatsby segala sesuatu

37:44saya kan static saja pakai WordPress dan setupnya jadi ribet karena bukan bukan kayak prefetchingnya

37:52seperti SPA gitu kan jadi sebenarnya saya pakai yang static gini gitu dan di belakangnya itu

37:58pakai note jadinya ribet tetap nggak ada ya dengan PHP sudah lah nah kalau pakai ini nih

38:13spekulasi ini semuanya di web jadi prefetching dan prerender si webnya yang menentukan berdasarkan

38:24kita coba langsung ke example nya deh

38:27ini dia

38:30prerender

38:34when, where

38:36and make

38:38slash log out

38:41or no prerender

38:42kalau prefetch

38:45kalau url nya

38:47next.html atau next2html

38:49enak ya

38:52Ini bisa dibedakan setiap halaman kan, jadi kita bisa nge-build role itu berdasarkan server site render.

39:03Jadi misalnya saat lagi di page apa, saya bisa kasih role itu, saya di landing page, maka yang saya kasih role-nya pre-fade atau pre-render thank you page.

39:15Karena siapa tau sudah selesai, waktu dia muncul thank you page, cepet.

39:19karena kita yang

39:26dari sisi server

39:27nah

39:28hmm

39:31menarik menarik menarik

39:32nah ini juga

39:33kalau artikel yang lebih enak dilihat itu tuh di chat

39:38gimana gimana

39:39oke

39:40ya ke ini dulu deh

39:42ke bahannya Eka dulu

39:44nah speculation rules improvement

39:48sambil nunggu loading

39:50yang menarik buat saya ini nih bagian ini nih

39:52bagian ini nih and so make sense for multi-page application rather than single-page application

39:56karena kan sekarang trennya tekan menuju ke MP kan balik ke MPN banyak Iya dengan ada react server

40:07komponen lah ada spell kit ada quick ada macam-macam kan ada Astro juga jadi dengan apa

40:15si si pengembang web juga dia melihat Wah nih kayaknya terakhir menuju MP3 make sense akhirnya

40:21dibuatlah spekulasi nge-roll API ini mungkin gitu ya dan kalau pakai kalaupun ada client-side

40:29routingnya neke mesin XJS gitu ya akan kalau misalnya emang support it bisa pakai client-side

40:34routing tapi kan sebetulnya itu SSR juga kan jadi bisa dianggap bisa punya bingung VR MP juga

40:40benar-benar ditambah lagi dengan apa tadi ya transition API udah deh lengkap Iya dokumen

40:53rules rules nya dalam bentuk script begini ya apa jesen jadi nggak ngerender sama browser ya

41:02kan diskip diskip dan juga enggak di script ini kan dia enggak waktu di-paste dia nggak

41:09dipeduliin gitu kayaknya blablabla dicoyokin nggak blocking nggak blocking sama sekali

41:16nggak blocking di domnya cuma ngasih tahu ke si browsernya sendiri apa mesin mekanisme

41:24Browsernya

41:25Oh bisa pakai CSS selector

41:29Tadi

41:29Oh menarik

41:31Berarti kita bisa ngasih link itu

41:33Oh saya mau link ini

41:35Di pre-render

41:37Link itu gak ada

41:38Bisa

41:40Karena kalau logout di pre-render

41:42Dia ke logout terus

41:44Iya kan

41:46Iya bener

41:48Kan kalau link logoutnya di pre-render di belakang

41:51Dia bakal ke logout terus

41:52Dia manggil logout

41:54Oke berarti bisa bisa prerender ini mungkin ini ini op-in gak sih by default yang enggak kan

42:08maksudnya enggak by default yang ada enggak ada spekulasi Woi apa itu Oh katas katas ada

42:15warning-warning Oh ya merah-merah kosong ini oferspesialisasi itu over-reviewing CPU kos dia

42:28baca dari mana Oh dia baca dari history browser kita ya bukan hati-hati kalau terlalu banyak yang

42:35kita spekulat dan untuk mint untuk minta dipercaya masalah satu halaman kita mungkin halaman kita

42:41yellow pages yellow pages ya kan terus kemudian ada 10.000 link masih kita pre-render semua ya

42:49ngedos ngedos server kita sendiri kan maksudnya gitu dan browsernya juga kan apa main threadnya

42:58mungkin kerjanya jadi ekstra ya karena ngecek satu persatu ini wah ini relevan nggak ya perlu

43:03freehatch atau prerender atau enggak

43:05ini keren nih

43:12kalau misalnya kita

43:13keren nih kalau misalnya ini

43:14prerender ini

43:16digabungkan dengan

43:18intersection observer kali ya

43:21atau lazy load

43:22jadi semakin orang

43:23ingat nggak kalau misalnya kita yang pakai

43:26kayak twitter kalau scroll

43:28baru dia muncul

43:30kan kalau pakai ini

43:32bukan maksudnya hanya link yang ada di above the fold itu yang muncul itu yang

43:44tidak usah sampai semua iya mungkin saya bisa saya nanti bisa feedback kalau itu

43:56dikombainya sama view transition yang level 2

44:00wah seneng banget tuh

44:03MPA, SSR udah kayak nanti lama-lama

44:08hampir gak bisa dibedain sama SPA ya kan

44:12karena di klik nih secepatnya udah diambil duluan

44:15langsung fade in fade out iya seperti ini memang trendnya memang diarahkan ke sana kali ya diarahkan ke sana perbedaannya atas sama bawah ini chrome only atas sama bawah ya lihat oh source ada

44:33source-sourcenya dokumen kalau di bawah apa enggak ada source-nya baca penjelasan lah di atas

44:40make the source key optional

44:44since, oh gak harus

44:46pakai source, karena bisa

44:48di-invert dari

44:50URL atau

44:52where, oh gitu

44:54these two speculation

44:57rules are identical

44:58ini dianggap sama

44:59karena udah ada where-nya, browser bisa

45:02mengkalkulasi sendiri

45:04bisa ngira-ngira sendiri

45:07jenis source-nya itu apa

45:08nggak masih pakai script lo bisa pakai http header loh turun tuh bisa pakai

45:14Oh iya iya itu ah ini etik di webserver ya Iya jadi kayak ini kayak manifest.com Jason

45:29Hai adik manifest di kayak manifest

45:32Alright Scroll ke bawah ini seru sih udah ada beberapa yang mengadopsi walaupun masih

45:45baru ya dan hanya masih bisa satu domain kan ya nggak bisa juga cross-domein kan

45:51ya coba coba coba di klits

45:57ntar habis lo ininya cateringnya

46:02udah warning buka buka buka sambil buka DevTools Network sambil buka YouTube

46:12terus kalau kita over dia akan muncul gitu ya

46:26makasih ya kita coba coba reload Oh ya dulu ya

46:35sudah ini common fruit Oh ini masih kamu

46:45over its link to the render it mana ini bukan chrome-nya udah Chrome 124 belum

46:58ini bukan chrome kanari kanari oh 126 126 malah kenapa ya nggak bisa coba-coba

47:09coba ke jadi penasaran api support in this browser support edit speculation rule-rule

47:18yang suruh dibuat sendiri gitu bukan bukan sudah ada sudah sudah edit aja kan moderate

47:26kemudian ini di application bukan di Network Oh gitu eh application mana ya

47:35speculation Oh ada spekulasi ya ya

47:41bisa di-roll di-roll di-roll

47:47ini ada warning

47:56ya speculation coba 18 not trigger ya baru ruleset dipencet aja kamu itu udah teringat

48:05ke-16 juga oh speculation speculation nah ini jadi kalau olive diklik maka dia udah langsung

48:18render ya 404 enggak ada beneran contoh behaviornya coba ke yang 404 yang ini enggak

48:38tapi enggak tahu itu pakai ini halaman ini pakai website ini Iya iya iya iya

48:48ini kan merangkap demo macem-macem API baru ya lagi persiapan lagi persiapan

48:56Google I o ini biasanya Oh ini teaser berarti ya teaser ya ternyata episode

49:07adalah episode teaser untuk Google Ayo 2024 tentang web ya kita enggak tahu kita sendiri enggak tahu topiknya apa masih coming soon tapi kita ini pasti masuk deh Oh iya iya iya iya berarti ini ditambahin baru ya ada background service sendiri ya

49:29kita asumsinya kan network ya asumsinya network

49:41ternyata behavior baru ini kayak di-streamline di satu tempat terpisah

49:49balik ke screen yang tadi deh yang developer chrome.com yang blog post

49:56blog post yang ini ya

49:59yang ini

50:01ya nah scroll ke bawah

50:07bawah lagi

50:09Nah ini yang penting platform support

50:11Apa? Atas sedikit

50:12Masih lagi proses

50:15Standarisasi

50:16Jadi seneng boleh tapi jangan seneng-seneng

50:19Amat

50:19We are also working hard to standardize the API

50:23Lewat WICG

50:24Jadi masih dalam proses

50:26Kalau misalnya pengen tau diskusi-diskusinya

50:29Ya mungkin itu bisa di

50:30Klik

50:31Sudah ada wordpress

50:34Sudah ada wordpress

50:35Sudah ada pluginnya

50:38spekulasi mudah ada Wow cepet sekali ini sebab ini tingkatnya spekulatif juga sebenarnya belum

50:47diadopsi banyak browser ya spekulasi aja udah bikin lagi aja saya percaya sama yang seru

50:55Kenapa tuh ya itu pada adopsi juga Scroll aja ke bawah Oh Astro udah Wow cuma mungkin

51:06experimental tapi ya seru sih dulu pun waktu view transition API yang level 1 itu salah satu yang

51:17pertama kali mengadopsi meta framework itu astro yang paling terdepan paling pertama baru-baru

51:26launching 4.2 kan berlunching kan dia ini poin 2 Januari sih masih eksperimental ini soalnya

51:41yang Januari kemarin 4 poin berapa ya 4.4 ya yang baru ya enggak tahu 4 sekian lah ya intinya udah

51:54nama ini ya define config untuk konfigurasinya

51:57prefetch to experimental client prerender true

52:00nice coba tuh contoh penggunaannya scroll ke bawah

52:05if the document prerendering render disable

52:11oke sederhana

52:14seru sih astro itu salah satu meta framework yang

52:19aktif mengadopsi standar web API

52:23jadi punya approach yang beda ya kalau next.js kan dia semua dia bikin sendiri ya walaupun

52:29eventually kalau web API nya ada ya akhirnya di apa streamline juga cuma kalau astro pendekatannya

52:35apa kejemput bola lah ke web API yang baru yang masih experimental pun dipakai ya cuma di di

52:42jadi mereka juga experimental juga jadi enggak ngeganggu yang stable

52:48uh oke mudah ya lanjut satu lagi atau dua lagi Nah kalau dari saya ada ini nih apa Jason modul

53:00apa touch Jason modul itu kalau dulu atau pun sekarang kalau misalkan kita mau import dari

53:09jesen kan harus pakai bundler kan ya at bander biasanya kalau dari webpack itu ada extensionnya

53:16untuk loading jesen nah ini sudah netizen untuk bisa bahkan untuk bisa batu bisa baca jason

53:25udah import-import dari jason bukan import dari jason Jadi kalau kita punya jesen data kita bisa

53:35langsung nggak perlu pakai plugin nggak perlu pakai bander ya nggak perlu Jason pars enggak

53:44perlu desain betul Wah ini dulu bagian dari import atribus proposal apalagi itu bad it

53:52was resolved waktu meeting musim 4 tahun lalu Juli 2020 disepakati dipecah jadi proposal yang

54:00beda nice motivasi yaitu biar bisa bang biar bisa mengimpor jason file ya kalau yang begini semua pasti langsung setuju kalau yang tadi type apa type terlalu berani netik opinionated soal betul betul ada orang yang suka tapi di

54:24sisi yang lain kan kita si web ini harus menjaga tetap menjaga kompatibilitasnya kan tetap harus

54:30bisa membuka web dari tahun kapan gitu kan jadi agak berat sih bakal bakal ada enggak sih di

54:37obsolete gitu at some point Iya kalaupun obsolete nggak boleh breaking kan kayak

54:44misalnya Markli atau apa bling gitu enggak enggak jalan tapi kan enggak

54:49rusak kalau tapi kemarin ada tuh yang obsolete kemarin ada yang obsolete

54:54Iya ada ada ada ada bukan Marky temennya Marky center center center oh iya

55:03tapi kan gak breaking kalau cuma HTML tag ya gampang ya cuma kalau misalnya apa Iya kalau

55:10udah ada yang pakai center browser gimana tuh ya nggak papa di render jadi kosong kali masih

55:15di render div biasa ini kan kita ngerender element diperkirkan maksudnya bukan asole

55:25hilangkan nggak deprikated no longer recommended dosa Oh ya bakal dihilangkan dipakai itu bakal

55:33dihilangkan kan dihilangkan dari webstandard akan dihilangkan terus kenapa market tetap tetap

55:41eksis ya karena bagus bagus karena masih banyakannya accessibility nya kurang bagus

55:48ya lebih kompetibel aja sih dengan resiko masih bagus di zamannya bagus di zaman karena masih

55:57banyak yang pakai ternyata center itu enggak banyak yang pakai orang udah pakai mungkin udah

56:03udah pada pakai excel line center aja udah pakai bagri jadi udah lebih ini ya kali ya udah lebih

56:11Iya banyak yang mau saya banyak alternatif CSSnya.

56:15Kalau Markui bisa pakai animasi tapi kan repot.

56:17Nggak bisa balik lagi.

56:19Iya benar-benar.

56:21Oke oke.

56:23Jadi ya.

56:25Mana tadi? Kita balik lagi ke ini ya.

56:28Jason ya.

56:29Udah gitu aja.

56:31Ya sederhana sih.

56:32Cuman impactnya lumayan.

56:35Iya.

56:36Udah loh.

56:38Berguna sekali.

56:39kalau kita misalkan mau load dummy data gitu ya, dummy datanya dalam bentuk JSON

56:44atau bukan dummy data aja, mungkin data yang diimport dari gimana gitu kan,

56:48filenya dalam bentuk JSON.

56:50Kita punya config custom atau semacamnya.

56:53Iya, config, betul. Bisa dibaca langsung, bisa diimport langsung.

56:58Malah import, eh kalau import CSS itu CSS module ya istilahnya ya?

57:03Oh iya, sama ya.

57:04Iya, ada syntax CSS module.

57:07Iya, iya, iya. Benar, benar.

57:08status stage 3 stage 3 belum berada udah tapi udah hampir udah tinggal tinggal tunggu potong

57:17kita aja tunggu peresmian isunya apa nih isunya masih ada isu because feedback should name Jason

57:26module import by be a part of tahun lalu gila 2022 sih Oh iya ini last month ya udah aman

57:36ya ini ya bentar lagi ya aman lah stage 3 tuh kan udah apa hampir pasti ya itu lolos Alright

57:45ada lagi ada lagi yang menarik-menarik itu deh apa minor minor tapi lumayan sih yang HTML

57:53set HTML ya oke nah ini ya Nah cuma ini kepakainya cuma untuk kalau kita pakai

58:07custom element alias webcomponent komponen baru dengar ini masih udah pernah dengar

58:16beberapa hari lalu nih set HTML handset save kalau HTML biasa kan pakai inner HTML aja kan

58:23kita mau memanipulasi mengupdate suatu DOM ya apa bla div mydiv.innerhtml sama dengan HTML

58:33isi HTML nya tapi kalau custom element alias web component kan nggak bisa tuh nah sekarang jadi

58:40bisa udah gitu doang sih intinya contohnya kalau misalnya kita bikin shadow-shadow DOM harus pakai

58:46unsafe ini ya kan kalau nggak diparsing Oh ya kalau nggak diparsing ya ini ya

58:52replacement for inner HTML replacement

59:00ya it behavior nya sama kayak inner HTML cuma yaitu bisa buat

59:09custom element gitu jadi mau kalau kita pakai buat HTML biasa juga bisa

59:14ya maksudnya kalau kita punya custom element misalnya oh ya kayak apa kayak date picker

59:25date ya date custom element tapi date kan sudah disupport kalau yang kita bikin sendiri nggak

59:30bisa kalau pakai inner HTML dia harus pakai HTML unshift ini HTML unshift oke oke jadi kayak

59:40do itu jadi kayak siriak aja set HTML dangerously set HTML cuma ini trend yang kocak tapi menarik

59:54ini juga, kan sebenarnya

59:56itu behaviornya sama kayak inner HTML

59:58cuma bisa, dengan tambahan

1:00:00bisa pakai web component

1:00:02custom element, cuma sekarang jadi

1:00:04ada unsafe-nya gitu, maksudnya

1:00:06buat menekankan bahwa

1:00:08silahkan kalau misalnya datanya

1:00:10dari sumber datanya ada

1:00:12unsur eksternal, silahkan

1:00:14sanitize sendiri, bukan urusan kami

1:00:16kayak dari segi

1:00:18sintaksnya, yang emang jadi

1:00:20ngetriak gitu sih, dangerously

1:00:22set inner HTML

1:00:23TML dulu pas pertama kali belajar terus pakai tokek ini bercanda beneran ada dangerous riset

1:00:30apa inner.tml banyak tuh kalau ria gitu dia memang ciri khasnya gitu ya huruf besar semua

1:00:40terus kadang-kadang ada yang mau depresi dia tulis dulu kan will be depresi tetap belakang

1:00:45biar enggak enggak banyak yang cuma di dalam kodenya apa sih dulu kan kalau lain terakhir

1:00:51ada yang gak boleh dihapus

1:00:53ada komennya

1:00:54if you delete this, the sky will fall

1:00:57atau apapunnya ada komen

1:00:58ada bagian yang gak boleh di

1:01:00delete

1:01:01oke

1:01:04oke

1:01:07nah ada lagi web API yang baru

1:01:10di 2024 atau sebelumnya

1:01:13ini aja

1:01:13belum kesampaian

1:01:15interop aja

1:01:17yang menarik

1:01:19yang Zoom. Oh iya, kita udah bahas Interop 2024 belum ya?

1:01:24Udah kayaknya kan sempet yang kita bahas apa yang akan masuk di Interop 2024 itu pernah sudah sudah sudah ada jpeg excel itu sempat di sempat mau di ini tapi gak di ini

1:01:41interop 2024 ya

1:01:44itu di link gue kan ada tuh

1:01:47oh di chat

1:01:49di comment

1:01:49di chat oke

1:01:56yang sudah stable aja atau ke-13 yang mengenaskan tuh custom property di Firefox kayak gimana

1:02:12ya mungkin yang masih yang kan suka degenerasi terbaru enggak yang apa dulu kan banyak nih

1:02:31bagiannya coba aja Nah itu at property animation jadi yang buat animasi atau buat apa enggak ada

1:02:38atau yang mana ya variable untuk memasukkan eh banyak at property at property gitu loh

1:02:52oh oh decorator decorator kayak decorator gini kan kayak decorator bukan decorator kaya kaya

1:03:01ada banyak kan ada beberapa mau dia eh enggak enggak itu enggak ini propertika skate properti

1:03:13Oh dia enggak enggak support properti properti schedule semua enggak ya itu kelihatan satu

1:03:20musik satu paket deh maksudnya itu fitur-fitur yang sebenarnya harus kerja barengan pada Firefox

1:03:27itu tuh kalau soal CSS apa image-nya apa identiknya Firefox yang paling pertama ya

1:03:33kayak grid dulu Chrome pun belum support grid Firefox udah support duluan

1:03:38ini gambar apa ya ini ini Linux ini apa ya itu Chrome di Linux maksudnya yang ini

1:03:48kayak react gitu tapi bukan sih kayak logo ria kau Windows bukan apa ini stas cluster logo pas cluster coba aja

1:04:08Hai pasarnya dia kali tahu deh hehehe apalagi interop 2.2.2.4 ini ya yang tadi ya

1:04:19atau TPS yoram for socket tuh kayaknya batik udah mau udah udah stabil tuh Firefox sama

1:04:32Safari yang paling duluan over tadi udah kita bahas ya udah hampir CSS nesting juga nyaris

1:04:44ini ini experimental loh top XO ya kalau mau tetap stable itu tetap tetap nah stables CSS

1:05:00itu Sun kayak coming soon to the most

1:05:03soon ya ya

1:05:04index DB udah

1:05:06bisa dibilang udah ya selesai ya

1:05:09udah

1:05:09ini ya

1:05:14just kasihan

1:05:15powerfox safari

1:05:20paling aktif cuma nyusul kok

1:05:22tadi kan yang dikatakan

1:05:24sudah hampir

1:05:26sudah selesai

1:05:27oke

1:05:30x-rap balance

1:05:32airfox udah duluan

1:05:35iya

1:05:36oke

1:05:38oke, sip

1:05:42ada lagi?

1:05:45hmm, udah dulu

1:05:46mari kita tidur

1:05:46ya, jadi

1:05:52itu dia, mungkin

1:05:54daftar apa ya, web API

1:05:56baru, atau yang tidak terlalu baru

1:05:58yang bisa dicoba

1:05:59ya tapi mungkin baru masuk baseline baru stabil di semua bahkan tadi kita bahas yang tapi

1:06:09notasi itu bahkan masih setiap satu artinya masih perdebatan tapi belum tahu cuman yaitu bisa jadi kontroversi dan menarik diikuti ya tapi menarik buat cara mikirnya maksudnya argumennya terus kayak pro kontranya

1:06:22ya ya ya

1:06:23kalaupun nanti gak diadopsi kita punya ya kayak kita punya insight ke situlah

1:06:29mau update sekalian hari ini kemarin gua itu kemarin kan gua nyoba paski

1:06:36kan waktu tahun lalu

1:06:38waktu ngasih presentasi paski itu

1:06:40masih ngebug di firefox

1:06:42dan belum support

1:06:44bahkan fatal error

1:06:45sekarang sudah lancar jaya

1:06:47pasti sudah lancar jaya

1:06:50di firefox

1:06:51web outen

1:06:54web outen

1:06:56sudah stabil

1:06:57sudah stabil di firefox

1:06:59thank you firefox

1:07:01akhirnya saya bisa

1:07:02begitu sudah coba udah bisa

1:07:04Oke, berarti sedang mempersiapkan beberapa materi.

1:07:10Iya, materinya saya kerjakan ini proposal,

1:07:12jadi saya mau submit-submit ke klien.

1:07:15Ayo, nanti pasti.

1:07:18Mantap, mantap.

1:07:20Dua tahun lalu saya mulai kerjakan,

1:07:22setahun lalu saya promosikan, sekarang baru bisa dipakai.

1:07:25Tahun lalu talknya event semua tentang paski WordPress lagi nih.

1:07:30Iya.

1:07:30Iya oke nah mudah-mudahan apa ya masih banyak sih yang bisa kita kulik sih sebenarnya cuman ini yang

1:07:41yang menurut kita menarik ya kalau menurut teman-teman apa yang dinanti-nanti apa sih

1:07:45boleh di kolom komentar meskipun kita tidak live tapi kita akan baca ya komentar juga boleh kita

1:07:53teman-teman kirimkan ke kesana.inselasengobrodenweb

1:07:56topik atau narasumber

1:08:00atau apapun bisa kirim

1:08:02ke sana nanti kita diskusi-diskusi juga

1:08:04jadi untuk malam ini

1:08:06sekian dulu

1:08:07kita ketemu lagi minggu depan

1:08:10mudah-mudahan minggu depan kita bisa live karena ini

1:08:12tidak live tadi lupa ngomong ya

1:08:14langsung masuk

1:08:16ke materi ya malam ini

1:08:18kita tidak live karena satu dan lain hal

1:08:21nanti mudah-mudahan

1:08:23minggu depan kita bisa live lagi dengan topik yang berbeda.

1:08:26Kalau gitu, udahan dulu.

1:08:27Selamat malam. Selamat istirahat.

1:08:30Bye-bye.

Suka episode ini?

Langganan untuk update episode terbaru setiap Selasa malam!

Langganan Sekarang

Episode Terkait

Web Performance Update - Ngobrolin WEB
EP 128

13 Mei 2025

Web Performance Update - 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...

Ngobrolin React Server Component
EP 129

21 Mei 2025

Ngobrolin React Server Component

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

Komentar