Pekerja Web
Ringkasan Episode
Bantu KoreksiEpisode ini membahas Web Worker, saudara Service Worker yang jauh kurang populer padahal memecahkan masalah yang sangat nyata. Titik berangkatnya adalah sifat browser yang single-threaded: main thread hanya bisa mengerjakan satu hal dalam satu waktu, seperti satu orang yang merangkap kasir, tukang masak, dan tukang bungkus di satu warung. Kalau ia sibuk menghitung sesuatu yang berat, ia tidak sempat me-render, dan scroll pun terasa tersendat. Satu thread dipertahankan bukan karena keterbatasan perangkat keras zaman dulu, melainkan karena DOM akan kacau kalau banyak thread mengubahnya bersamaan. Itu sebabnya Web Worker tetap tidak boleh menyentuh DOM β ia hanya bisa berkirim pesan lewat postMessage, dan main thread yang menindaklanjuti. Perbedaan pentingnya dengan Service Worker dibedah satu per satu: Web Worker menempel pada satu tab dan mati begitu tab ditutup, bisa banyak sekaligus, cocok untuk kerja berat seperti kompresi gambar, WebAssembly, physics engine, atau memindahkan script analitik pihak ketiga keluar dari main thread; Service Worker menempel pada origin, hanya boleh satu, bertahan meski tab ditutup, dan bekerja sebagai proxy jaringan untuk offline support, caching, dan push notification. Karena postMessage terasa low level, ada dua library yang mempermudah: Comlink dari Surma yang membuat pemanggilan worker terasa seperti memanggil fungsi biasa, dan Party Town yang memindahkan script pihak ketiga ke worker sekaligus mengurung aksesnya ke API browser.
Poin-poin Utama
- β’Browser hanya punya satu main thread, jadi kalkulasi berat membuat scroll tersendat karena thread yang sama tidak sempat menggambar ulang layar
- β’Alasan DOM tetap single-threaded bukan keterbatasan hardware lama tetapi karena banyak thread yang mengubah DOM bersamaan akan berantakan β karena itu Web Worker hanya boleh berkirim pesan, bukan menyentuh DOM
- β’Web Worker menempel pada satu tab dan mati saat tab ditutup, sedangkan Service Worker menempel pada origin, hanya boleh satu, dan tetap hidup setelah tab ditutup β inilah yang memungkinkan push notification dan background sync
- β’Web Worker bisa dijalankan banyak sekaligus untuk kerja paralel, sementara Service Worker hanya satu per origin dalam satu waktu
- β’Service Worker pada dasarnya adalah proxy jaringan: ia bisa mencegat setiap request dan memutuskan mana yang diambil dari internet dan mana yang dilayani dari cache, per halaman sekalipun
- β’Comlink dari Surma menyembunyikan postMessage sehingga memanggil worker terasa seperti memanggil fungsi biasa, sedangkan Party Town memindahkan script pihak ketiga seperti analitik ke worker sekaligus membatasi aksesnya ke API browser
- β’Daftar service worker yang pernah terdaftar di browser bisa dilihat lewat tab Application di DevTools β kebanyakan isinya justru berasal dari Chrome extension
Lu ngomongin Kek [musik] dapatkan hanya di domainesia.
Halo. Selamat malam. Malam. Apa kabarnya?
Kok enggak ada yang nonton? Malam semua teman-teman YouTube dan di Linkin. Kalau ada yang sudah hadir boleh ya
komen-komen ya. Tengah malam bisa nonton.
Oh iya benar ya. Lagi demam Piala Dunia ya.
Kalau saya demam beneran. Flex, Bro. Halo. Halo.
Siapa sembuh wei, ada kok yang nonton.
Halo, Audi. Ee enggak sih, hampir hampir kayak berasa sakit gitu. Tapi tadi pagi habis interview. Wah.
Wah. Selamat. Eh, selamat. Gimana? Kepo kok selamat sih? Belum diterima ya.
Semoga [tertawa] semoga diterima. Semoga lancar.
interview ke berapa? Eh, oh ini salah satu apa ya? Salah satu berita baik juga ya dalam keadaan
seperti ini masih dapat opportunity untuk interview.
Ee berarti lumayan positif lah ya.
Tahunya plot twistnya deh kerja di majalah maksudnya nginterview orang.
[tertawa] Audi kan anak IT, masa kerja di majalah.
Oh, bisa juga sih. Majalah IT ya. di diinterview diinterview di itu info komputer.
Iya. Masih ada enggak sih majalah-majalah komputer gitu? Udah enggak ada ya?
Masa sih? Ya terakhir kan info Linux ya.
Info Linux ini. Terakhir info Linux ada chip zaman dulu ya. Cip.
Oh iya. Oh info komputer ada apaagi?
Enggak ngalamin ya, Teman-teman. Di sini kayaknya majalah majalah offline, majalah cetak kayaknya enggak ngalamin ya.
Gua ngalamin cuma bukan cip juga sih.
Majalah bobo ngalamin [tertawa] pasti yang nonton dengar.
Sekarang sekarang baca beritanya dari mana sih? Sosial media ya, Twitter ya?
Iya. TikTok ya? Tuh enggak ada yang tahu majalah komputer.
Ah, majalah bom tahu. Majalah nih ada temannya nih. Iya.
Habis itu majalah Hai Dumbo. Habis itu udah.
Iya. Jangan salah loh. Dulu itu buku-buku buatan Indonesia juga banyak yang bagus-bagus loh. Ada bagaimana cara membuat virus ya kan, ada
cara bikin game dari scratch enggak pakai framework. Wah, keren-keren.
[berdehem] Jasa itu kan si Jasa yang bikin.
Lihat transkrip lengkap (517 segmen lagi)
Iya, Jasa Kom. Heeh. Hacker-hacker gitu. Sekarang mah bukunya ini bagaimana cara menggunakan TikTok ya. Bagaimana cara viral di resak?
[tertawa] Enggak ada buku buku teknologi yang benar-benar deep gitu udah jarang sekarang ya.
Tapi sebenarnya benar juga sekarang orangnya bikin jaget review.
Oh. Oh jaget review. Iya. Bagaimana cara VIP coding? Oh iya benar ada ya.
Tapi benar Mas Edi Yosmani kan bikin bukunya.
Iya benar. Ivan kan juga beli kan beli beli buku siapa? Steve YG ya? Steve Steve YG Adiosani juga punya
baca. Bagusbagus ya. Wah izin mandi.
Izin [tertawa] mandi dulu. Ingat kalau mau beli buku cip atau info komputer tuh nunggu sebulan habis. Maksudnya yang
ketinggalan sebulan gitu. Yang ketinggalan sebulan itu belinya di Tog Mas. Iya. Dijual murah.
Oh, second. Second apa diskon? Enggak baru. Tetapi udah telat.
Udah telat sebulan buku-buku diskon. Togamas Kejayan ya. Eh, Togamas tuh ada di mana aja sih?
Togamas di ujung Kejayan itu. Iya, benar.
Iya. Heeh. itu tuh udah enggak ada atasnya kafe dulu pas e awal apa kayak bikin acara itu ketemuannya meetingnya
ke situ yang beli satu orang yang duduk yang beli satu dua orang [tertawa] yang duduk ee ngider ya 8 sampai 10 orang
lah. Iya. Iya. Kalau lagi pas kere, kalau lagi pas kere enggak publik majalah yang sudah telatnya biasanya ada yang sudah kebuka sampel
satu. Ya sudah baca aja di situ dulu.
Heeh. Ee sudah gitu sudah puas pulang.
Iya. Iya. [tertawa] Salah satu yang menarik dari cheat itu yang juga saya tunggu-tunggu selain artikelnya ya ee itu CD-nya biasanya di
CD-nya itu ada trial ada trialt-trial game. Iya.
aplikasi yang 30 hariah itu kita senang banget coba-cobain.
Terus habis itu setiap berapa bulan sekali ee format Windows-nya karena rusak kebanyakan aplikasi enggak jelas.
Loh, umurnya berapa sih? Hm. Ya, gue ngerasa karena enggak ngerasain [tertawa] yang paling tua ya, yang paling muda ya
di antara kita ya. Heeh. tua juga cuma karena apa ee programmingnya latihan jadi enggak terlalu ngalami. Jadi iya
jangankan majalah ee cetak ya, majalah yang online aja pada berguguran ya, kayak daily sosial udah tutup ya kan
yang apa berita startup gitu-gitu udah banyak yang orang makin pendek enggak sih? Jadi semua harus e apa
harus masih ada kayaknya ya. Tapi yang di Indonesianya kan udah Oh iya timnya udah bubar ya. Timnya
sudah bubar ya. Iya. Sekarang hanya Singapore kalau enggak salah ya.
Berarti sekarang teman-teman kalau nyari-nyari berita gitu berarti dari sosial media dari ee apa e video gitu ya? I
karena kasihan juga coba anggap aja ya anggap aja ya kayak hacker news ya. Oke.
Kalau orang itu kan sekarang on demand ya nyari news-nya ya.
Heeh. On demand. Iya betul. Enggak mau nunggu ya. Enggak mau bikin penasaran gitu ya.
Iya jadi on demand. Oh kalau misalnya Oh.
dapat informasi awalnya biasanya dapat dari short contohnya ya atau nonton podcast kita gitu short oke sudah tahu
sesuatu ini berarti tinggal tanya ke LLM nyari informasi soal hal tersebut kan jadi yang kunjungi situs-situs beritanya itu
LLMang sama iya ya iya sama kayak kasusnya Telwin ya berarti ya iya sama kayak Telwin ya jadinya ya ee
pemasukan dari iklan Kan berkurang, impression berkurang, akhirnya jadi enggak ada pemasukannya.
Tapi tapi request-nya nambah, trafficnya nambah.
Jadi serba salah request request-nya nambah tapi bukan manusia.
Iya, akhirnya biaya servernya bengkak karena bandwid.
Eh, iya tapi enggak ads-nya enggak enggak masuk kan.
Enggak ada yang visit ya. Ya, begitulah. H seringnya beli buku fisik atau ebook?
Kalau idealnya sih fisik ya idealnya.
Tapi kadang-kadang ebook ee beli ebook kalau misalkan pengirimannya mahal, ongkirnya mahal.
Betul. Terus karena ee karena pertimbangan ekonomi sama. Jadi kalau mau idealis gimanapun lebih enak ee fisik kan. Tapi praktiknya
banyakan kindle. Kalau saya karena enggak bayar pilihnya fisik.
Pilihnya fisik. Iya. Karena di dibayarin dibayarin bayarin dicover ini ya. Ee konsultan ya.
Iya. Dicover sama si Engkoh Sultan.
[tertawa] Engkoh Sultan. Halo. Halo. Selamat datang nyari berita global numpang platform tetangga Mothership SG.
Mothershipip SG itu berita tentang apa ya?
Singapore maksudnya Singapore Based. Profesional. Oh iya, Singapore Based. Iya. Cuman beritanya tentang apa ya? Apa umum?
Iya. Ada yang masih itu enggak apa buka kayak platform e apa portal kayak detik Kompas gitu masih kali ya?
Enggak. Oke. Gua enggak karena Iya. Karena gua sukanya misalnya beberapa contohnya yang suka tentang berita-berita finansial contohnya kayak
kontan. Oh, masih beberapa masih ya. Heeh.
Biasanya gua langsung set up ke itu ke e punya custom GPT.
Edge-nya parah ya. Iya. Gua set up custom GPT terus setiap jam 09.00 pagi nge-fatching beberapa berita finansial yang gua suka
dan Oh iya. ambaliz ya. Iya. I dia sendiri yang ambilin. Terus gua tinggal dia kasih summary kemarin itu kejadiannya apa?
Tinggal baca aja headlight atau summary.
Kalau ada yang suka klik linknya baru dibaca detail ya.
Oh iya jadi udah zamannya ini ya cloud-klau ya ee apa eh personal AI personal assistance ya.
Iya. Sebenarnya gua cuma kayak setup e ini aja sih. Kayak si chat GPT kan bisa setup custom GPT-nya di running setiap
jam 9 pagi. Simple enggak perlu pakai server-serveran.
Betul betul. Atau kalau yang kalau yang fakir token RSS fit biasa aja udah dikasih kategori-kategori.
Cuma maksud saya enggak diummarize maksudnya kekurangannya cuma itu. Tapi kalau yang MVP-nya paling Heeh. Paling simpel mah
RSS saja. Kalau mau yang gratis, Grock ada yang kayak gitu. Ada schedule kita mau coba tolong rangkum berita teknologi hari ee
kemarin atau hari ini gitu. Nanti diambil dari Twitter sih kayaknya ya.
Ee itu ada dan bisa dipakai gratis.
Kalau yang lebih advance lagi mungkin pada pakai itu ya Hermes ya atau eh open cloud dan lain-lain ya.
Jadi sebelum kita menuju ke acara utama, acara utama enggak tuh?
Saya mau kasih info dulu. Iya, mau kasih info dulu. Ee kalau episode kali ini masih e hasil
kolaborasi dengan Dominesia. Jadi, buat teman-teman yang mau beli layanan hosting ee itu bisa ke Dominesia.
Ee layanannya kita sudah sempat coba dan pakai ya. Ee lumayan ee apa bukan lumayan ya, bagus, bagus banget gitu dan
pelayanannya bagus. Jadi [berdehem] kalau mau hosting itu bisa pakai ee promo code ngobrolin web DN. Nah, kalau
mau yang advance-nya lagi VPS bisa pakai eh cloud VPS Turbo Dominaya. Discordnya 50% pakai ini.
Mana dia? Oh, enggak muncul ini. Nah, promo code-nya ngobrolin VPS DN.
diskonnya bisa di tiap bulan bisa diskon loh 50%. Jadi lumayan ya silakan dimanfaatkan enggak perlu ganti email, enggak perlu
pakai account ee yang baru ya seperti Audi kalau pakai LLM dia pakai email banyak. Kalau ini enggak perlu ya.
[tertawa] Jadi terima kasih Dominia Dominia tring mana tringnya mana tringnya?
Isinya kok beda isinya. [tertawa] Malam-malam minum kopi kan mau nonton Ronaldo. Ronaldo cetak berapa gol malam ini?
Ngikutin pi dunia enggak [tertawa] cetak lima gol.
Ada yang ee teman-teman di sini eh fans-nya Ronaldo apa fansnya Messi? Ini kayaknya terbelah dua gitu ya. Ada yang
membenci, ada yang suka gitu ya.
Ini kayak Piala Dunia terakhirnya mereka berdua ini.
Iya. Last dance ya? Last dance. Iya.
Tahun depan sebenarnya udah enggak bisa.
Udah 40. Sudah era baru. Era baru.
Tapi Ronaldo kan ngejar 1000 gol. Kalau belum 1000 dia main terus sampai dapat 1.000.
Oh berarti kalau tahun depan dia 45 ya umurnya ya? Bisa, Pak. [tertawa] Emang sekarang berapa? 41 41. Heeh.
1000 gol di mana? Di pela dunia.
Hah? Enggak. 1000 gol karirnya. Oh, kalau 1000 gol karirnya bisa sih.
Sebentar lagi juga. Tinggal main aja di Liga Indonesia 1000 gol dalam satu musim. [tertawa] Cari worker yang baru dong. Jadi bisa
banyak yang jalan buat buat ngegolin nyambung-nyambunginnya ini. Nyari-nyari [tertawa] nyari-nyari menyambung ini ketahuan [tertawa] ya. Misalnya kita lagi sibuk nonton bola
ee apa tapi butuh ngerjain sesuatu kita ee meng-offload pekerjaan yang berat itu ke ee orang lain. Nah itu
Oh iya kayak open cloud juga kan berarti cara kerjanya mirip ya. Iya.
Wah, mantap. Terima kasih domnesia yang terbaik. Asik.
Sudah sat tahun lebih Audi pakai ya.
Wah, bisa nih. Keren ya Audi. Salah satunya brand mobil saya favorit saya. C.
Oh iya. Audi. [tertawa] Iya, beneran saya suka.
Beneran Audi ya? Tapi mobilnya bukan Audi kemarin ya?
Ya enggak sanggup belinya. Oh, beda. Oh, [tertawa] mahal ya.
Kan Audi itu kan logonya ada bulat-bulatnya lima, beli satu dulu aja bulatannya. Dicil [tertawa] dikumpulin lima kali.
Entar ya kita coba tanya dulu ke bagian finance dulu bisa enggak ya [tertawa] bagian finance ya. Jadi malam ini kita bahas kayaknya
seg-nya kurang ini ya kurang [tertawa] nyambung ya. Kita bahas tentang web worker. Apa itu web worker? Kenapa
butuh, bedanya sama service worker apa ee dan lain-lain gitu ya. Atau ee teman-teman di sini ada yang sudah
pernah pakai, sudah pernah dengar atau baru dengar gitu. Mau tanya itu sebenarnya web worker itu kan kayak
adiknya atau saudaranya. Kalau service worker mah kalau yang ngerjain web rata-rata udah pernah dengar ya. Bahkan lighthouse biar dapat ikon PWA kan
minimal ya. Iya, harus mengaktifkan enggak harus tapi maksudnya tambah satu poin hijau kalau work offline walaupun offline-nya cuma apa satu screen
cuma 404. Heeh. Enggak asal enggak 404 menampilkan apa asal enggak dino ya satu halaman statik. Heeh.
Nah, itu kan pakainya service worker.
Tapi web worker itu kan jauh lebih enggak terkenal ya. Gua sendiri aja belum pernah belum pernah bikin di production.
Jadi ya cukup pernah di di ditrendingkan oleh Mas siapa ya? Saya lupa orang Google itu loh si saya lupa
namanya. Sebentar. Oh yang orang e Google Chrome yang Komlink ingat pernah dengar Surma.
Surma? Iya. Das Surma yang trio dulu ya. Trio.
Heeh. Web itu ini ini linknya tapi kayak enggak tahu web worker adalah buruh web ya [tertawa] web
literally literally pekerja web ya kita semua dong berarti pekerja bukan tapi bukan tentang itu. Ini API ini apa?
API atau mau bahas dulu definisinya kali ya sebelum masuk ke webker.
Iya. Sebenarnya saya mau bahas tentang bagaimana browser bekerja ee untuk mengarahkan ke webker ini. Kenapa butuh web worker ini? Karena browsernya kan ee
non blocking tuh. Benar kan? Jadi kalau dia buka sebuah aplikasi web ya browser by default blocking.
By default blocking. Iya. By default kan blocking.
Semnya cuma bisa mengerjakan satu hal dalam satu waktu. Jadi kalau dia ngerjain, kalau dia nonton bola tuh tadi
analoginya gue maksa masih ngerasa analoginya lumayan. Ngerjain sesuatu ya enggak bisa ngerjain hal lain harus selesai dulu. Nah, cuma kan itu enggak
selalu possible. Jadi ada ee kelas atau interface yang namanya worker worker. Nah, implementasinya itu ya ada service
worker API, ada web worker API. Ada lagi enggak ya selain dua itu? H ada namanya.
Oh, kalau misalkan nonton bola atau nonton ini deh YouTube terus ee ada kolom komentar teman-teman bisa komen
enggak perlu nunggu si videonya itu termasuk web worker enggak? Cara enggak juga ya.
Itu itu kayaknya web ya. Web soket ya.
Kalau ini kan kayak dioffload ke ee kalau analogi manusia ya kita harus nyuruh orang lain untuk melakukan
sesuatu itu kan. Oh, ya. Ya, ya.
Kita ngirim pesan, kita enggak bisa ngerjain itu sendiri. Ee kita ngirim pesan misalnya mungkin kita lagi nonton
bola jadi kita enggak bisa masak atau nyiapin makanan. Terus ee kita pesan makanan yang apa ee ojol yang pergi ke
restoran atau warung beli makanan. Pokoknya yang kerja orang lain. Kalau di sana makanannya habis kan kita dimessage, "Oh,
Mbak tempenya habis. Ya udah ganti tahu kan. Tapi kita enggak bisa langsung ngomong ke tukang warungnya kan karena
kita enggak di situ. Kita cuma bisa nitip pesan aja. Yang mengerjakan adalah orang lain mendelegasikan tugas ke trade lainnya
gitu ya kira-kira. Iya. Jadi cara kerjanya sih kembali ke cara kalau analogi yang tukang masak tadi. Kalau si browser itu sebenarnya
dia seperti ee kayak dia dia jadi kasir, dia jadi tukang masak, dia jadi tukang potong-potong dan dia jadi tukang
bungkus-bungkus. Jadi kalau si web itu hanya bisa satu kali. Jadi kalau kamu datang minta, "Oh, saya mau nasi goreng." Oke, dia terima
nasi gorengnya. Dia siapin bahannya kotok kotok. Dia masak nasi gorengnya.
dia bungkusin dan dia balikin. Itu cara kerjanya si web. Jadi itu kan linear main trade-nya ya. Main
trade-nya cuma bisa jalanin satu hal.
Nah, dan ada lagi yang namanya yang kalau si JavaScript kan dia punya engine JavaScript yang untuk mengeksekusi itu kan ada lagi yang
namanya event low. Jadi hanya tetap aja 1 X1 CPU CPU yang mengerjakan itu cuma bisa satu trad.
Jadi kalau misalnya dia lagi disuruh ng-render atau disuruh lagi masak nasi goreng, dia masak nasi goreng dulu
sampai kelar baru kalau sudah nasi goreng sudah kelar lanjut lagi. Nah, si event loop itu hanya jadi manajemen
untuk ininya aja untuk apa aja yang mau dikerjakan tas-tas selanjutnya kayak gitu.
Mana prioritas ya? Ini kayak Roop ya jadinya ya.
Iya sekarang ya looping aja gitu. Nah si worker muter aja terus ya.
Betul. Heh. Si worker ini diciptakan supaya bisa multiade.
Nah, ada yang ada yang dari awal web itu enggak enggak support ya sebenarnya kanak awal zaman dulu dulu zaman dulu si begitu si web
itu diciptakan si browser si web rendering ini diciptakan satu trad. Nah, ada alasannya juga kenapa satu trad karena
si Dom hardware zaman dulu masih satu core kan bukan satu waktu di bukan itu bukan itu penyebabnya tetapi si ini
kayak si Dome Tree si HTML Dome 3 C SS3 segala macam itu kalau ada multiple threade yang
meng-update kacau. Hm. He. Jadi enggak bisa [berdehem] si Dnya itu hanya bisa satu aja yang pegang, satu maja yang pegang.
Nah, makanya sampai sekarang masih dipertahankan konsep itu ee supaya enggak berantakan ya.
Heeh. Nah, worker kan diciptakan supaya bisa multitread.
Tetapi urusan DOM, domain apa sih?
Domain objek dokumen objek model dokumen objek model. Nah, dokumen objek model ini cuma bisa memanipulasi cuma main trade.
Cuma bisa si main trade. Iya si browsernya jangan minta si web worker kita di kita offload nih ke webker tolong update kan
button disable button. Oh tidak bisa.
Heeh. Enggak bisa langsung ya. nya iya bisanya kirim pesananya kirim pesan kirim pesan menyuruh kirim pesan balik
ke mrate silakan ee update terus dihandle dihandle dari mrate-nya ya dihandle kalau pesannya ini maka tampilkan button
gitu kan iya si siapa apa frame js yang kita suka island architecture itu astro asro astro kan astro kan juga punya
librarynya untuk mengoad si Google Analytic ya kan ya party party town kalau mau yang agnostik iya party town terus dia ee si
analitiknya kita itu kan sebenarnya kalau misalnya kita klik something atau page load analitik kan tetap jalan tuh
di belakang ngirim-ngirim pesan ngeping terus ya ngirim-ngirim pesan gitu ya he bisa ngepay ya ke setiap tergantung
event event event ya event tergantung event handlernya kita setup apa ya bisa button klik bisa scroll bisa
tergantung bisa ya. Nah, jadi kalau ee proses kirim itu kan sebenarnya wasting ya, karena dia enggak butuh mainten
tetapi tetapi dia blocking di JS.
Iya. Nah, jadinya kalau dia di-offload ke webker si main JS kita aman. Nah, si party town sudah ngerjakan itu.
Oh, iya. E kalau misalkan cuman ngirim-ngirim v kirim post doang ke Google Analytics dan kita harus nunggu
sampai datanya nyampai dan dikirim balik dengan status oke kan jadi web-nya jadi lambat kan.
Heeh. Kerasanya lambat. Iya lambat. Sebetulnya bisa fire and forget apa void ee ya kirim aja. Tapi mau saya mungkin
kalau analyticsnya banyak ya bisa di-upload. Kenapa enggak di-upload aja?
Iya. Ee makanya kalau apa ya web worker ini dimanfaatkan untuk ya udah kita ngeklik ngeklik ngeklik itu kayak record kesimpan dulu
sementara terus dia kirimin tuh satu-satuung gitu tanpa harus he kalau banyak kalau banyak interaksi yang dikirim tinggal interaksinya aja apa
ngeklik ini itu ini itu nanti e handling post request-nya biar ada lagi ada lagi ini yang lain ee ee
cara penggunaan yang lain. Misalnya si Web Worker ini terakhir itu yang kapan ya kita CDS yang pernah ya intinya waktu
kita ke CDS yang lalu tuh Mas ya em dia bisa mengeksekusi apa tuh namanya yang yang binary
wasemak assembly dia bisa mengeksekusi web assembly ini mulai pikun kayaknya nya astrupa.
[tertawa] Iya iya. Gua kalau udah udah kebanyakan kerja begini nih. Ee kebanyakan pakai ini kayaknya nih.
Konteksnya penuh. [tertawa] Konteksnya sudah penuh. Iya betul.
Konteksnya penuh. Web work tuh bisa bisa akses ke web assembly. Jadi contohnya kalau mau kompres kompres, kompres image atau audio video. He
audio video misalnya bisa atau connect maybe connect ke lm juga bisa ya lewat web worker maybe bisa ee jalankan terus
kemudian dia connect. Jadi kita enggak perlu nunggu atau si ma itu nunggu kompres itu selesai baru bisa nerima
input yang lain. Kalau enggak itu kan bisa nge-freeze.
Nge-freze ya. Enggak bisa ngapa-ngapa. Enggak bisa scroll, enggak bisa ee ganti halaman. Ya kayak itu aja kayak alert.
Alert muncul kan enggak bisa diapa-apain tuh yang di ee web-nya ya.
Ya. Tetapi kurang entah kenapa web worker ini kurang populer ya. Saya enggak tahu karena lebih populer service worker ya.
Iya. Karena sering diabus [tertawa] diabusi apa nih?
Hah? Nah, itu tuh ada komen jalan jalan background apa mining ya? Bisa aja itu jalan diak enggak bisa kanak
kan jalan di jalan di ininya si tradnya si main.
Oh kalau transformer GS bisa pasti.
Maybe saya belum coba ya. Mayis coba tanya ya. Kalauem kalau apa-isa aja sudah ada yang bikin belum ya? Tanya do
AI beli ah domainnya. Kalau service worker itu trade sendiri.
Iya trade sendiri. Trade terpisah dari browsernya.
Semua worker semua keluarga besar worker itu trade terpisah.
bisa banyak eksekusi dalam waktu bersamaan. Dia bisa ee melemparkan banyak worker sekaligus.
Bisa bisa ya? Bisa ya? Tapi dia sistemnya ini ya pernah pakai ini enggak sih? kayak si kalau aslinya ya dia kayak ngelempar
terus kita ada setup untuk listenernya kita dia kayak push state push push state dia ngpush terus nanti
dia call back jadi kita apa kayak event handler ya kayak klik event atau apa tapi ini kita
eventnya eh listen eh pesan yang apa message yang dikirim dari worker itu sama kok. Maksudnya kalau teman-teman udah pakai service worker
ya apa kurang lebih secara inasinya sama.
Iya, cuma tetap aja mau saya web worker use case-nya apa tadi tanya Jemenai cukup membantu sih tu coba buka deh yang
oke nanya juga tuh bedanya service worker dengan worker apa gitu dengan web dengan web worker kalau worker kan kelasnya interface-nya
nah eh apa implementasinya tuh kan web worker service worker bedanya apa nah jemen cukup membantu web worker justru bisa bikin web-nya
jadi berasa cepat. Cepat. Heeh. Kalau malah bisa lambat.
Tapi bikin berat laptop enggak? Pastilah ya. Kalau ada proses kayak kompresi tadi pasti jadi lebih berat kan ya.
Berat dimanage sama worker eh sama browsernya juga. Jadi kayak si browsernya tuh bisa ngelimit kalau dirasa apa menu-menuhin
memori. Pokoknya memori dan di space itu dikontrol sama eh jeruannya browser enggak bisa diforce maksudnya kita enggak bisa nge-abuse
ee yang sampai bikin laptopnya jebol.
Nah, ini nih benar nih. Offloading heavy CPU intensive computational task. Jadi kita delegasikan tugasnya ke webker.
Sedangkan service worker itu ya proxy lah ya untuk offline support. Jadi ada web teman-teman tiba-tiba ee Iya tiba atau ee sinyal hilang,
internet mati tiba-tiba paket habis gitu ya. Masih bisa diakses tuh beberapa ee aplikasi eh bukan aplikasi beberapa halaman mungkin ya. Nah, itu
offline support bisa casing juga notification misalnya PWA misalnya kan itu tahunya P. Nah, itu bagian dari progresif web apps ya.
Oh, life span-nya tadi dibahas juga ya?
Sudah dibahas ya? Kita bahas di belakang layar tadi ya.
Itu itu saya yang kasih tahu tadi tuh bedanya ya.
Iya. I jadi kalau web worker tab nempel sama tab. Kalau close dia berhenti ya mati i hilang
worker bisa jalan di kalau service worker itu persisting makanya dia ideal untuk misalnya kalau yang e cukup use case yang cukup comon
cukup umum push notif kalau yang pernah pakai FCM apa kalau dari Google ee pernah dengar pernah dengar one signal
signal gituah heeh heeh jadi misalnya kita punya situs berita terus Terus kemudian ee sudah PWA ada service worker-nya. Terus supaya tetap
beritanya bisa ke fetch dengan ee di belakang layar. Jadi saat orang buka itu sudah langsung berita yang terakhir
sudah ke-update atau ee kita bisa ngiri ngirimkan push notification. Jadi kalau ada berita yang baru masuk bisa muncul itu kalau pakai
FCM juga apa bisa ya? Kalau pakai FCM juga bisa gitu ya. Ma serv-nya apa bebas ya? Kalau yang dari
ekosistemnya Google pakainya Fairbase Cloud messaging. Itu asal jadi user enggak kan enggak mungkin user mantengin ngebuka ee web app kita terus kan ya
udah bebas diclose aja bisa diclose.
Iya nanti ada. Oke. Makanya karena ini dia persistance selama browser dibuka. Kalau browsernya diclose ya mungkin mati ya. Tapi selama
browser dibuka walaupun tab-nya enggak kalau browsernya diinstall tapi ya asal browernya di quid gitu exit gini quid
Google Chrome gitu. Kalau ini lebih lebih tepatnya lebih tepatnya kalau di Iya kalau to home screen jalan
ya kalau di home screen jalan. Oke. Oke.
Ini lebih tepatnya untuk mobile sih Mas kan mobile kan jarang dius kan. Oh, kalau laptop bisa, tapi ya kalau
browsernya diclose ya enggak bisalah, enggak ada background prosesnya kelihatannya enggak bisa. Tapi kalau di kalau di mobile ditutup aja, close all
juga bisa. Ditutup aja. Hm. Ya, ya, ya. Makanya ini jadi diabuse ya, sering keabuse gara-gara ini ya, persistance enggak eh
bisa jalan di background tanpa harus membuka tab ya.
Handling-nya terutama dari Google Chrome kalau menurut gue ya lumayan bagus kok.
kan harus add to home screen ya. Cuma tetap aja kan kalau dari segi teknis sudah rapi social engineering-nya
sisinya mau saya apa cara mungkin ee diabuse dengan cara memanipulasi biar orang pada nginstall maksudnya ng-add to
home screen aplikasi itu yang jadi spam atau apa. Nah itu kan udah di luar hal teknis kan. Tapi maksudnya harus user
harus dengan bukan enggak bisa cuma enggak sengaja buka habis itu dibombardir notif harus dengan sadar e ngad to home screen
ya PWA kayaknya web worker kebalik Mas Akyar mungkin ini banyak juga yang salah ya kebalik justru service worker yang
PWA PWA tapi sebenarnya umbrella ya untuk macam-macam ee macam-macam fitur atau kapabilitas yang menyerupai Betul.
Jadi terks aplikasinya kalau mau ininya mau dia sebenarnya service worker kayak proxy dia network proxy sebenarnya network proxy atau
eh bisa dibilang human in the middle.
Jadi kayak human in the mid. Jadi sebelum sebelum [mendengus] dari browser sebelum connect ke web server-nya kita ada si
service worker yang ee Iya. Middlem middlem. Oh iya kalau media man kan enggak ini ya enggak inklusif C middle human.
Oh iya middle human. Middle human.
Middle [tertawa] earth. Human in the loop ya. Human in the loop.
Balik lagi ke AI [tertawa] ya. Iya makanya human in the loop.
Iya. Jadi kebalik kalau web worker itu yang ee hanya bisa berjalan kalau ee kita mengakses halaman website-nya. Buka
misalkan ngobrolin e ngobrol. Nah, tab-nya kita buka browser kita ketik ngobrol. Nah, itu webwer jalan. Ketika tab-nya kita close udah web workernya
mati hilang. Kalau service worker ketika tab-nya diclose, dia mungkin masih bisa jalan gitu. Dia mungkin ambil data
terbaru. Iya. Kalau sudah diinstal, ambil data terbaru, terus update-update dan lain-lain. Begitu kita buka, oh datanya sudah berubah nih. Gitu.
Betul. Nah, terus apa? Network control tuh. Eh, tadi buka itu lagi aja tadi yang Jenai.
Heeh. Kalau web worker ternyata enggak bisa web enggak bisa inter network request dia cuma bisa bypass aja. Oke.
Kalau service worker kan biasanya dia cek dulu kan kalau ada koneksi internet dia akan ambil dari internet kalau
enggak ada dia akan ambil dari lokal.
Jadi f-nya itu enggak maksudnya itu diekspos ke kita ke developer kita ya bisa terserah maksudnya kalau offline ya jelas harus
kita intersep kita kita serve static aset ya sesuai yang kita tentuin. Nah, kalau tapi kalau buat ee apa misalnya
kan walaupun online kita pengin casing kalau datanya kita enggak masih fresh, data kita enggak sering berubah, ngapain nge-fage lagi
misalnya kita ee apa mutusin gitu itu juga bisa maksudnya kita kita mendapat full granular control eh untuk semua network request.
bahkan bisa ngecek f request-nya ke mana. Kalau ng-request ke halaman ini, kasih data yang segar. Maksudnya silakan
ambil dari network, dari internet. Tapi kalau misalnya ke Pat yang ini ee yang lainnya misalnya yang enggak terlalu
perlu, enggak terlalu sering terupdate, ya udah kita serve aja. Itu sepenuhnya suka-suka kita.
Hm. Oke, lanjut. Komunikasi kalau [tertawa] web enggak bisa sama sekali ya.
Iya. Ee jadi dia hanya bisa berkomunikasi hanya ke yang yang kita bahas tadi kan nempelnya sama satu tab.
Iya. Iya. He nempelnya ke satu tab. Kalau ini bisa ee di apa ee meskipun tab-nya sudah tertutup, dia masih bisa berjalan gitu
ya. Masih bisa berkomunikasi ya. Misalnya kita buka 10 tab dari ee website kita terus ee ternyata offline atau ternyata
ada data baru misalnya itu kita bisa ngupdate semua tab.
Hmm. Oke. Dia nempelnya di domain kalau siswa.
Dom origin. Origin. Origin. Kalau ini nempelnya di tab.
Oh berarti kalau service itu ada ada potensi e bisa bikin lambat device dong.
Misalkan kita bikinlah satu satu service worker yang bikin sibuklah kira-kira gitu. Dedos atau apa gitu ya misalkan
ya ada dihandle sama algoritma browsernya.
Iya. Oh browsernya tetap ada itu ya.
Tapi tetap aja bisa diabuse. Kayak backgroundnya itu bisa diabuse.
Bisa tapi maksudnya ee Heeh. kayak diperlambat ee apa jalan trade-nya kan si service worker punya trade sendiri. itu diperlambat atau disuppress
atau ee kayak semacam di throttle misalnya kalau yang mungkin enggak buus seekstrem itu, tapi misalnya dia streaming atau men-download data,
padahal koneksi ee kalau contoh yang gua tahu dan pernah ngerjain sih kalau koneksi pernah ngecek maksudnya ngetes
gimana kalau koneksi internetnya lambat. Nah, di Main Trade kerja lagi berusaha nge-load image lah.
Terus di service worker trade-nya juga lagi nge-load atau ng-download suatu file.
Itu algoritma browser yang bakal menangin main menentukan.
Eh, tapi ya lagi-lagi bisaoritaskan mate ya.
Heh. Heeh. Yang yang disupress maksudnya yang di apa di throttle sifice worker trade-nya. Tapi kalau perkara bisa debus
atau enggak ya jelas bisa. Hm.
Iya, iya, iya. Oke. Oke. berat eh bisa enggak ya kita misalkan tiba-tiba kok ini laptop kok berat banget kita buka kayak semacam
test manager gitu ngelihat ada service worker yang jalan tuh ada enggak sihnya atau tool di de tools
de tool ke again application application itu ada service worker see all registration mudah-mudahan enggak ada yang aneh-aneh
Ayo [tertawa] jangan nanti enggak sengaja doxing.
Heeh. Ini dari Chrome extension. Chrome extension.
Iya. Semua semua service worker yang pernah terdaftar di browser itu Chrome extension banyak tuh ada top level. Iya itu
extension semua tuh rata-rata kan ada scope.
Iya sama top levelnya. Nanti kalau misalnya ada website yang lain ya coba aja scroll mungkin paling bawah ini
masih chrome extension semua ini. Oh itu ah lewat komen F aja www. Apa?
X.com. Ketahuan kan saya lagi buka.
Enggak harus juga siak ini ini tapi bisa dilihat tuh sudah installation statusnya aktif tetapi enggak running.
Enggak running. Running statusnya stop. Iya.
Eh, jadi ingat kalian ingat enggak sih dulu ada di apa kayak mungkin I don't know.
Nah, ayo L itu ya bisa diunister kan saya baru close baru close X-nya tadi malah X-nya aktifin tab-nya biar
bisa ng-close mungkin engak pencet close tombol close tab. Oh, nah enggak tahu.
Enggak tahu deh. Jadi dulu YouTube YouTube nih ya apa saking eh live cycle service worker agak ngebingungin maksudnya enggak
enggak instinktif bisa langsung tahu. Dulu tuh ada web game-nya buat mempelajarin life cycle service pernah ingat? Pernah ingat
Google dulu. Iya. Heeh. Service workies. Coba ya kita cari ya.
Service workies. Heeh. Service work. Masih ada enggak?
Oh, masih masih ada enggak ya?
Masih. Oh, masih. Oke. Tapi enggak ada web work ya? Enggak ada game buat memahami life cycle-nya.
Webwis serius ini berbayar sebenarnya dijadiin free 179.
Iya, itu tuh kayak Win M eh WinRAR sorry ya.
Winrun atau wins pokoknya yang e selalu apa bayar tapi lagi dibilang lagi free gitu kan.
Kalau weker mungkin enggak enggak serumit itu ya. Maksudnya life cycle-nya relatif lebih simpel karena dia nempel ke satu ya satu tab itu kan berarti
kayak satu window ya satu dokumen global scope.
He. Oh Mas Akyar nih pernah bikin ya buat trigger tab lain. Hah? tab lain sinyal memberikan sinyal ke tab lain gitu
maksudnya. Oke, itu bedanya ya. Eh, tadi kita sudah sampai mana nih? Nah, masih ini ya.
Lanjut ya. Ee bagian trigger event ini manual.
Kalau ini bisa buy system. Jadi kalau ketika aplikasi kita mengakses patch itu bisa diinterup, bisa digantikan oleh si
service work. Kalau ada post notification, ada background sing dan lain-lain. Kalau yang web worker tuh enggak ada. Semuanya
harus ditulis manual. Y. Dan kenapa salah satunya web worker itu enggak enggak apa namanya enggak tren karena
ngoningnya susah karena post message itu low level ya?
Iya low level ya. Iya. Iya. Makanya enggak tapi post message itu kan si worker juga pakai itu kan kirim-kiriman
message-nya. Iya, tapi karena tinggal pakai sw.js itu kan tinggal sw.js dan script yang di dalam sw.js itu bisa diunning jadi kayak
function call. Ketika kita tinggal pakai post message itu kayak ngasih ngasih instruksi ke serv ya. Tinggal kirim broadcast event aja
kan. I seperti itu ya. post message jadi event even event apa namanya event handler bukan event handler event
brutas event base gitu event base kayak kita event driven event driven kok gua lupa mulu ya event driven eh programming
arsitektur di kirim tapi kalau worker gim nunggu sama Sama sama.
Nah, ini salah satu use case-nya juga adalah game ya karena bisa mempertahankan 60 fps kalau untuk di main trate-nya ya.
Ada makanya ada library dari si Dasurma yang Komling itu yang ini ya. Komling. Komling ini gunanya buat apa? ee buat mempermudah ya
menjbatani jadi library yang menjebatani untuk bisa akses ke ke worker secara secara sinkronus Ceritanya gitulah enjoyable lebih menyenangkan
oh berarti ini tuh ekivalennya kalau di service worker kan ada workbox ya dulu ya apa biar-nya user friendly lah developer Oke,
Mas Riza punya fans mentor Mas Riza.
Saya diinterview sama beliau. Oh, terus yang yang bikin service worker yang bikin yang bikin workbox.
Yang bikin workbox. Yang bikin workbox ya.
Terus dulu tuh beliau rajin banget di overflow. Kalau semua ada semua pertanyaan yang ada taggingnya workbox atau pwa selalu selalu ngejawab. Enggak
tahu sekarang zaman LLM mungkin udah enggak ya kayaknya itu cara kerjanya begitu tuh tinggal ini ya ee iya comlink
panggil work.js ini worker. Apa aja namanya ya bebas ya.
Iya itu script-nya kita [berdehem] script-nya kita.
Terus workj itu isinya itu tuh comlink.expos doang. Iya yang diekpose kelasnya kan. Jadi di Iya instance.
Heeh. D log something. Iya. Jadi bisa simple jadi punya kelas yang yang isinya eh eh method kita punya
yang mau kita execute. Ini bisa macam-macam ya. bisa kayak extracting, compressing, ee kalau game mungkin ada kalkulasi
eh physic engine. Physic engine. Kalkulasi physic engine ya.
Iya, bisa dixpose begitu. Collision. Iya. I kalau pakai spelt udah ada bawaan spell kit. Oke. Oh.
Wah. Jadi kangen pakai spelt lagi. Udah lama enggak?
Emang iya ya? Udah lama enggak kit web worker.
Ah, K-nya dua lagi. Udah harus ganti keyboard nih.
Itu web worked alasan. [tertawa] Eh, ini service worker salah yang ini ya. Web worker in sweld.
Ini way default udah ada ya maksudnya fasilitas spell kit lama. [berdehem] Oh, Mas Ogi tuh spell kit sudah lama katanya. Ini
kayaknya bukan deh, bukan yang official.
Oh, iya. Eh, salah kan? Mungkin sebelum sebelum ada sebelum surkitnya nambahin 3 tahun lalu.
3 tahun lalu sudah lama ya di Spell kitanya? Udah lama kata Mas Oi, gimana caranya?
I love web workers. Create web worker. Oh, ini dia enggak pakai kelas ya, pakai function aja.
Terus export. Ini browser ini cara kerjanya ya dijelasin ya. Ini UI main trade, ini background thread.
Kemudian diimport. Gimana nih? Sing worker worker. Oh, ini ini namanya namanya namanya S worker aja tapi dia itu dari
work nama variabelnya. Iya, import biasa langsung bisa menjadi eh web worker ya. Terus panggil D default berarti dia akan memanggil ini
ya konsol ya. Iya on message.
Dia akan manggil consol message. Iya.
Enggak bisa muncul terus kena wall terus [tertawa] create an account.
Oke. I. Oh, ada penjelasannya tuh kalau web worker emang dari komunitas.
Komunitas ya. Eh, kalau Sit. Oh, ya. Kalau Seltit kan framework-nya SW.
Kalau SW kit langsung Oh, langsung ya.
Berarti officialnya ya. Tapi kok enggak ada infonya ya? infonya justru ada worker.
Service worker. Eh, enggak. Kelihatannya yang official di Sit itu service worker.
Tapi kalau yang web worker tuh yang web worker itu dari komunitas.
Komunitas gitu. Oke oke oke. Sip. Karena baru baru yang saya tahu tuh ya baru si party tahun sama si
Komling. Mungkin banyak yang lain cuman dua itu aja yang saya.
Ohitang tuh we worker ya. Ada modul web workernya. H.
Jadi tergantung kebutuhannya. Nah, terus ee buka lagi tuh Jemenai yang bawahnya. Saya ngandelin Jemenai semua.
Iya. Enak Jena dapat gratis yang pro.
Iya. Heeh. Dipakai lah. Kan setahun doang. Tahun depan udah enggak ada.
Eh, enggak tahu ya. Dapat lagi enggak ya? Iya.
Apa? Udah nih. Habis nih yang ini kan tadi.
Iya. Yang kedua. Oh, yang kedua. Oh, ada lagi.
Heeh. Wah, foya-Fa. Lanjutannya foya. [tertawa] Foya-foya token.
Bikin trade lagi. Enggak kelanjutannya itu.
Kok enggak bisa di-copy? Eh, salah kan?
Copy paste. Susah amat. Gak bisa. Gak bisa diklik ininya. Oh, beda TR.
[tertawa] malah select all yang di tab yang lain kebanyakan monitor.
Nah, ini atasnya sama doang sama kayak mata kita juga ya. Webw apa browser tuh cuma kayak mata kita cuma
bisa satu monitor doang. Kalau dua monitor udah pusing gitu gak bisa.
Iya pusing. Kalau mau buka browser yang berbeda.
Kalau ini kan tadi service worker udah di yang kita bahas tadi ya. Nah, sekarang ini gift tips tips untuk
menentukan kapan sih pakai web worker, kapan pakai service worker.
Nah, pilih pilih web worker kalau masalahnya adalah logic berat terus maincate-nya lagi lagging lamber.
Wait, wait, mana? Belum keluar. Hah?
Ini kan saya putar-putar apaan? Oh, putar-putar.
Sudah belum? Belum, Mas Riza udah apa Eko? Udah bisa lihat.
Oh, lanjut aja. Saya belum bisa coba ya. Udah remove. Udah, udah, udah, udah, udah.
Padahal network connection-nya dua lagi itu ya, lagi pindah lagi balancing lah. Anak gua di sana main Roblox
soalnya jadi kayaknya emang ngaruh maksudnya segede itu kah?
Emang seberat itu kah? Ngaruh trafficnya. Ngaruh ya.
Oke, yang pertama kalau main trate-nya lagging. Lagging kalau scrollingnya enggak smooth kan lambat soalnya main trate-nya misalnya dipakai memproses data yang
besar atau kalkulasi yang berat. Nah, kan ya itu karena dia sibuk e ngerjain itu kita scrolling dia enggak bisa
ngrender ngpainting pikel-pixel di layar kan jadi sulit dioll.
itu solusinya adalah wewerker kedua terus kalau cuma nempel sama sesi itu atau tab itu.
Yang ketiga, unit multiple parallel thread. Multiple ya. Heeh.
Kalau service enggak bisa multiple ya.
Dia hanya satu trad ya. Karena dia di level tadi kan dia bekerja di eh nempel ke suatu origin
mau buka 10 tab satu tapi hanya bisa satu.
Hanya bisa satu. Makanya kalau ini bisa lebih dari satu.
Iya makanya website itu hanya boleh bisa hanya bisa punya satu sw.jsu service worker. Iya satu worker yang terdaftar
iya dalam satu waktu ya. Iya.
Kalau service worker kalau butuh offline ketability eh yang tadi kita bahas itu semua kan kita mau intercept network request tadi
yang kita bahas tuh custom casing straight mati gitu ya.
Iya. Enggak harus internet mati, maksudnya nyala atau mungkin koneksi lambat atau berdasarkan pad maksudnya halaman halaman apa yang dibuka. Iya,
bebas. Ini dulu makanan sehari-harinya Mas Riza ini waktu zaman Iya.
Pwa zaman dahulu kalah 2016 presentasi yang dibikin untuk PWA.
Heh. Ingat enggak sih dulu artikelnya ada ilustrasi apa? Steale while revalidate yang strategi-strateginya enggak sih?
Ada grafiknya itu ada ada ada tu juga pakai itu ee apa namanya dulu tuh strateginya ya em dari dari Google loadnya loadnya AMP.
Load-nya AMP. AMP ya kan? Jadi AMP ngload secara cepat.
Iya. Heeh. loades kan bisa secepat kilat tuh AMP gitu kan.
Nah, AMP AMP-nya yang ngeinitialize si service worker ngambil service worker ng-download instal service worker terus kemudian bisa fetch URL-URl yang
kita dahulukaninkan. Nah, terus kemudian ee saat si user klik ee link tertentu bisa ngebukanya langsung ee udah karena sudah selesai loading
karena sudah sudah selesai diading sama si AMP.
Itu dulu strategi yang digadang-gadangkan oleh Google dan yang saya apa ber evangeliz kar-karya evangelize ke mana-mana. Tapi
sekarang AMP sudah dibunuh. Iya. Habis apa udah masuk apa Graveyard Google. Graveyard. Killed by Google.
Eh, Killed by Google. Terus lanjut web web stories pernah naik kan? Tapi habis itu habis juga.
Iya. Ya sudah. Heeh. Heeh. Lanjut. Eh, kalau kita butuh pekerjaan yang tidak perlu eh web-nya nyala, web-nya diakses. Kalau type-nya diclose
dia tetap bisa jalan. Contohnya push notification, background yang tadi kita bahas ya, paling common ya, use case
push notif. Heeh. Background. Dan terakhir ya ini sebagai salah satu syarat untuk memenuhi strict requirement. Nah, itu lighthouse
ada item kayak salah satu kayaknya wajib ee halaman home-nya itu enggak boleh 404 kan kalau offline.
Iya. Ee biar boleh ada ee game dinosaurus itu.
Heeh. Enggak boleh muncul kramda itu.
Iya. Singkatnya kalau tentang UI performance dan komputinya eh berat pakailah web worker. Kalau network control, casing dan offline support
worker. Kalau butuh dua-duanya ya pakai aja dua-duanya enggak masalah.
Menyesuaikan beda beda tujuan. Heeh. Kalau emang fiturnya ee mengharuskan dua-duanya kayak misalnya apa ya? kita punya video atau image
editor, kita ngupload eh image file terus diedit atau di apa eh processing image itu kan berat berat dan eh khusus
terkait di tab itu kan image yang di-upload oleh user ya cuma diurus sama tab itu kan berarti itu bisa dikasihin
ke webker tapi kita juga bisa pasang service worker misalnya buat apalah buat eh push notif atau background
tergantung fitur yang kita butuhin. I.
Nah, si Surma tadi yang kita bahas yang dulu dia kerja di Google sekarang di mana ya? Saya enggak tahu. Enggak update
lagi. Dia juga sempat Shopify. Iya. Dia sempat juga selain mengeluarkan comel tadi, dia ada ide untuk bikin semacam aktor model
di JavaScript dengan memanfaatkan web worker apa namanya?
Tapi enggak tahu ini masih di e apa ini eksperimen atau kayaknya ini library ya.
Coba kita lihat ya. kayaknya lebih ke konsep sih.
Anor, a model, and an architect on the web.
2017 aktor model itu kan kayak berkirim pesan. Jadi sama e sama e sama prosesnya seperti web worker eh web worker ya.
Iya. Jadi kita hanya bisa mengirimkan pesan ke webker, tapi kita enggak bisa e ngirim kayak tadi mau pesan nasi goreng,
kita enggak bisa langsung pesan ke abang nasi gorengnya karena kita harus lagi live nih, enggak bisa jalan ke sana.
Jadi kita suruh orang. Nah, kita hanya bisa kirimin pesan nih, tolong pesanin ini. Nanti ee si middlem-nya ini atau si
orang yang ee didelegasikannya ini yang menyampaikan ke e pekerjaan utamanya.
Setelah itu baru dia balik lagi itu aktor model. Kira-kira kayak gitu.
Nah, di sini dia sempat sebut juga ee menggunakan webker karena cocok.
Ada post message, ada web worker. Nah, bentuknya nih kayak gini. Contohnya kalau mau ngerjain ee operasi matematika
yang sangat berat berat seperti menambahkan dan mengalikan 4 dan 9. Ini bercandaan ya kayaknya.
Ini bisa dikirimkan ke worker. Jadi dia kalkulasi kemudian dibalikin. Nah, ini mungkin bisa berguna untuk ini ya
machine learning ya. Memproses data. Nanti ketika sudah selesai maka dia akan dikirimkan kembali ke mainten-nya dan di
ee kerjakan. kayak untuk kalau sekarang ya dipakainya buat itu kayak wasem e transformer jalanin model.
Yes. Kayaknya sama ya sentry sama Google Analytics model-modelnya mirip.
Sentry itu berarti error lock ya. Benar enggak sih?
Kalau ada error dia akan ngirimin datanya ke dashboard ya.
Eh iya. Apa tadi? Eh, Party Town ya.
Party Town. Kalau Guest Toown beda lagi ya. Steve Steve Y siapa? Eh, Guest Toown beda beda.
Eh, bukan kok enggak ada party town JavaScript?
Asjang dah itu bukan punya party mah. Ee punyanya si Heeh. sih yang bikin ular itu.
Iya, tapi itu mustik kok setahu saya.
Iya, cuma ada Heeh. Ada integrasi Astro Astro JS pasti Astro JS Party Town.
Buka aja ininya si si si si si si si doc-nya ada enggak ketemu? Enggak.
Astro party town toown. Iya. Iya.
Ini ya. Iya. Tapi agnostik ya. Enggak itu pluginnya buat apa? Mengintegrasikan si party tahun yang dibikin oleh si Mas
Quick ini kan. Iya. Siapa? Tetapi ini bisa maksudnya sudah tujuannya.
Heeh. Iya. Untuk analitik ads tadi error logging dan lain-lain sehingga web kita tidak slow.
Iya ya. Karena sudah didelegasikan. Cara pakainya gimana? Import lalu integration. Sudah. He selesai.
Iya. Iya karena dia party tadi balik ke tab party.
Oh terus ditambahin typenya. Type-nya text party town yang scriptnya di scriptnya.
Coba lihat itu apa dokumentasi si partyown yang aslinya quick.
Iya tadi berarti ya. Heeh. Nih sama sih ininya. Sama kata-katanya sama ya kan tadi yang di Astro cuma ngap si
ini hm tujuannya dan benar pakai eh web relocate resource intensive scripts into a web worker and of the main
sandbox sandbox third party script and allow or deny their access to mate api sekalian buat ngerangkeng script ee
third party ya. E bisa akses sembarangan ya.
Cara pakainya gimana? Cara pakainya kalau tanpa pakai pakai Astro enggak ada ya? Itu pakai integration
di apa? Eh command minus zoom out. Nah itu scroll ke bawah.
Scroll ke bawah integration. Nah, itu HTML aja. HTML HTML HTML kita anak partyown sama ya langsung.
Iya. I importnya enggak ada import-importan. Oh ada. Eh ini snipet ya.
Party Town forward data layer push party town script. Oh, jadi pakai script type-nya ya diganti ya.
Heeh. Heeh. Enggak teks JavaScript, tapi teks party town.
Terus jalaninnya gimana? Oke, buka aja hitup-nya kalau diparing.
Heeh. Dia memproses apapun yang kita taruh di dalam situ.
Spell kit ya. Mirip kayak si Astro tadi dia nge-wraap ee nge-wrap si Town script-nya.
Hm. Di strategy VT. Oh, dari VT-nya ya.
Ee nge-load si Party Town atau Wepeg.
Ada yang masih pakai Wep? Lha ada ya? Pasti ya.
React ini ya. React create componen. Wah CR create react masih pakai class. Adakah React yang masih masih teman-teman masih
maintenance class base react componen? Gu sih enggak enggak ya udah migrasi semua ya.
Oke siapa lagi? Ada lagi yang perlu dibahas?
Ada lagi enggak? Ya udah kayaknya ya.
Kayaknya cukup ya. Tapi kalau jadi intinya kalau mau pakai web worker saya antara pilih mau pakai comlink atau party town.
Saya belum pernah sih pakai party town.
Baru selama ini baru nyoba-nyoba pakai comling.
I see. Oh ya itu fungsinya sama ya.
Party tahun. Party Town itu kayaknya enggak bisa buat semua keperluan ya. Maksudnya kayak eh script yang bisa dijalanin di party tahun tuh
apapun. Any arbitrary script any arbitrary code atau cuma kayak misalnya analytics atau apa error catching atau apa?
Kayaknya bisa deh karena script yang web worker yang mau kita jalanin itu kan terserah kita.
Contohnya analitik atau yang kita yang kita teks party tahun itu kita tulis sendiri.
workernya kita sendiri. Worker.js atau whatever work.js.
Iya. Dan di dalam workernya kita mau jalanin apa kan tergantung kita mau forward eventes apa yang mau dijalanin
nanti dia yang jalanin. Coba ah nanti habis ini main-main pakai mumpung ada AI sudah bisa ditanya kayaknya yang ee apa di X yang paling
user friendly sih party tahun ini kan kalau si yang apa aktor aktor apa tadi yang bikinan serma itu kayaknya enggak
di-update ya agak sedikit lawas. Oh, Komlink. Kalau Komlink eh kalau Komling kayaknya lebih low level sih kayaknya
ya. Lebih low level. He kayaknya lebih apa? Modern party tahun aja ya.
Lebih modern. Iya kayaknya. Oke, kalau enggak ada pembahasan lagi kita pilih topik buat minggu depan teman-teman. Ada ide enggak?
Pik topik yang ada buat minggu depan spin theel yang ada bintang tamu minggu depannya lagi ya.
Minggu depannya lagi 7 Juli kita ada bintang tamu bahas tentang eh tools AI ya.
Wih spin the wheel dulu. Wah siapa tuh? Loh ya tunggu saja bedah framework. Wah, lito JS sudah enggak ada sih. Udah kita
close aja ya. Gimana caranya ini? Klik close.
Mana dia nih lito JS ini namanya Lito JS aja gua enggak tahu.
Lito JS ini adalah orang yang akhirnya ee bakal kita interview nanti di tanggal 7. Yang ini orang yang sama ini.
Oh oke. Ternyata dia ID sendiri.
Ee tapi udah enggak main. E udah enggak e develop itu lagi malah sekarang ke AI.
Jadi itu bisa kita close kita ini lagi ya S. Li li
http 1. Eh bukan. Trik optimasi JavaScript. Oh, kok saya yang bikin? Oh, ini dari dari apa namanya? Dari artikel
tuh. Data structure, string comparison. Saya menarik kayak kembali ke laptop.
Iya, menarik. Fundamental ya. boleh ini aja. Setuju.
setuju. Setuju. Oke. Baiklah kalau begitu kita bungkus. Bungkus.
sesi malam ini ee kita sudahi dulu.
Ee terima kasih buat teman-teman semuanya yang sudah hadir. Sampai jumpa minggu depan. Selamat malam, selamat istirahat, sampai jumpa. Bye bye.
Apakah Anda baru pertama kali melihat tayangan dan halaman ini atau mungkin telah kesekian kali melihat untuk membandingkan kembali dengan lainnya?
Jika Anda mencari tahu mengenai layanan web hosting terbaik, kami pastikan Anda berada di tempat yang tepat. [musik]
Dengan domainia dapatkan pengalaman menggunakan layanan hosting yang lebih baik [musik] dengan SSD berperform tinggi dalam infrastruktur cloud yang telah
dioptimalkan untuk kebutuhan personal maupun bisnis. Teknologi ini memungkinkan Anda memperoleh layanan yang [musik] lebih stabil serta proteksi
dari korupsi data. Hosting domain Asia juga telah mendukung nots, Python, Ruby, [musik] Go, PHP. Java serta Binary
Linux. Lebih dari 200.000 pelanggan telah mempercayakan layanan hosting di [musik] domensia. Kepercayaan yang kami jaga dengan garansi up 99,9%
serta garansi uang kembali 100%. Buat [musik] Anda lebih mendunia, segera beralih ke webosting domainesia.
Deskripsi asli dari YouTube
πΈοΈ Selasa malam waktunya #ngobrolinweb Sesi kali ini kita akan membahas tentang Web Worker. Ada yang sudah paham tentang Web Worker? Apa bedanya dengan Service Worker? Nah mari kita oborlin di sesi kali ini! Sesi ini terselenggara berkat kerjasama dengan Domainesia! π¦ Langganan Cloud VPS Turbo? Gunakan kode: NGOBROLINVPSDN β 50% OFF, bisa digunakan berkali-kali! ποΈ New to streaming or looking to level up? Check out StreamYard and get $10 discount! π https://streamyard.com/pal/d/551239 Kunjungi https://ngobrol.in untuk catatan, tautan dan informasi topik lainnya.
Episode Terkait
5 Jun 2024
Ngobrolin NextJS
Episode Ngobrolin kali ini membahas update terbaru dari Next.js 14 beserta berbagai kontroversi dan perubahan signifikan...
3 Apr 2024
Ngobrolin Cache
Episode ini membahas topik caching secara komprehensif mulai dari konsep dasar hingga implementasi praktis di berbagai l...
2 Agu 2023
Ngobrolin Privacy Sandbox
Privacy Sandbox dibahas bukan sebagai wacana melainkan sesuatu yang harus disiapkan dari sekarang, karena dampaknya bisa...
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 .