Ngobrolin Web Episode Perdana
Ringkasan Episode
Bantu KoreksiEpisode perdana Ngobrolin WEB, dibuka dengan perkenalan tiga pembawa acaranya: Riza, Eka, dan Ivan. Formatnya sengaja dibuat santai — mengobrol tentang teknologi web secara umum, bukan mengikat diri pada satu framework atau satu browser, dengan tujuan mengejar ketertinggalan dari perkembangan web yang bergerak sangat cepat. Masing-masing membawa satu topik. Topik pertama adalah Sanitizer API, sebuah web API baru yang membersihkan string HTML dari script berbahaya sebelum dirender. Selama ini kebutuhan itu ditambal dengan library pihak ketiga seperti DOMPurify atau — lebih buruk lagi — regex hasil salin-tempel dari Stack Overflow. React menandainya dengan nama yang menakutkan, dangerouslySetInnerHTML, sementara Svelte terang-terangan menyatakan tidak melakukan sanitasi sehingga tanggung jawabnya ada pada kita. Dari sini muncul prinsip yang sudah lama dipegang komunitas WordPress: sanitize early, escape late — bersihkan setiap input di pintu masuk, dan escape di titik output paling akhir. Topik kedua adalah Performance Insights, panel baru di Chrome DevTools yang memvisualisasikan proses render alih-alih hanya menyajikan skor seperti Lighthouse. Dengan panel ini bisa terlihat langsung elemen mana yang dianggap browser sebagai FCP dan LCP, di detik ke berapa layout shift terjadi dan apa penyebabnya, serta resource mana yang render blocking. Pembedahan situs berita sungguhan menunjukkan polanya: kerangka halaman dirender di server, tetapi kontennya baru diambil belakangan lewat client-side rendering, sehingga pembaca menunggu terlalu lama untuk melihat isi yang sebenarnya mereka datangi.
Poin-poin Utama
- •Sanitizer API membersihkan string HTML dari script berbahaya langsung di browser, menggantikan kebutuhan memasang library pihak ketiga atau menyalin regex dari Stack Overflow
- •Nama dangerouslySetInnerHTML di React dan peringatan di dokumentasi Svelte sama-sama menegaskan hal yang sama: merender HTML dari pengguna adalah tanggung jawab kita, bukan framework
- •Prinsip sanitize early, escape late: bersihkan setiap input di pintu masuk — form, query string, header — dan escape di titik output paling akhir, bukan di tengah-tengah
- •Fitur di balik flag berarti sudah ada di browser tetapi harus diaktifkan manual — biasanya tahap sebelum dirilis stabil beberapa versi kemudian
- •Performance Insights memvisualisasikan proses render, bukan sekadar memberi skor — jadi bisa terlihat elemen mana persisnya yang dianggap browser sebagai FCP dan LCP
- •Konten di atas lipatan jangan di-lazy load; targetnya adalah membuat FCP, LCP, dan DOMContentLoaded berdekatan, dengan CSS kritikal di-inline dan JavaScript yang tidak perlu ditunda
- •Skor yang berbeda antara Lighthouse online dan pengukuran lokal itu wajar karena lokasi CDN berbeda — yang penting bukan angkanya melainkan apa yang menghambat sebelum FCP
Halo, selamat malam, selamat pagi, selamat siang.
Selamat sore. Selamat penikmatik.
Berjumpa lagi, baru berjumpa pertama kali episode perdana ngobrolin web malam hari ini.
Bersama saya Riza dan dua teman saya. Siapa? Ayo, silahkan.
Halo, saya Eka.
Halo, nama saya Ivan. Temannya Mas Riza nih.
Asyik. Kita semua berteman. Iyalah, masalah musuhan.
Jadi, ini adalah episode perdana dari ngobrolin web. Ini inisiasi baru yang kita hasil diskusi dari weekend kemarin.
Kemudian kita beri inisiatif untuk ngobrol-ngobrol, santai.
Ada topiknya, tapi ngobrolnya santai. Tujuannya supaya bisa catch up dengan teknologi web yang berkembangnya cukup pesat ya.
Sampai saya merasa ketinggalan. Jadi, mudah-mudahan bisa dapat insight dari duarkan saya ini dan teman-teman lain yang ada di chat ya.
Betul, betul, betul.
Oke, mungkin kita bisa mulai dari menjelaskan tentang, ini acara apa sih sebenarnya?
Ya itu tadi kan.
Oh iya ya, udah jelasin ya. Salah ya.
Oh iya, ngobrolin web ya. Pokoknya semua hal tentang web ya. Kita nggak ngomong specific framework, kita nggak ngomongin specific browser.
Mau ngomongin browser apa? Battle browser juga boleh ya sebenarnya ya.
Boleh, boleh.
Iya, asal nyentok sih.
Setiap framework PSS, setiap CSS, nggak. Tapi, general. Tapi boleh aja kan kalau kita nyinggung X dan Y gitu.
Oh boleh, boleh. Pokoknya yang berhubungan dengan web ya.
Ya, teknik dan komparasi mungkin.
Ya, yang ada hubungannya lah, masih ada hubungannya.
Nah, tadi udah sempat kenalan.
Yang di chat juga boleh ngobrolin.
Kenapa, kenapa?
Yang di chat juga boleh. Kalo misalnya dapet, oh kalian salah. Betul, pokoknya yang paling oke ya. Nggak apa, pasal dikasih.
Ada berita-berita menarik, boleh di share juga di kolom komentar. Nanti kita akan highlight juga.
Oke, sebelum kita mulai mungkin perkenalan lagi. Tadi kan baru cuma nama doang. Sekarang kita kenalin diri masing-masing.
Boleh silahkan, Ivan duluan.
Lihat transkrip lengkap (2579 segmen lagi)
Ya, boleh. Halo semua, teman-teman, pemirsa, penonton, netizen, ceile.
Kenalkan dulu deh yang belum kenal saya. Nama saya Ivan Kristianto.
Saya seorang Google Developer Expert di bidang web teknologi.
Dan berprofesi sebagai senior web engineer di sebuah salah satu perusahaan agensi yang berkecimpung di dunia.
Yang lebih spesifik yang lagi itu di dunia web-web mengenai WordPress.
Jadi kita banyak develop mengenai di komunitas WordPress.
Dan saya juga aktif sebelumnya. Sebelumnya aktif.
Tahun ini sih berkurang karena kesibukan dan pandemi, tetapi sering dikenal karena aktif di komunitas WordPress di Indonesia.
Beberapa kali pernah mengadakan WordCamp, aktif juga di Meetup, WordPress Jakarta Meetup, dan sering isi-isi acara sebagai speaker juga di WordCamp.
Tahun ini ada WordCamp?
Tahun ini ada WordCamp, ada.
November di Gresik.
- Gresik. Wow. - Di Gresik.
Namun sayang sekali speaking ininya sudah ditutup. Jadi kalau berniat sebagai speaking mungkin sudah.
- Sudah penuh ya? - Sudah penuh.
Saya juga nggak sempat. Nggak masuk tuh. Nggak sempat. Lupa tanggal deadline-nya. Aduh. Ya sudahlah.
Tapi ada WordCamp Asia di Februari 2023.
- Di Thailand ya? Bangkok? - Iya, di Bangkok.
Jadi kalau misalnya Eka berniat, kenapa saya tunggu Eka? Karena Eka lagi mencari diversity speaker.
Silahkan. Jadi nanti saya kasih link-nya di chat nanti.
Ya silahkan apply. Cuma karena ini WordCamp open source, aturannya sedikit berbeda jika speaking di GDG.
Jadi tidak ada support mengenai travel dan hotel, nggak ada. Jadi agak sedikit berbeda.
- Oh nggak bisa ya? Gak bisa ya? Kalau GDI nggak bisa ya sebagai GDI gitu?
- Boleh dihajukan. Gue pernah dapat dulu yang dulu di sekolah Lumpur.
Namun kan dulu belum berubah peraturan dari Google ya. Coba aja.
- Bisa lah. Nanti minta tolong yang sana. Kan ada orang dalam kan? Bangkok JS kan? Si Warad kan?
Minta aja bikin JS apa gitu. - Iya, betul. Kan ada GDG Bangkok.
- Bangkok ada. Sekalian gitu. Dua hari gitu.
- Oke, lanjut. Sudah kenalannya? Enak tuh tehnya. Oke lanjut Eka.
- Halo, salam kenal. Nama saya Eka. Kerja sebagai web developer di sebuah NGO yang namanya Atma Connect.
Sama kayak mas Riza, sama Ivan. Aku juga Google Developer Expert di bidang web teknologi.
Terus aktif di mana ya? Sebenarnya nggak aktif di mana-mana sih.
Aku tuh nggak bisa ngomong. Maksudnya kalau ngasih talk tuh rada ngaco.
Makanya setiap kali ditawarin talk, aku selalu mau. Karena biar kepaksa latihan lah.
Biar kepaksa improve. - Bagus tuh tehnya tuh.
- Iya. Kita pernah satu panggung kan? - Pernah. Pernah.
- Tapi onnan juga sih ya. GDG pernah ya? - Dua kali pernah.
- Dua kali. - Gue sama Eka juga pernah satu panggung.
- Sebelum GDG kan? - Iya.
- DFS Bandung mau kalah. - Bandung ya?
- Iya. - Oke. Sudah? Lanjut?
- Mas Riza belum. - Siapa lagi?
- Oh iya belum ya. Halo teman-teman. Saya Riza. Sekarang profesinya masih co-founder Activate.
Berarti saya satu-satunya orang di podcast ini yang tidak bekerja sebagai software atau web developer ya.
- Kenapa sih? - Tapi...
- Tapi kan kamu ngajar. - Oh iya ngajar ya. Masih ngajar web lah ya.
Tapi saya sudah menggandungi dunia web sejak 2003. Jadi mudah-mudahan.
Mudah-mudahan ada insight-insert lah ya.
Oke. Sekarang kita langsung aja ke topik malam hari ini.
Ada masing-masing menyumbang satu topik. Siapa yang mau duluan? Eka boleh duluan?
- Full ya? - Kita share screen kali ya.
Share screen web dev. Oke. Eh kok di ini?
Jadi topik hari ini yang pengen aku obrolin itu namanya sanitizer API.
- Nggak ada hubungannya sama sanitizer yang kita pakai sehari-hari. - Hand sanitizer?
Nah, kalau hand sanitizer itu kan ngebersihin tangan kita dari virus ya.
Nah, kalau ini si web sanitizer API ngebersihin string yang mau kita render dari elemen ayah,
dari apapun itu action-action nakal yang mungkin diinjek atau disisipkan oleh ya malicious user atau hacker atau apalah.
Jadi kan ada kalanya nih. Biasanya kasus yang umum itu kalau kita punya CMS misalnya.
WordPress atau CMS lain yang ada post editor-nya tuh. What you see is what you get.
Nah, atau markdown parser atau semacamnya di mana user bisa bikin text-nya jadi bold atau masukin elemen dengan class
atau dengan atribut tertentu apapun misalnya apa, misalnya ada widget untuk memasukkan image grid.
Ya kan itu jadinya di kontennya itu ada elemen image misalnya.
Nah, itu tuh kan di save dan kita dari sisi web, dari front-end kita terima sebagai string.
String-nya kita render sebagai HTML. Ya kalau misalnya nggak ada script yang berbahaya, nggak masalah.
Tapi kan bisa aja tuh mungkin ada kebocoran keamanan entah di sistem CMS-nya atau di kode apapun.
Kan bisa kalau onload atau onclick atau apa bisa menjalankan action tertentu yang bisa bahaya.
Ya contoh simpulnya nih misalnya disisipin atau diselipin di saat image-nya loading atau saat konten kita loading,
dijalankan window location ref diubah URL-nya ke situs lain yang tampilannya mirip tapi sebenarnya phishing.
Terus user yang mungkin kurang text-safe ya atau kurang memperhatikan itu bisa aja ketipu dan masukin data login-nya.
Itu ya salah satu contoh aja kan bisa bahaya ya.
Jadi kalau misalnya kita pakai framework, misalnya kita pakai react kan ada tuh dangerously set inner HTML.
Atau misalnya kita pakai SWELT itu kita sebenarnya ada untuk ngerender HTML kan pakai direktif @html.
Cuma di dokumentasinya sama di tutorialnya itu dikasih warning, dikasih peringatan bahwa si SWELT sendiri ini
nggak men sanitize, jadi kalian harus bertanggung jawab untuk ngebersihin sendiri.
Ya kalau react itu dari namanya juga udah jelas kan dangerously set inner HTML.
Jadi ini bahaya loh, kalau misalnya kalau kita nggak tahu dan kita nggak mastiin sendiri keamanan string-nya bisa berbahaya.
Nah sampai sekarang ternyata itu belum ada solusi dari web API.
Jadi kita mesti pakai apa sih library tambahan, biasanya yang terkenal don't purify.
Atau kalau lagi buru-buru sih kita kopas aja kan dari stack overflow, cari regex yang ngedeteksi apalah on click dan script injection dan lain-lain.
Nah itu ya mungkin itu solusi sementara, cuma kan ini solusi yang lebih bagus, lebih permanen.
Jadi ya cara pakainya seperti di screen itu cukup simple dan by default ini setting yang paling aman.
Jadi script menjalankan script apapun, JavaScript apapun itu akan di strip, akan dihilangkan.
Tapi kita bisa nge-customize juga, ada beberapa apa sih, argument yang bisa kita masukkan ke situ.
Konfigurasi ini ya?
Iya, misalnya contoh kasus penggunaannya nih kita punya apa tadi, image gallery.
Ya kita emang pingin intentionally ada hal-hal tertentu JavaScript yang emang boleh dijalankan karena emang itu intended.
Nah itu bisa kita specify di konfigurasinya.
Jadi begitu dan ini sebenarnya proposalnya sudah ada sejak cukup lama dan sebelumnya juga udah dirilis di canary sama preview release.
Cuma sejak Chrome 105 dia udah masuk stable dan di Firefox di edge juga, edge kayaknya udah di stable juga, Firefox di flag.
Nah berita buruknya ini di safari belum.
Belum, belum sepenuhnya stable.
Cuma kalau misalnya kita cari, tadi sepintas cari udah ada poly fill-nya.
Cuma poly fill, kan sudah ada beberapa poly fill-nya.
Cuma mana yang bisa dipakai di safari 15, 16 juga kan lumayan banyak ya perubahannya.
Jadi poly fill mana yang bisa dipakai, misalnya safari 16 itu aku kurang tahu, belum tahu, nanti bisa di cek lagi.
Kalau di explainer-nya ini, justru ini explainer cukup lama sih dari 2021.
Jadi tulisannya itu masih harus pakai flag, tapi sejak Chrome 105 ini udah nggak harus pakai flag lagi.
Iya, ini masih Chrome 93 ya.
Iya, bahkan artiklenya belum di update.
Bisa loh kita update ini, bisa loh kita request untuk update.
Bisa ya, ini ada github-nya ya.
Bisa, kita bisa pull request ke sini.
Iya, betul.
Wah, ini menarik sih, maksudnya kalau dulu kan kita harus punya framework yang melakukan itu buat kita kan.
Tapi kalau misalkan kita mau vanilla JavaScript, ya bisa pakai yang ini kayaknya.
Ini udah langsung dari browser-nya, jadi nggak perlu terparti library lagi.
Enggak perlu install ini itu.
Langsung aja ya.
Coba pakai canIuse.
Coba canIuse ini.
CanIuse.
Sanitizer API ya.
Sanitizer.
Ini ya?
Iya.
Yes.
Ijo, ijo, edge, ijo, firefox, firefox masih ini ya, under flag ya, under flag.
Under flag itu artinya, mungkin ada, apa, bisa jelaskan.
Temen-temen mungkin ada yang belum tahu under flag itu maksudnya apa sih?
Under flag itu sebenarnya untuk feature yang udah pasti akan dirilis dan sudah masuk di stable,
di browser utama yang chrome ya, chrome biasa, firefox, dan lain-lain.
Tapi kita harus secara manual meng-enable atau mengaktifkan feature itu di setting browser kita.
Jadi ya, semacam pre-release lah.
Pre-release ya, jadi harus diaktifkan dulu ya.
Ya, jadi sudah ada feature itu, kita harus ngaktifin, kita harus opt-in, ngaktifin sendiri.
Nah, itu mungkin ya, semacam sambil mengubah report atau vulnerability report dan masalah-masalah lainnya kali ya.
Setelah, biasanya kalau udah di flag, beberapa release kemudian, ya akan dirilis stable.
Oke, kecuali safari ya, belum support sama sekali ya.
Tunggu Macbook baru lagi, tahun depan lagi bro.
Tunggu Macbook baru.
M3 kali ya, M3. Kan sekarang M2, tunggu M3.
Udah ada M3 di Indonesia mah.
Iya, iya, itu IM3 bro.
Operator.
Bukan Indonesia.
Seru sekali. Ini, jadi kita nggak perlu terparty, kita bisa langsung pakai.
Kalau misalkan ada apa ya, kalau kita bikin YCWIC ya, editor gitu ya.
Yang butuh HTML, tabli HTML.
Jadi langsung dipakai sanitize API, hasilnya dalam bentuk string ya berarti ya.
String yang sudah aman gitu ya.
String yang aman, bisa di render HTML, render kedua.
Bebas dari, jadi ada istilahnya begini, kalau moto yang pernah saya pelajari.
Itu, validate early, sanitize early, escape late.
Nah itu bahasannya.
Apa itu maksudnya?
Untuk best practice security yang sering, atau lama best practice security yang masih aktif sampai sekarang di komunitas WordPress itu adalah sanitize early, escape late.
Artinya gini, semua input dari user, form, query string, header, itu wajib disanitize di pintu masuk.
Terus semua output dari server side rendering ataupun client side rendering itu wajib di escape terakhir.
Wajib disanitize, dipurify, wajib disanitize.
Wajib di escape, jadi kalau misalnya dia mengandung JavaScript, ya semua di escape jadi.
Atau kalau dia memang dibayangkan ya sebuah attribute, tapi isinya HTML kan gak bisa juga.
Berarti kita harus escape semua HTMLnya, dan itu hanya tinggal jadi string doang kan.
Jadi sanitize early, escape late.
Jadi wajib, jadi kita jangan banyak banget sanitize di tengah-tengah atau escape tengah-tengah, gak perlu.
Selalu di output kita paling terakhir, selalu di escape.
Untuk menghindari cross-site scripting.
Iya, nah ini bener nih, apa, ada komentar juga nih, wajib, semuanya wajib disanitize ya.
Jadi jangan percaya sepenuhnya kepada imputan user ya, imputan pengguna.
Kita percaya imputan meter, kita percaya, tetapi wajib diperiksa.
Oke, percaya tapi diperiksa.
Iya, kalau kita gak percaya sama user, usernya gak mau pakai aplikasi kita ya.
Jadi kita harus encourage mereka untuk input, tapi inputnya harus diperiksa ya.
Atau diklarifikasi.
Sir, user kan sering ngomong, ada bug, ini error.
Iya, gue percaya.
Tapi?
Ya kan gitu kan, diperiksa kembali, diklarifikasi.
Bener, bener, bener.
Selamat malam.
Malam juga.
Selamat datang.
Oke, kita bisa lanjut ke topik kedua?
Boleh.
Topik kedua, siapa nih?
Saya juga bisa, karena tuh saya nyantai.
Nyantai ya, performance itu nyantai ya?
Nyantai.
Apa nih? Boleh.
Ini yang share screen, siapa ya mas?
Bisa atau boleh?
Boleh, boleh.
Eh, by the way, ya, apa namanya?
Kalau, oh, gue mau bawa tentang performance insight, jadi gini.
Share screen dulu, coba share screen dulu.
Oh iya.
Share screen, tes.
Share screen, tes.
Jangan-jangan minta permission lagi.
Iya, minta permission ya, enggak kan?
Enggak, enggak.
Udah tuh, bisa.
Oke.
Eh, kelihatan kita, hai.
Iya, gue pindah dulu screen-nya.
Gue ke sini.
Jadi?
Gedein dong, gedein. Zoom, zoom, zoom.
Belum.
Oh, belum?
Oke, siap.
Kalau temen-temen, biasanya ngetes performance itu,
saya yakin dan percaya,
yang menjadi best practice itu,
ya, kalau zaman dulu pakainya GT Matrix lah,
kalau zaman sekarang mungkin namanya Lighthouse, ya kan?
Lighthouse, dan di mana-mana, Lighthouse, Lighthouse,
bahkan di bawah saya juga ada Lighthouse, gitu ya.
Apa namanya, apa website yang mau kita tes?
Contohnya, HakiFed kah, atau gimana?
Jangan dong, jangan dong.
Nah, situs berita aja kali ya.
Situs berita, oke.
Nah, on/off, ini aja lagi.
Kumparan, kumparan.
Oh iya, kumparan, baik.
Soalnya kalau HakiFed, static set doang.
Biasanya kan kita pakai Lighthouse,
atau kita lihat di Google Search Console,
biasanya mereka, oke, pakein page speed daft gitu ya.
Tiba-tiba kita punya skor,
"You're not good, fail, fail."
"Just content full paint," dia bilang,
"7,7 second, cumulative layout shift," blablabla, ya kan?
- Iya, merah semua ya?
- Iya, merah semua, gitu.
Terus...
- Jadi ngeterima rapor deh.
- Nggak, ada yang hijau sih, ada yang hijau tadi.
- Kita pakai dari sini, ya kan?
Biasanya...
- Beda?
- Sorry.
Iya, kita pakai sendiri, beda.
Meskipun kita sudah pakai Throttle ya,
pakai Throttle 4G atau Throttle secara Fast 3G,
kita Throttle lagi.
Kalau kita pakai Lighthouse dari sini,
dia bakal Throttle pakai Fast 3G ya.
- Oke.
- Nah, kita dapat begini,
"Oke, performance-nya 13," gitu ya.
- Wow, oke.
- Terus...
- 92.
- Dia bilang, "FCP-nya 3,1,
"FCP ini tentu interpretif segini."
Oke, it's fine.
It's just a number.
- Bentar, bentar, bentar.
Mungkin, Pak, jelasan sedikit aja,
"FCP itu apa..."
- Panjang aja.
Takutnya, takutnya.
Takutnya ada yang belum mengerti, gitu.
- Oke, Mas.
Jadi di Lighthouse itu kan ada untuk ngetes Web Vitals, ya kan?
Nah, Web Vitals itu, itu ada matrix-nya.
- Matrix-nya.
- Untuk mengetahui, ini beberapa matrix dari Web Vitals, bukan Core Web Vitals, ya. Web Vitals.
- Oke.
- First Content Full Paint artinya, saat ini dirender,
misalnya ini, ya kan? Blank, blank, blank, blank.
Terus ada...
- Konten yang di...
- Konten yang bisa dilihat user yang bermakna.
- Yang bermakna.
- Ya. Tapi tahu nggak yang mana FCP-nya kalau dilihat dari sini?
Nggak tahu, kan?
- Sebentar, ada pertanyaan.
Kalau misalkan yang apa, yang kayak,
kalau kita loading social media gitu, ada garis-garis itu apa?
Kayak Skeleton gitu, itu bermakna nggak?
- Itu bermakna. Skeleton.
- Bermakna.
- Oke.
- Oke, siap. Lanjut.
- Largest...
Gua skip dulu ke Largest Content Full Paint.
- Yes.
- Largest Content Full Paint itu bagian yang paling besar,
yang paling bermakna. Bagian.
Contohnya biasanya, kalau di kasus kumparan,
yang paling bermakna itu sih feature image yang paling pertama.
Kalau kita lihat di sini,
kalau misalnya ada di situs yang title-nya paling di atas,
biasanya title-nya yang besar.
Ini Mobile Viewport ya, saya ceritanya ya.
Terus, kalau Speed Index, bagaimana content itu bisa muncul,
dan seberapa cepat semua content ini yang ada di atas,
above the fold, di mobile, bisa muncul secara komplit.
- Satu layar ya?
- Iya, visually complete gitu, berapa lama.
- Oke.
- Time to interactive, itu berapa lama?
website ini baru bisa berfungsi untuk bisa menerima input dari kita.
- Scroll, gitu ya?
- Scroll atau mau di-click, itu berapa lama.
- Search, gitu ya?
- Apa pun yang kita click lah,
jadi dia bisa beranimasi kalau search-nya di-click-nya.
Terus, total blocking time.
Biasanya JavaScript, sorry,
kalau browser itu ngerender sebuah page,
itu kan ada prosesnya, mulai dari download,
kemudian CSS-nya ada critical rendering path-nya,
ada rendering tree-nya,
dokumen HTML-nya di-parse,
terus di-apply CSS rule,
terus kemudian ada JavaScript yang running, ya kan?
JavaScript yang running ini, dan semua itu blocking time
untuk bisa si browser ini melakukan rendering page-nya.
Nah, jadi total blocking time ini seberapa banyak JavaScript yang mem-block itu.
Ya, contohnya JavaScript yang analytics ya,
analytics, type manager, ads, tracking-tracking yang lain, banyak lah itu, segala macam.
Jadi, total banyaknya eksekusi JavaScript
yang menghambat FCP dan time to interactive
yang eksekusi JavaScript-nya melebihi 50 millisecond.
Kenapa 50 millisecond? Karena 60 FPS, 60 frames per second,
dan itu kira-kira dia maksimal 60 millisecond, ya, untuk bisa...
Nah, kira-kira.
Jadi, kalau lebih 50 millisecond, berarti kita nggak bisa mencapai 60 FPS.
Oke.
60 frames per second untuk ngerendernya.
Cumulative layout shift, ada berapa banyak elemen
yang terjadi shifting lokasi.
Berpindah ya?
Ya, terdorong kek, atau font-nya baru pertama kali ke download,
masih belum ada fonts, masih pakai font default,
tiba-tiba font-nya setelah download, dia mungbesar.
Nah, dilihat dari sini, itu sulit kita mengetahui.
Dia cuma ngasih tahu kemungkinan, oke, reduce JavaScript,
terus kemudian, masa JavaScript Edge dihilangin, itu gimana?
Nanti bos bisa marah kan, nggak ada penghasilan.
Terus reduce initial response time, reserve ini,
terus banyak lagi diagnostiknya ini, bla-bla-bla-bla-bla, gitu ya.
Oke.
Tapi, Seth, kalau kita pengen tahu lebih dalam lagi,
gimana sih cara browser ngerender, gimana sih cara browser
menentukan mana first content fullpane, kapan terjadi, dan apa?
Apa resource yang menghambat first content fullpane ini,
apa yang menghambat first content fullpane terjadi, gitu.
Jadi kita ini mengoptimasi web supaya
matrix ini meningkat dong, jadi hijau ya.
First content fullpane itu 1 second sampai 1,5 second kalau mau hijau.
Oke.
Largest content fullpane itu maksimal sampai 2,5 second kalau dia mau hijau.
Jadi, gimana sih cara nurunin ini ke 2,5 second
kalau hanya dilihat dari sini, itu pusing, gitu ya.
Kalau dikitaran Lighthouse terus menerus, nggak interaktif,
karena datanya sudah disummarize.
Makanya ada fitur baru dari Google hanya ada di Chrome 102,
semenjak 102, itu pun di belakang feature flight.
Itu masih eksperimental ya, kayaknya?
Iya.
Saya pakainya Chrome yang dev itu 107, ya sudah ada, tinggal pakai aja yang dev.
Dan ada performance insight.
Nah, kita lihat aja langsung ya sebelum kita baca ininya.
Kayak kenal orangnya tuh.
Iya, kayak kenal ya.
Mantan GDI kayaknya ya.
Oke, saya ada kumparan di sini sebelah.
Saya nggak tahu kenapa yang nggak jalan.
Bukan mulut saya, jadi saya nggak tahu.
Saya clear dulu kukis ya.
Ada VPN? Nyalah nggak VPN?
Nyalah. Nyalah si VPN gue.
Nah, biasanya saya pakai, saya throttle, ya, networknya di 4G.
Saya throttle di 4G.
Dan saya pakainya viewport dari Motorola G4.
Oke.
Caranya ya pakai dev tool, aktifkan yang mobile view, terus edit.
Kalau nggak ada Motorola G4, edit, list-nya ada banyak.
Oke.
Terus kalau mau nambahin throttling, bisa langsung ke setting, throttling,
tambahin custom profile, apapun yang kalian mau.
Saya biasanya tes di regular 4G.
Yang 4 MB/s download, 3 MB/s upload.
Oke.
Tinggal saya measure page load.
Ini udah pakai yang baru ya berarti ya?
Iya.
Wah.
Nambah satu tab lagi ya tambahannya.
Iya. Ada banyak tabnya.
Iya, ternyata benefit dia nggak muncul deh.
Jadi kayak kita harus...
Benefit nggak muncul?
Oh iya, gue lupa.
Kalau nggak muncul...
Setting dulu, setting dulu.
Dari sini, dari dot-dot-dot ini kelihatan kayak gini.
Bisa nggak sih? Kelihatan nggak ya?
Kelihatan, coba klik.
Klik.
Kelihatan, kelihatan.
More tools.
More tools.
More tools.
Performance inside.
Oh i see. Oke, oke.
Got it.
Gitu ya.
Kalau nggak ada, detect aja ya.
Hmm.
Oke.
Tadah, ini dia.
Kita perbesar aja.
Oke.
Jadi kelihatan ya di sini sekarang.
Kita lihat di bagian inside.
Begitu website di download,
yang jalan duluan JavaScript.
Ya.
Terus ada render blocking request.
Apa sih yang render blocking request?
CSS ya.
Dia nggak nge-preload CSS contohnya.
Terjadi render blocking request,
terus ada first counter full plane-nya itu di 1,3 second.
Ingat, ini karena saya sudah reload duluan,
jadi mungkin nge-case di CDN maka jadi lebih cepat,
dan saya lokasi di Jakarta.
Sedangkan si webdev tadi,
yang test ini, testnya mungkin dari Amerika,
CDN-nya, nge-hit CDN, dan panjang gitu ya, lambat gitu ya.
Jadi, makanya, skornya nggak sesuai.
Jadi, kalian nggak perlu khawatir soal,
"Oh kok di sini report-nya 1,3."
Fokus di, makanya fokusnya di,
bagaimana cara menghilangkan,
apapun yang terjadi sebelum first counter full plane,
dan menghilangkan apapun yang terjadi,
supaya last counter full plane ini bisa barengan sama,
at least selisih sedikit lah sama FCP,
dan donk content log selisih sedikit.
Jadi, dipaksa naik semua.
Jadi, artinya, script-script yang nggak perlu dijalankan di above the fold,
bagaimana cara yang bisa dihilangkan?
Kelihatan semua di sini.
Jadi, bisa ada long task, ada render blocking request, long task,
terus baru terjadi FCP.
Kalau kita lihat, FCP-nya itu apa?
Bisa klik di sini.
Nah.
Terus kemudian...
Replay real-time gitu ya loading-nya.
Keren sekali.
Lihat ya, dia menganggap FCP itu terjadi,
yang content full plane itu bagian sini.
Oh iya.
Jadi, kita sebagai web developer,
kalau pengen meningkatkan FCP kita,
tentu kita perlu melakukan sesuatu,
supaya ini cepat muncul, kan?
Ya.
Artinya, ada accent plane.
Oh, gimana caranya supaya bagian ini muncul?
Mungkin ikonnya duluan di preload,
ikon ini di preload, ikon ini di preload,
CSS yang above the fold ini di preload.
Jadi, begitu render,
yang bagian FCP-nya sudah render duluan, gitu.
Terus, kita lihat apa sih yang ada di... kita lihat render lagi selanjutnya.
Tuh, ada shift, tuh. Terjadi shift.
Oh, pindah lokasi ya?
Ya, pindah lokasi bergeser.
Biasanya itu edge, tuh.
Ya.
Ada edge, ya berarti edge-nya...
Memang wajar kalau punya edge namanya, situs news ya.
Jadi, bagaimana caranya supaya yang nggak men-shift?
Ya, ini. Kasih minimal height.
Di project ini, di the world.
Iya.
Atau pakai aspect ratio.
Udah stable juga kan sekarang CSS aspect ratio.
Iya, aspect ratio. Ya betul.
Terus, lihat nih, shift lagi nih.
Dia pakai skeleton, tapi...
Gak mau... Skeleton-nya nggak men-shift.
Tapi isinya beda.
Kurang akurat, ya. Kurang akurat, ya, skeleton-nya.
Ya, kompat antara skeleton sama content.
Ya.
Kalau menurut gue...
Kalau menurut saya...
Yang above the fold nggak perlu di lazy-lazy gini deh.
Karena sebisa mungkin begitu.
Pengen nggak? Kan kita pengen banget ya.
Gak kumparan kalau bisa.
Di 2 second itu sudah kelihatan semua yang mau kita lihat di bagian atas sini.
Jangan nunggu sampai 8 detik.
Ya kan? Yang di bagian bawah yang di lazy-load, silahkan.
Tetapi bagian atas jangan di lazy-load.
Karena kita sebagai pembaca, butuh melihat...
Sesuatu.
Sesuatu yang bermanfaat, yang largest content for pain-nya.
Harus melihatnya di bawah 2.5 second.
Jadi user-nya diberi harapan bahwa ini akan segera loading, gitu ya?
Ya, nunggu, gitu.
"Ah, bosan, ah, tutup, ah."
Nah, LCP nyambal dianggap adalah si image.
Ya, mau top-top rakan lagi. Anyway.
Oh, yang blur ini nggak dianggap LCP ya?
Belum ya? Belum ya?
Belum. Ya, harus full baru di LCP.
Harus full. Oke.
Nah, kadang yang nyebelin itu yang penentuan LCP-nya beneran terserah engine lighthouse-nya kan ya?
Kita nggak bisa ngatur bahwa LCP-nya jugul lah.
Jadi text kan lebih...
Pasti lebih cepat dari image. Kita harus ngikut.
Tergantung desain. Jadi kalau mau desainnya duluan digedein,
kalau misalnya desainnya mau digedein, text-nya duluan itu bisa.
Jadi bagian pertama hanya satu artikel.
Kayak contohnya trending news ya, kayak headline.
Nah, biasanya kalau di kompas yang koran kan ada headline yang gede duluan tuh.
Judul duluan tuh.
Berita lelayu, gitu.
Oh, kok lelayu sih?
Lelayu.
Eh, tapi ini ada pernyataan menarik nih.
Ada enable SSR. Ini ada pengaruhnya nggak sih sebenarnya?
Sama aja.
Sama aja. Kita nggak bicara mau server-side rendering, client-side rendering.
Kita bicara soal bagaimana browser ngerender...
Render.
Ini kelihatan di performance insight, kelihatan bagaimana browser ngerender HTML kita yang sudah didownload.
SSR membantu banget karena HTML-nya sudah terbentuk.
Kalau CSR kan dia butuh rehydration, blablabla, gitu ya.
Actually butuh rehydration dulu, baru dia bisa terbentuk HTML.
Akan lebih lama. Betul.
Kita nggak usah parsing ya. Jadi mempercepat atau locking time.
Kalau CSR dia nanti akan ada longtafnya banyak. Karena dia bakal nunggu javascript...
Render blocking request-nya mungkin terjadi nih.
Dia nunggu javascript yang selesai didownload, baru dia bisa bikin konten.
Nah, kita lanjut ke LCP.
Dia baru kelihatan sampai sini.
Kalau kita lihat lebih dalam lagi, ini kan...
Dia bisa kumpulkan antara... Apa namanya?
Terparty sama firstparty. Jadi semua ke bawah ini terparty.
Jadi bisa lihat karton dia dijalankan.
Dan firstparty-nya apa sih yang dijalankan di awal?
CSS itu warnanya... Ini ada magnifying glass.
Jadi gede ini.
Jadi bisa lihat nih, firstparty yang didownload-nya oleh si kumparan.
Itu apa aja nih di awal?
UI key-nya banyak amat.
Yang umu tadi apa?
Yang di atas?
CSS.
Ini ada sejernya HTML biru.
React.
Kalau sebisa mungkin, kita pakai-nya preload.
Sebisa mungkin yang CSS, yang render ini, render...
yang critical rendering.
Perlu di preload sebisa mungkin secepatnya.
Jadi begitu dia HTML selesai didownload, sudah langsung.
Biasanya kalau di preload dia lebih cepat.
Karena hanya butuh baca header.
Jadi belum baca HTML selesai, dia udah baca header.
Dan ada preload-nya, link level preload.
Jadi, bisa...
Bisa langsung ke download dulu, duluan didownload ya.
Dan biasanya font juga perlu didownload di awal.
Jadi nggak ada font yang didownload.
Jadi makanya banyak rendering.
Ada rendering ini nih, blocking.
Jadi ini bisa dioptimize lebih dalam lagi.
Dan image-image ini juga banyak amat.
Saya nggak ngerti kenapa ini di...
Anyway. Bisa dioptimize lagi.
Dan diatur strateginya bagaimana caranya supaya FCP,
Dom Content Loaded, dan FCP itu berdekatan.
Untuk di above the fold.
Jadi above the fold itu artinya semua konten yang kelihatan di atas.
Yang visible ya.
Ini baru saya pertama kali loading itu above the fold.
Kalau perlu inline CSS yang critical,
Yang above the fold di inline semua di dalam HTML.
Jadi nggak perlu ada request lagi, contohnya.
Yang below the fold, belakangan didownload bisa.
Terus kemudian JavaScript-JavaScript yang nggak perlu running di awal.
Saya lihat ini banyak banget.
Ini, ini, ini, Apollo segala macam, React segala macam didownload di awal.
Perlu di, saya rasa, strateginya web ini,
dia ngedownload React dan GraphQL untuk Apollo, client,
dia karena menyedot konten yang ini.
Untuk menampilkan, kan?
Tapi dia nge-face konten.
Jadi, ini, si kumparan ini ternyata
template-nya dulu baru kontennya.
Kalau bisa, di first page load,
kontennya untuk above the fold itu sudah ada, gitu.
Jangan, jangan di...
Jangan di-load dulu ya, jangan di-fetch dulu ya.
Jangan di-fetch lagi, gitu.
Tota di-combine SSR sih, betul.
Jadi yang buat top-top kontennya itu server rendered aja.
Kalau misalnya sisanya mau di-fetch pakai Apollo client, ya nggak masalah.
Oh, berarti ini, ada kemungkinan si kumparan ini menggunakan CSR?
Client-side rendering?
Bisa jadi.
Bisa jadi ya, oke.
Ya kita lihat aja.
Gimana cara liatnya?
Matiin JavaScript.
Oh iya, bener.
Betul sekali, matiin JavaScript.
Matiinnya caranya.
Saya pencet shift tangan-tanya,
terus disable JavaScript.
Oke.
Refresh.
Kalau ternyata untuk ininya, apanya...
Nah itu kan template-nya berarti ya.
Casing-nya dia server side rendering.
Server side rendering, apa namanya, app shell-nya ya, app shell-nya.
Ya, app shell-nya dia ini.
Tapi dia kayaknya nge-request sesuatu, kemudian dia tampilkan dengan CSR ya.
Betul.
Nah, kan sayang banget akhirnya si pembaca menunggu 10 detik baru bisa melihat konten.
Seandainya bagian atas tadi above default itu dia server side rendering,
maka semua JavaScript yang ada di sini itu nggak perlu.
Nggak perlu di-load.
Sampai selesai LCP,
baru dia nge-load JavaScript yang bagian bawah semua.
Jadinya kerasa jauh lebih cepat.
Oke.
Nah, itu si performance insights tab itu ngebantu banget ya
buat memvisualisasikan tadi mana yang harus di-defer,
mana yang mengganggu metrik-metriknya kan.
Yes, jadi banyak yang bisa kita lihat apa yang bisa dioptimasi.
Kalau bisa longtas-longtas ini dihilangkan sebelum
semua yang sebelum FCP itu longtas semua harusnya hilang.
Render blocking request harusnya hilang.
Dan komunitas reaktif itu bisa diperbaiki lagi
mengenai HTML strategy, container-nya, struktur HTML-nya, dan CSS-nya.
Keliatan kan mana yang terjadi reaktif?
Betul-betul.
Begitu.
Ada contoh web yang bagus nggak?
IvanKristianto.com gitu misalkan.
Yang bagus-bagus.
Aduh.
Ini mah static site.
Iya.
Nggak pakai database.
Nggak masalah, Mas.
Bukan itu ya masalahnya ya?
Yang mengukur dia static site apa non-static site.
Iya, nggak masalah.
Karena kan, meskipun dia static site,
tapi banyak render blocking request dan banyak JavaScript,
sama aja kan?
Iya, betul-betul.
Intinya bukan itu ya?
Iya.
Jadi dia ngelihat kayak ada banyak user ya?
Iya.
Mau pakai WordPress, mau pakai jumlah, mau pakai Drupal.
Yang penting, lihat nih.
Neon error ini kayaknya karena ada tracking yang ngelod dan diblock oleh browser.
Tapi,
ya.
Dari sini kan kelihatan kalau di Deep Tech ini,
yang mana yang FCP itu adalah yang bagian ini nih.
FCP.
Bisa ditanya, oh bisa diklik juga.
Dia kasih tau LCP element yang mana yang,
yang,
eh sorry, element mana yang dianggap LCP sama browser.
Hmm.
Kalau kita kembali,
apa lagi ya?
Aktifate mau nggak?
RizaFahmi.com
RizaFahmi.com
RizaFahmi.com
Nggak ada isinya, jadi cepet.
Hehehe.
Oh cepet, oh mau ini.
Artikel, tulisan, tulisan.
Kalau tulisan lumayan banyak isinya kan.
Kalau ini kan landing page doang.
Yang ininya deh.
Yang tulisan, ya.
Jangan, malu saya.
Sebagai GDI, jelek nilainya.
Hehehe.
Deg-deg.
Deg-deg.
Deg-deg.
Deg-deg.
Deg-deg.
Deg-deg.
Aduh gimana ya?
Deg-deg.
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Deg-deg.
Aduh gimana ya?
Deg-deg.
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deg-deg.
Aduh gimana ya?
Deskripsi asli dari YouTube
Mari kita diskusi dan ngobrol ngalor-ngidul tentang dunia web. Agar tetap up-to-date dengan teknologi web terkini. Masukan, saran dan topik bisa dilayangkan ke https://t.me/rizafahmi Berbagai tautan Sanitizer API, Web API untuk mengamankan string yang akan dirender ke DOM: - https://web.dev/sanitizer Performance Insight untuk perbaiki FCP, LCP & CLS. - https://developer.chrome.com/docs/devtools/performance-insights/ Teknologi dibalik figma: - https://www.figma.com/blog/under-the-hoo Kunjungi https://ngobrol.in untuk catatan, tautan dan informasi topik lainnya.
Episode Terkait
1 Apr 2025
Ngobrolin Lebaran
Episode ini adalah ucapan Selamat Idul Fitri dari tim Ngobrolin WEB. Eka, Ivan, dan Rizah memberikan salam Lebaran denga...
1 Feb 2023
Ngobrolin Storage
Melanjutkan episode cookie minggu sebelumnya, pembahasan bergeser ke tempat penyimpanan lain di browser — bukan basis da...
30 Mei 2023
Ngobrolin Core Web Vitals
Core Web Vitals dibahas mulai dari alasan kemunculannya. Sebelum ada patokan bersama, orang mengukur kecepatan dengan YS...
Suka episode ini?
Episode baru setiap Selasa malam. Dengarkan lewat YouTube, Spotify, atau feed podcast favoritmu.
Memuat komentar dari GitHub Discussions...
Jika komentar tidak muncul karena ekstensi privasi / adblocker, kamu bisa berdiskusi langsung di GitHub Discussions .