Bedah Situs
Ringkasan Episode
Bantu KoreksiEpisode ini adalah sesi bedah situs, membedah dua website yang dikirimkan lewat DomaiNesia secara langsung di depan penonton. Situs pertama milik Mas Zain — landing page komunitas Vibe Coding from Cafe — dan uniknya perbaikan dikerjakan saat itu juga oleh coding agent lewat Telegram, mulai dari memperbaiki contrast ratio teks yang hanya 3.0 (di bawah batas minimum WCAG 4.5) sampai membuat PR yang bisa langsung di-preview. Bagian terbesar episode adalah tutorial praktis membaca Performance panel di Chrome DevTools. Ivan menunjukkan cara throttle CPU ke mid-tier mobile dan network ke fast 4G supaya audit tidak memakai spek dewa, membedakan lab test (Lighthouse/PageSpeed) dari field data CrUX (Chrome UX Report) yang dikumpulkan anonim dari pengguna Chrome asli, lalu menelusuri kenapa LCP tinggi karena chaining CSS, font, dan JS sebelum React sempat hydrate, serta melacak layout shift sampai ke force reflow yang dipicu CSS. Situs kedua milik Baliyun, seorang mahasiswa yang juga bekerja, membawa pertanyaan apakah perlu migrasi ke Next.js demi SEO. Jawabannya tegas: bukan itu masalahnya. Sekali page load situs tersebut memakan 57MB bandwidth karena gambar galeri berukuran 2.000x2.000 piksel ditampilkan pada 80 piksel, dan mengganti framework tidak akan menyelesaikan itu. Ditemukan juga open graph image yang 404 sehingga link tidak muncul preview saat dibagikan.
Poin-poin Utama
- •Saat mengaudit performa, throttle dulu CPU ke mid-tier mobile dan network ke fast 4G — jangan mengukur dengan spek dewa karena pengguna di luar sana tidak memakai Mac dan iPhone
- •Lab test (Lighthouse/PageSpeed) adalah forensik di mesin kita, sedangkan CrUX adalah data lapangan anonim dari pengguna Google Chrome asli pada persentil 75 — keduanya menjawab pertanyaan yang berbeda
- •LCP tidak selalu gambar; browser yang menentukan elemen terbesar di viewport, dan pada situs React ia bisa tertunda lama karena chaining CSS, font, lalu beberapa chunk JS harus selesai sebelum hydration
- •Force reflow terjadi ketika CSS atau JS berikutnya memaksa browser menghitung ulang dimensi yang sudah ditetapkan sebelumnya — inilah sumber long task yang merusak INP
- •Ganti framework bukan solusi performa: situs yang memuat 57MB sekali page load karena gambar 2.000x2.000 piksel ditampilkan pada 80 piksel akan tetap berat di Next.js, Astro, maupun Laravel
- •Patokan praktis ukuran gambar: usahakan di bawah 100KB, mentok 150KB; pakai JPG atau WebP untuk foto dan PNG untuk logo/ikon, dan iframe seperti embed Instagram bisa diberi loading="lazy" yang sudah baseline
- •Open graph image yang 404 membuat link tidak menampilkan preview saat dibagikan di WhatsApp — kesalahan kecil tetapi fatal untuk promosi, dan bisa dicek cepat lewat heymeta.com
Eh, oh iya, mulai!
Dapatkan hanya di Domestika
Halo!
Cepetan mencetnya
Apa kabar?
Udah lama?
Udah lama gak denger-denger kabar?
Iya
Kayaknya kalau di dunia
apa namanya?
Rasanya ya, di dunia
sekarang itu yang dengan, penuh dengan
AI, yang buka mata
itu isinya
isinya kabar-kabar AI
dengan kecepatan yang penuh, sehingga
rasanya kayaknya hari itu
cepet banget, apa ya?
Berlalu gitu
Sorry, bukan cepat berlalu, intinya
kalau kita gak ketemu seminggu
itu berasa udah lama banget gak ketemu
karena kabarnya udah terlalu banyak
iya, kayak
kayak diantara
diantara live kita
udah banyak
update-an aja, gitu
iya, iya, iya
Kalian inget gak, jaman sebelum ada open vlog
Lihat transkrip lengkap (2773 segmen lagi)
maka yang dulu-lulu
Halo, halo
ada Kaisa
oh, update ya, kemarin
ada acara Meetup Kursor
jadi, apa namanya?
saya gak bisa ikut
pas lagi itu ya
paskah, iya
jadi harus di bada dulu
namanya, cafe kursor apa
kursor cafe, jadi acaranya di cafe
serius?
iya, cafe kursor
cafe kursor ya
kebetulan ada devrailnya yang dateng
jadi
seru lah, ya kalau talknya biasa
standard lah ya, jualan
tanda kutip kan
ngobrol-ngobrol sama temen yang
seru
kenapa?
dapet 50 dolar
makanya
kemarin bilang sama penyelenggarannya
kalau bisa setiap bulan ada meetup
jadi setiap bulan saya talk up
oh, kursor from cafe
kursor from cafe tuh, kata mas Zain
tuh
cfc
kursor from chicken
oke, malam ini
kita dipersembahkan oleh
siapa ini?
malam ini kita kembali
bekerja sama
bekerja sama, berkolaborasi dengan
Domain Asia, jadi temen-temen
yang mau bikin website
atau mau
fatcoding gitu ya, terus bingung kan
deploynya dimana, bisa salah satunya
beli domainnya di Domain Asia
bisa hosting di Domain Asia
itu dapat diskon 10%
kalau pakai promo code nya ngobrolin
webdn
kalau yang mau pakai
vps
virtual private server, diskonnya
lebih gede, 50%
itu promo code nya
sebentar
promo code nya
ngobrolin vpsdn
dan kode promo nya
bisa dipakai lebih dari 1 kali
di akun yang sama, jadi gak perlu
register, gak perlu pakai email
boongan, gak perlu bikin baru lagi
pake aja
yes, jadi terima kasih Domain Asia
mana, propertinya
gak minum, gak minum
minum dong, minum dari Domain Asia
kalau mau beli air gelas
katanya mau beli air gelas
gimana sih
gak ada
minta sama istri, eh tolong buatin teh dong
terus
dia bawa ini
secara
gak minta
pake gelas ini
organic ya
organic
asal ambil
padahal
jadi malam ini kita kembali
ke sesi bedah situs
bedah situs itu kaya ini ya
arkeolog gitu ya
asannya ya
kok arkeolog sih
iya kaya sering arkeologi
itu sih maksudnya ya
iya situs
perbakala
tapi situs-situs baru
milajofovis dong
beda lagi
eh salah, Tom Rider, Angelina Jolie
salah
oh beda ini nih
beda jaman nih
Tom Rider yang baru
apa Ridley
Ridley
gak tau
gak ngikutin lagi
jadi malam ini kita akan
membahas
beberapa website
yang dikirimkan
melalui bantuan
dari Dominicia ya, berhubung
kita tunggu di GitHub
yang submit gak terlalu banyak
jadi udah kita bahas semua
terus kita minta tolong
tim Dominicia untuk
mumpulin, eh ternyata banyak loh
ada berapa tuh
lumayan banyak, jadi kita pilih
12 ya
kita pilih yang
menarik-menarik
menariknya susah
berantem dulu
banyakan menarik
seru-seru ya, bagus-bagus
termasuk juga ada yang
vibe coding kelihatannya ya
jadi, dan
serunya lagi, ternyata malam ini
yang bikin ikutan
yang bikin ikutan
siapakah dia
siapakah dia, wah ini tamu
yang cukup sering ya, kita
undang ya, berapa kali ya
apakal parmas Zain
tamu tak diundang
eh diundang, diundang sama
diundang
kali ini diundang, yang dulu kan
yang berung aja kan, komen-komen tamu
iya betul
kali ini secara resmi diundang
oleh Dominicia lagi ya
yang homie, rayi ya
rayi
betul kan
ternyata ikut
nah, mas Zain
kesibukannya apa
akhir-akhir ini
ngulik apa, ngulik AI pasti ya
iya sudah
udah gak pernah meluas kode lagi
jadi bukan pejuang kode lagi dong
sekarang pejuang agent
ya kan
tagline saya kan
berjuang dengan kode
agak ada negan ya
enos kode gak ada saya
tapi yang mempunyai ada kode nya
tapi berjuang dengan
agent juga bisa masuk kan
berjuang dengan agent
terjadi agen ya
gimana setelah
antropik
melarang
penggunaan
ke open cloud
kira-kira mau pindah kemana nih
tapi kan dapat bansos kan ya
200 ya, dapat bansos gak sih
tapi gak cukup mas
berapa lama itu 200
sebulan
bansos 200 itu
ini udah habis 95
padahal berdua hari
baru dua
paling lama
seminggu bertahanin
ini 4 hari
kebetulan emang
dia habisin dia
dia habisin ini
maksimalin sampai
subscription saya berakhir
setelah itu
ya nanti subscribe yang lain
tapi bagaimana sih
antropik bisa tahu kalau kita
pakai
bukan, eh gak tahu kalau
ada dari kantor, cuman dari kantor
kan cuman teams kan
saya colokin ke open cloud
jadi cuman satu tiket
itu pun
langsung habis gitu, sedangkan kalau
mau lebih hemat kan emang harusnya pakai cloud code sendiri
200 bolar
2 hari itu
bukan 100 ya, 95 tadi 2 hari
100 ya
ada berapa agent di open cloud
agent dot com
berat terus ya
ada situsnya
ada situsnya
ARK ya
ARK ya
ARK ya
ada 12
16
ya pantes aja
4 hari 200 dollar
15
sebenernya bukan masalah banyak agentnya
lebih ke
dari 16 ini
sebenernya yang aktif cuman
yang aktif seharian mungkin cuman 4 atau 5
cuman kaya tinggal seberapa banyak
oke
dipake seluruh keluarga ya
kalau gak salah ya, istri anak-anak
juga ya
istri pakai dua privat
buat istri, terus anak
satu
tersendiri sisanya
berarti banyak juga ya
dipake privat sama mas Zain
lumayan kan
banyak mainan kan
banyak mainan
oh jadi kayak chat GPT
cloud.ai yang web base
itu udah gak dipake lagi sama
keluarganya mas Zain ya berarti ya
chat GPT gak, udah
walaupun ya setelah ini kan mau pindah
kembali lagi
tapi ya
fitur native nya hampir
jarang dipake sih karena
kalau tadi sih
dengerin podcast orang tentang open cloud
podcastnya Clearvo yang sama
Lenny gitu
itu bedanya adalah
open cloud itu udah kayak barang kita sendiri
udah kayak dikustom
mungkin ibarat
taminya itu udah diragasin sendiri
atau kalau PC itu PC dari kita sendiri
itu beda kan rasanya dengan
PC built in misalnya
betul-betul
oke
kita udah akan ngomongin
PC capung
kita gak akan ngomongin juga
sebenernya ini bisa jadi
topik sendiri ya
sebenernya kita mau ngomongin asil
dari open cloud
oh gak tau ini asil dari mana nih ya
ya open cloud sih
sebenernya asil dari open cloud
asil dari open cloud ya
keliatan banget
bahasa LLM
ternyata salah satu
peserta yang
men submit website nya adalah
atau situs nya adalah Mas Zain ya
nah ini adalah
ini hosting nya di dominasi ya beneran ya
eh domain nya ya
domain nya ya
ini domain nya di dominasi ya
ini kan static doang ya
gps buat apa gitu ya
kalau besok kan sayang banget
oke
kok mirip-mirip kaya itu ya
yang saya demoin waktu di Jogja ya
ya ini mah standar
UI nya
apa workspreso ya standar sih
begitu liat ini
kesan pertama ya
kesan pertama gak kelihatan
yang tenggelam gitu loh
kontrasnya ya
kontrasnya
kontras
dan kuningnya
kuningnya mentren kan
hitam dengan
kuning itu
gak bersahabat
hitam dengan kuning
jadi pembilihan color
bukan di
devtools
ya kalau di devtools ini ya
ternyata kontrasnya emang kurang
yang text nya itu
ceknya gimana ceknya coba
tolong diajarin saya
langsung inspect ya mas
inspect
itu yang
kiri
ya boleh itu deh
kiri mas kiri atas
kiri atas itu ada panahnya
kiri atas kiri-kiri
iya
nah itu kelihatan
hover
itu berapa dia bilang 12
kalau ini kuning gak apa-apa
abu-abu itu loh
gak bisa di gedein
gak bisa kalau popovernya
bisa ya
hopovernya gak bisa di gedein ya
kelihatan ya
kelihatannya kontrasnya
aman
yang ini oke karena itu dibandingin sama
hitam
bukan kan
nah itu dia
ini gak ada
hovernya
oh di atas dia ternyata nih
itu 3.0
ada tandanya
kontrasnya kurang
harusnya 4.5
minimal
harusnya minimal 4.5
oke
saya laporin ke opencloud
maksudnya dia bener-bener interest
sudah dia WCAG
kompatibel
udah punya itu belum workflow
buat ngasih tahu
biar dia otomatis auto
kayak apa namanya sekarang kan lagi
ngetren itu yang self
apa itu
kayak gini misalnya
ada error
nah terus biar engine-nya cukup pintar
buat bikin
engine skills atau apa
taro di memori biar besok kalau dia bikin
lagi
dia otomatis cek hal ini
tanpa disuruh udah punya sistem
buat kayak gitu gak
memori ya
memori yang persist
yang persistens
bukan cuma di sesi ini doang
bukan cuma di project ini doang
karena ini kan hal yang biar kita
gak usah mulang-ulang lagi kalau besok bikin lagi
sejauh ini sih saya masih manual
cuma
bukan maksudnya manualnya
jadi kalau ada hal penting itu
berarti jangan sampai lupa lagi ya
nanti dia ingat gimana
buat skill aja kan
bahkan bukan
ya bisa jadi itu
dari situ bisa jadi turunnya bisa ke skill
cuma kan skillnya kan juga
gak selalu di info kan
jadi kadang biar dia
tau kapan dia harus info skill itu ya
itu harus ada di kalau di open call
harus ada di tools atau di memory
atau di agents
atau update UI skill
maksudnya ini kan bakal ngaruhnya
cuma kalau besok bikin UI lagi
berarti pilih warnanya harus
pertimbangin contrast
itu berarti manual kita
suruh update aja
ya jadi selama ini selalu
saya bilang saya bisa screenshot juga sih
kalau mau screenshot ininya
mau-mau-mau
telegramnya
gak terlalu tadi mas
boleh ya
aman ya
langsung dibenerin tuh
langsung live session
iya langsung disuruh ya
selesai ngomong dia udah berubah
warnanya jadi putih
udah di deploy lagi
ini deploynya kemana mas
di tap
deploynya ke cloud cloud
sekarang yang ini
juga sih jarang-jarang juga sih
saya kenyob telepoksi
bisa
screenshot telegram
telegramnya
sudah ready mas Riza
mas Zain
udah
nah ini
mungkin biar agak gedean
wah
hati-hati nanti ke spill
oh itu
kurang kelihatan ga?
udah udah
cukup
teman-teman yang lain boleh di info
yang nonton
baru saya bilang ini
bahkan saya gak kasih tau elemen yang mana
saya copy aja
saya copy textnya
karena saya gak kasih tau juga
dia gampang juga carinya
dia tinggal nge-grab setengah aja
terus
dari sini dia cari oh ya
kurang-kurang
itu tadi nge-hover
elemen dia bisa langsung dapetin
3,7 contrast ratio nya
langsung
ini apa nih mas?
ini continuous deployment berarti bisa
otomatis di deployment dia setelah selesai
iya kan
karena saya sudah set up CI nya
jadi harusnya
commit push
and PR created
oh baru PR doang
baru PR
oh belum di approve ya
tapi bisa di preview sih
bisa di preview di
sini sebentar
oh ya udah oke harusnya
oke langsung
saya approve aja ya
langsung keliatan
kalau masalah
subject review
eh gak bisa
perlu sendiri nih
ini karena saya yang res PR
oke karena ini kan saya set up
saya set up
buat harus di approve gitu kan
tapi dia tuh
set up nya sekarang open cloud nya
gak selalu konsisten create PR sebagai dia
jadi yang commit ini civil jack
kalau dilihat PR nya
mungkin kalau mau liat PR nya bisa
di share di masrisya sekarang
berarti masing-masing agen dibikinin
akun github sendiri ya
so far karena yang coding cuman
willjack sih cuman willjack aja yang saya
kasih link ke
yang saya kasih akun github
akun
oh gak bisa share
tapi
saya salut dengan timnya
github ya
dengan dunia agen-agen
yang itu request ke github itu
menggila kali ya
karres api nya mereka lewat
github sialai
I can approve it myself
so please
oh iya ada syaratnya ya harus
di approve sama yang lain ya
iya gak boleh approve sendiri kan
gitu kan
ini update open cloud yang baru nih
bisa ada streaming bisa jadi
gak ketauan kalau dia typing
typing dan
iya
ini yang beresan
yang barusan
itu bisa dilihat
bisa di preview ya
betul
nah better
spek lagi
ini kalau dulu zaman muda
udah
udah selesai
apalagi ini
enak sekali
luar biasa
tapi gimana coba ceritain ini
situsnya untuk ini ya
untuk
kumpulan kafe2
komunitas yang vibe coding ya
iya jadi sebenernya komunitas ini tuh
kita sih gak diniatin buat
bikin komunitas sebenernya cuman
waktu itu niatnya ngombo-ngombo aja
terus kok makin lama
makin rame
lama-lama
ya obrolanya karena
masih dari zaman-zaman AI juga ya jadi kita obronya
bahas seperti pudding mulu gitu kan
bahkan dulu waktu kita awal
ngumpul itu masih belum
saya belum pakai
klatcode sih tempatnya saya belum tau ada klatcode
walaupun sudah launching sih waktu itu
mungkin gak nyampe
satu tahun lalu kan
iya april may tahun lalu lah ini kira-kira udah setahun lalu
iya april may tahun lalu waktu kita ngumpul awal itu
itu belum ada klatcode kan
itu kita masih
waktu kita
waktu kita WFC-an bareng-bareng itu kita masih
banyak ngobrolnya tapi gak coding gitu kan
tapi lama-lama makin ada klatcode makin nyobain macem-macem
ada bits segala macem gitu kan
jadinya beneran beneran masih bisa kerja
walaupun kita ngobrol gitu jadi ya yaudahlah gini
kita namain vibe coding from kafe2 karena kita
banyakan ngobrolnya sebenernya
dan data coding juga cuman yang coding bukan kita kan
WFC
jadi lebih-lebih apa ya
kalau dulu kan masalahnya
adalah kalau WFC kebanyakan ngobrol
jadi gak kerja
sekarang yang kerjain AI kita
ngobrol sambil nunggu
hasilnya
jadi make sense ya
iya jadi make sense
untuk dilakukan
untuk dilakukan
dari situ era nya karena makin besar
udah punya nama awalnya juga gak ada namanya
awalnya cuman group aja
terus ada namanya
waktu itu kita mencanangkan
kalau udah 100 orang anggota group
whatsapp nya kita bikin
ternyata beneran udah 100
yaudahlah aku bikin
ok
laika juga disitu ya
pamer dong
pernah ikut 2 kali
oh iya ya ada
persoalnya agak jauh biasanya
itu pada di untara banget kan
lumayan jauh cuman pernah ikut 2 kali
iya 1 kali
waktu itu kita yang keselatan
terus 1 kali ke utara juga ya
iya
wah jakarta sama bandung
coming soon
wah ini gimana nih prosedurnya
ngisi ya join ya
ya join dulu aja
buat kumpul-kumpul
siang-siang
kenapa?
orang jakarta keliatannya
gak se slow itu
kumpul-kumpul siang-siang
ada juga
mungkin tergantung demografinya juga
mungkin kan
biasanya kan yang di jakarta
yang pekerjanya harus
di jakarta karena kantor
di jakarta misalnya gitu kan
iya kan banyak yang gak fah juga
mas ivan kan juga gak ngantor juga
sebenernya
saya
iya saya gak
ngantornya di rumah ini kantor saya
eh, tekniknya kan kalau kita ada
versi di jakarta bisa dateng
mas ivan harusnya
oh susah dia, kalau di bekasi
baru dia bisa dateng
ada kendala
kalau
kalau culture di jakarta itu kalau misalnya
ada kegiatan nih
satu kegiatan itu udah habis seharian
udah gak bisa
karena waktu ya, karena commuting ya
waktu sama jarak, sibukan
keliatannya yogyakarta sama jakarta
iya misalnya nih
misalnya kumpul-kumpul
atau, ini hari kerja ya
bukan weekend ya, kalau hari kerja nih
misalnya
eh nanti kita jam 4 atau jam 5
ngumpul-ngumpul gitu kan
sama GDI gitu
atau WordPress Meetup
sama komunitas, itu saya dari rumah itu
udah jam 2 jam 3
jam 2 lah, atau jam setengah 3
udah jalan tuh dari rumah tuh
harus sampe tujuan
bisa jam 4, setengah 5
nanti, pak kan makan
ngobrol-ngobrol jam 7 jam 8
anggap lah jam 8 biasanya
sampe rumah udah setengah 11 mas
nah itu
jadi kalau di jakarta itu
kalau dinihatin ya
saya makanya kayak sama
sama kayak
saya pernah ngomong sama Mas Riza
dia bilang dia bisa coding dari HP
dari mall, dari mall saya bilang
dia udah coding dari mall, lewat HP katanya
karena bisa pake TMAX
kalau saya ngomong sama dia
kalau saya sudah jalan-jalan ke mall
itu saya udah gak akan pegang coding lagi
saya nikmati aja jalan-jalan di mall
karena untuk bolak balik itu udah habis waktu
mending saya nikmati sekarang jalan-jalan
sebelum ada open-closed saya nyetir
sambil buka laptop di sebelah
wah ini oh
lebih ini lagi
lebih ekstrim lagi
kan sebelum
ada open-closed kan harus
setiap mau trigger apa kan prong kan harus buka laptop
harus di enter
approve ya
jadi buka, misalnya lagi kerja nih
terus tau-tau, oh ini jadwalnya
anak les gitu kan yaudah akhirnya
kan masih kerjakan
terus ganti internet ke data link
terus taruh laptop di samping kan
anak-anak di belakang kan
yaudah entar sambil jalan
nanti di namung arah
oh udah selesai, entar lagi
itu sebelum
itu sebelum ada open-closed
kan tinggal yes no, yes no aja kan
itu sebelum open-closed
begitu ada open-closed ya udah gak harus buka laptop
tinggal buka HP aja
kalau gak salah Mas Zain yang bilang ya
"Mudik bawa Starlink
sama baterai AKI
masukin Mac mini, Mac mini-nya connect
Starlink sama jalan terus ya?"
enggak enggak, bukan
ini bukan pakai Starlink yang mobile
soalnya
saya bawa Starlink buat mudiknya, tapi nanti di
untuk mudiknya ya di atas lokasi ya
oh kira-kira di jalan
di atas mobil
pasang part itunya Starlink-nya
terus Mac mini-nya
sambungin ke AKI
ternyata bisa
ternyata bisa, gue bisa bayar paket yang
yang sejuta setengah apa kalau gak salah
bisa, ada paket
buatnya yang di pesawat, pesawat tuh pakai Starlink
rata-rata, kapal pesiar pakai Starlink
itu kan jalan
posisinya
kalau mau bisa upgrade paketnya, terus
taruh di atas mobil, bahkan bisa beliin
beli mount-nya gitu, jadi
limon yang ditaruh di mobil, terus jalan aja
tinggal terdiri-diri
itu baterai
bisa dicolok ke
Mac mini, jadi tinggal bawa
pakai tentengan gitu, Mac mini-nya
udah jalan, konek Wi-Fi
Starlink
kenapa harus bawa-bawa Mac mini
taruh aja di ruangan server
di rumah
waktu, nah misalnya
di rumah saya masih sering mati lampu
saya belum beli UPS, jadi
kalau mati lampu, dihariin sendiri ya
iya, nah saya juga baru tau
tapi ternyata Mac mini itu bisa
auto start-up juga ternyata
kalau mati lampu, bisa-bisa
ada setinggan auto start-up
after power failure
karena
dia bisa dijadikan ini juga kan
media server, kayak buat TV gitu
oke, kita lihat ini ya
saya mau
mau
performance
oh iya
karena saya ahlinya performance
ahlinya performance ini
di cek ya
mau
layar sendiri apa
layar sendiri
oke
salah
benar ya
tadi saya cek
ada masalah phone
dan CLS
jadi CLS
ya
buat temen-temen yang misalnya
mau, ini kan
gedein sedikit ya
eh, bisa gak sih gedein
bisa, jadi
bisa buka, oh kita tutup dulu ya
klik kanan, inspect
terus
ke performance
nah
kalau di tes begini aja mungkin cepat
tapi supaya
kalau kita
membutuhkan untuk supaya melihat
performance situs kita itu
bagus apa tidak, usahakan
di throttle, karena di luar sana
gak semua orang pakai Mac
gak semua orang pakai iPhone
jadi jangan pakai spek dewa
untuk
ngedeteksi
atau mengaudit performance
jadi kita harus throttle
CPU nya kita turunkan
saya suka pakai mid-tier mobile
dan network nya saya turunkan ke
fast 4G
disesuaikan lah ya, cuman
lumrahnya di Indonesia sudah 4G
umum lah ya
disesuaikan dengan target
user nya kali ya, target user nya
misalkan dia
koneksinya pakai handphone kah, atau pakai
laptop, gitu ya
yes betul, nah
dan field matrix nya ini dari Crocs ya
Chrome User Report
nah kelihatan tuh dari
dari Crocs
mengatakan lcp nya
fitus ini kurang baik
atau bisa diperbaiki lagi
CLS nya juga masih tinggi
kalau dari sisi
INP nya
so far so good, jadi kita
kalau kita mau lihat ya kenapa dia bisa tinggi
dan kenapa bisa jadi CLS
tinggal di record
untuk INP di klik aja sekali
gitu, dah
itu supaya, karena INP itu
membutuhkan input
oke, kita lihat
nah
kalau di sebelah
performance panel ini mirip dengan
lighthouse, jadi data nya
sebenarnya sekarang sudah mulai disinkronkan
jadi kalau kalian pakai
page speed
inside, page speed itu yang ini ya
page speed word def
kalau misalnya di
analyze
ini juga bisa, ini yang online
ini namanya lab test ya
lab test itu artinya
forensik
ya untuk melihat
ketika, sedangkan
kalau crocs yang ada disini nih
field origin itu artinya
data yang dikumpulkan oleh
google dari
penggunaan browser
chrome namanya chrome UX report
jadi kita rata-rata kalau menggunakan
khusus chrome ya
google chrome, bukan chromium
bukan opera, bukan
edge, bukan brave
jadi khusus google chrome
di laptop
mobile
semua akan mengirimkan datanya
secara anonimus
dan itu namanya chrome UX report
nah, dan dikumpulkan lah
data dari situs ini
secara percentel
percentel 75
artinya
majority dari
situ pengguna
masih mengalami
masalah lcp dan cls
nah
ini udah selesai belum
oh baru tau saya crocs bisa dilihat disini
ya
ini kelihatan nih
ini lab testnya
kelihatan
jadi yang saya bilang apa yang sama itu
adalah hasil analisis yang bagian sini
sekarang sudah disamakan dengan
apa yang kita lihat disini
cuma disini bisa lebih detail
kalian lihat, kenapa lcp nya bisa tinggi
kalau menurut kalian
kira-kira lcp nya yang mana ya
kita tinggal klik
dan kita bisa lihat, ini lcp
ini kelihatan nih
di bawah sini kelihatan ya
kelihatan gak sih
ini ada dcl
ada fcp
fcp first content load
dcl itu
dom content load
ini page load, dan ini lcp
nah ini
menarik nih, kenapa dia bilang
lcp nya setelah
selesai semua di download
bahkan setelah page load malah
sekitar mau lcp nya itu
di depan sebenarnya kan
jadi lcp nya apa sih
ternyata
lcp nya adalah
test
bukan image
lcp itu
ditentuin oleh
broser
broser
jadi setelah
jadi gak selalu
image atau pasti
title, ya gak bisa
kita harus lihat hasil analisa itu
betul
dan lcp itu selalu berubah-ubah
saat page load
misalnya ada text, ada image
jadi nanti lcp itu adalah
just content full paint
di secara kalkulasi
broser, elemen inilah yang paling
besar di viewport ini
ada algoritma khususnya
jadi di above
default bagian mana sih
yang paling dominan, jadi kalau user
lihat itu sekilas, ngerasa oh
ini udah ada content yang
signifikat, nah itu agak
upstart kan ya sebetulnya, tapi harus
ya makanya harus dicek dari dev tools
dari sekilas
pendangan mata saya, saya tau
ini pakai react
dan kenapa
elemen render delay nya tinggi banget
jadi time to first bite nya
disini, tetapi elemen render delay
kenapa elemen ini
lama banget di delay, ya karena
apa itu istilahnya, hydration
jadi dia harus
men download dulu
semua manifest
JSJS ini
sebelum dia
ada dua, kalau gak salah ada dua ya
ada dua render blocking
yaitu CSS
CSS sendiri dan
font
dan saya yakin
disini ada cafe car
cafe JS
ya ini kayaknya
nah kayaknya setelah
dia butuh
cafes ini
membutuhkan index ini
dan index ini membutuhkan
chunk, jadi ada
tiga channeling
sebelum dia bisa
men render
text
sehingga
lcp nya tinggi banget
jadi kalau salah satu dari sini telat
di download, ya udah pasti
ini akan lambat
itu analisa dari
INP
nah kita liat lagi
kenapa ada
CLS, CLS nya tinggi ya nih ya
tuh, CLS nya tinggi
layout shift
layout shift culprit
dia katanya ada layout shift
di
detik 128
disini ada screenshotnya
kita liat aja pelan-pelan
apa yang terjadi
tuh
oh itu kan
karena buka menu nya
iya karena saya buka menu nya
cuman dia disini yang terjadi
ini ini ini ini ini ini ini ini ini ini
dimension image ini
nah
hydration lagi
dan itu
sorry, hydration
dan font
font iya iya
kayaknya bukan image deh
ini lebih
kalau dari ini kan dia JS nya selesai di download nih
kita bisa liat
ini kan ini selesai di download yang si
bmw njs ini
selesai di download
maka semua hadir senjalan
tapi si text
gak ada sebenarnya
cuman si text ini belom dirender
secara react kali ya
react nya belom jalan lah
ceritanya, masih baru text nya doang
setelah semuanya
kena
JS nya jalan
ngerender element
baru JS nya di implement
terjadilah
shifting
jadi enak
intinya
gak perlu tools yang
mewah-mewah yang harus dibeli
di luar sana
dari chrome, brosannya chrome sendiri
sudah sangat cukup untuk
debug core web
vital
langkah lau agak canggih ini ya
tools nya
iya tools nya
seriusin
iya
iya
kalau
performance panel
memang sangat seriusin banget sama si google
untuk di improve terus
bahkan
kalau misalnya
situs nya yang
bisa dilihat nih kenapa nih
ini kalau dilihat ada task nya
yang merah-merah ini, artinya dia
apa namanya
butuh
cpu spike ya
ini kayaknya bukan
dari mas zain punya
ini dari chrome extension
saya, jadi bisa di ignore
kok bisa tau dari extension
ini tulisannya
chrome extension itu
saya ngomong tapi langsung cepet
melihat, karena sehari-hari saya
melihat ini
iya
misalnya
misalnya gini deh
kita lihatnya cuman task
tapi apa task ini
kita bisa tanya sebenernya ai
dan ai nya ini pakai
jamanan nano ya
what is
what is
this jsl
process
ini di screenshot aja
kasi ke open cloud
bisa gak deh, paham gak deh
kalau open cloud langsung sekalian jalanin chrome ya mas
oh iya bisa juga ya
bener juga
oh ini juga
yang punya saya
yang saya barusan tunjuk juga itu
ternyata chrome extension nya saya
yang jalan, gak tau yang mana satu
jadi sebenernya dari proses yang punya
mas zain, gak ada yang long
task jadi aman-aman aja
cuman terjadi ada
phosphate flow disini
phosphate flow karena
css
jadi css nya ada
yang render lagi
jadi ada last complex
jadi kayak css nya tuh
memaksa untuk
si browser
untuk menggeser
biasanya karena dimension
bisa di baca
lebih dalam untuk apa itu
force reflow
biasanya jadi
css sebelumnya sudah ngasih dimension
sekian tapi css selanjutnya memaksa untuk
bergerak jadi itu namanya
force reflow
mesti css js
juga bisa force reflow
ads paling banyak
menghancurkan
force reflow
jadi bisa dilihat
dan force reflow itu mengakibatkan
long task
itu yang banyak
membuat INP nya jelek
namun situs ini INP nya bagus
udah di reflow ya mas
coba di refresh
sudah di reflow
asik
kita coba
kalau
kalau mau misalnya
jangan dihilangkan ya
tidak perlu kalian
buka lagi
buat perbandingan
tinggal di klik
before dan after
ini ada kedua
biasanya kalau saya
ngomong sama
misalnya
tim saya bilang
ini ada masalah
mereka tinggal kirimkan saya bisa
di download trace nya
nanti saya ambil trace nya
saya masukin upload
saya bisa lihat apa yang dia lihat
jadi klien biasanya ini lambat
nanti saya tolong kirimkan
saya ajarkan download nanti saya
analisis kenapa lambat dari tempatnya
zip
sudah zip gede banget kalau gak salah
jason sih banyak
iya banyak
oke
better ya kita liat
lcp nya turun drastis nih
iya
mlebar sekali ini nya
tapi masih jauh sih
secara ini
iya
dia improve nya gimana
ada
PR nya
PR nya yang 2-1 ya
ya bentar
itu gak semuanya
yang di jelasin sama sifan
jadi yang dari penjelasan-penjelasan
yang pengen input sih
lihat apa sih
preload above default
image nya di preload
terus google font nya biar gak render blocking
keren ya
Google font nya
sudah gak
render blocking keren
ini memang harus kayaknya
karena css in js kan ini
jadi auto
auto compile
cuma ini
terlalu telat dia download nya
kenapa ya ini gak bisa digeser lagi ya
ada delay ya
karena dia butuh download ini
download ini
oh iya
karena ini di throttle ya
kalau memang mau lihat dia
dengan kecepatan normal
tanpa throttle-throttle
ini gak ada masalah nih situs
cepat ya
iya
cuma kalau kita throttle
kan kelihatan tuh
jadinya
oh iya
cuma
kembali lagi demografi kita kan
gak semua
internet nya
secepat kilat
gak semua pakai stanley-nya
lihat PR nya
dia jago loh kayak yang
yang minimal buat ngomongin input ya
ada di private chat
ada di link
yang cls kan
tadi tuh gue udah curiga tuh gara-gara
image juga nah terus dia
ngasih fixed dimension apa
ke image nya
dikasih hate
sama auto
cls fixed gue
image nya udah di optimize
cls nya sudah
belum sih
ya itu asumsi dia
di lokal dia
oh
image optimization yey
render blocking yey betul
ya inget dulu
siap-siap
digantiin
sama opus
dia masih ngelira
lcp nya itu adalah si hero
logo
oh iya
ternyata bukan
makanya butuh insert lebih lanjut emang dari inspeksi manual
ini lah yang membedakan fact powder
yang cuman bisa nunjukin
eh error
jelek gitu
ya tapi
theoretically bisa di automasi
juga kan yang kayak tadi
ivan nyontohin download aja
hasil ini nya zip nya
kasiin ke willjet
kasiin guiden
iya cuman untuk tau download dimana
juga kan iya makanya
dari kita semua inti apa cuman
ngomongin tau
jadi ini adalah multiplier
kan si ai nya itu
memultiplai skill
atau knowledge kita
tapi multiply nya
terang gila ratusan kali
sebenernya
secara umum kan ini yang kita lakukan juga secara
manual kan kalau kita improve
biasanya kita sendiri yang melakukan
oh kita nemu masalah nya apa kita
kayak image optimization itu kan dulu saya
masih sering tuh ada misalnya ada lima puli image ya
saya satu-satu jalanin script image optimization
ke situ
dulu zaman
warga-warga juga mba eka kan
mba eka sempet bantu upload ke cloudinary
terus di hardcode
cloudinary
cloudinary terus main-main
apa query param nya biar
image
loading nya
aduh sekarang semua
automatic
terakhir disini ada nih
kalau misalnya kalian
masa nya tanpa perlu di record dan reload
disini juga bisa nih
kalau mau langsung liat nih
ada interaction nya bisa kelihatan nih
klik klik klik klik klik
bisa liat INP nya tuh
INP nya
terus
bisa liat layout save nya dimana
apa yang terjadi dimana
yang terjadi INP
disini langsung di home page nya
live matrix bahasanya
ee.. ya demikian
bentar, penasaran ya
ada satu small thing
coba apa
pengen ngetes agen nya
buka yang halaman chapters yogyak deh
buka halaman yang chapters
yogyak
nah itu kan ada yang kepotong tuh
nah coba tersendiri aja
tapi harusnya ga usah bilang
dibenerinnya gimana
coba dia bisa
ya ya
sebenernya itu cuma pake CSS doang
tinggal ditambahin satu property
aja work break break work
nah si CSS
apa si agen nya ngefixnya
ribet
kalau bisa sih pasti bisa
ya lebih busa
cuma kadang kalau
AI system itu
ya kan CSS nya ga terlalu
ya ga secanggih skill react
dan lain-lain bisa ngefix
tapi kayak pake property banyak banget
padahal sebetulnya itu cuma pake satu property
bisa langsung ngefix
belum update ya dengan web
API ya
apa box yang paling kanan
growing nya tuh kan kepotong
kayak dia bikin nge-stretch
layarnya nge-stretch, nge-leber kan
coba seru bener ya
kenapa ada horizontal
horizontal ini ya
horizontal scroll ya
karena nge-stretch
gara-gara si growing itu
ini harus dikasih dimensi
ga ada dimensinya ya
iya ga ada dimensi
tinggal ngasih
gede soalnya, kalau buka di desktop gede
itu kalau buka di desktop gede banget
gede banget
harus kasih minimum height aja
kalau minimum height kan dia langsung
ngambil space jadi ga perlu
dorong-dorong
itu kalau di desktop kurasa banget itu textnya loncat
oke, gede banget
ya, kita masih ada satu
web lagi yang mau kita bahas
makasih
ya untuk
websnya dari Mazain
makasih udah submit
terima kasih teman-teman
rame-ramein ya
kalau mau di sini silahkan
kalau mau undur diri juga boleh
sebelum mudah-mudahan
event apa
ada event terdekat ga
kayaknya mau ada meet up
open cloud ya di Jogja ya
iya satu ini open cloud
sebenernya tapi kan kamis ini ada
kamis ini ada lagi offline
di Jogja, terus satu ada
di Jogja juga open cloud
terus minggu depan
di Jakarta
tapi sayangnya ga bisa dateng
minggu depan an?
minggu depannya?
minggu depan di Jogja
kalau yang di Jakarta 18 April
18
ga bisa juga kan
mau berangkat
ya sudah
kita ketemu
lain kesempatan Mazain
di Jakarta
makasih banyak
makasih
terima kasih
lain kali nanti diundang-undang lagi
sekarang
kita
mau mengundang
Mas Baliyun
untuk naik
sorry ya kelamaan ya
nungguin ga?
nunggu 20 menit
kayaknya Mas Baliyun
sorry
maaf
rencananya satu
website
nantinya 30 menit
biasa kita
suka ngelur ngidul
mungkin ini ya
kita udah pernah ketemu
belum sih?
kenalan dulu kali ya
perkenalkan nama saya
Baliyun Taja
saat ini sedang bekerja
dan kuliah
kuliah oke
kuliah di?
di Binus
Binus
diurusan?
tembil sistem informasi
bulan kuliahnya online
online
domisili dimana?
domisili site ini di Jakarta
oh Jakarta
tapi ambilnya online ya oke
Binus ada
di Jakarta juga
karena lagi
sambil kerja kan
sambil kerja
oke kerjanya sebagai?
asas
di Telkom
oh
semester berapa sekarang?
ini baru namanya KKN Mas
kuliah kerja nyata
kuliah dan kerja
iya real
sekarang semester 8
semester 8
oh bentar lagi ya
kalau belajar kodinya
udah mulai dari SMK sih
oh iya
di Telkom
di Telkom ada universitas juga
nggak usah dibawah
ini namanya networking
kalau di internet gitu
boleh cerita tentang
website-nya
eh mana ini
namanya photomade.id
oh tadi bukan gitu
bacanya Mas Riza
kalau ada orangnya langsung bener bacanya
tadi emang gilanya
otomate
otomate kudasai
jadi ini adalah
side job
side job oke
base-nya di Malang
i see
wah udah kuliah kerja
ada side job juga ya
luar biasa
itu namanya
hustle
hustle culture
lanjut lanjut lanjut
yang mau saya
tanyakan tuh sebenernya ini sih
cara naikin SEO
di webnya tuh gimana gitu sih
oke
SEO
sama ini
sekankan website ini tuh
cuma react doang gitu ya Mas
nah ternyata
buat
natur content
management sistemnya tuh susah gitu
jadi kayaknya emang harus ada
dashboard-nya sendiri gitu ya
content
management-nya oh sekarang ini
berarti langsung
decode ya kontennya
hardcode gitu ya
iya betul
ini didiploid ke mana
gede banget
apanya maksudnya hosting-nya gitu
hosting-annya
iya hosting-annya
dominisial lah Mas
dominisial
oh dominisial
yang paket hosting ya berarti ya
iya
oke
ini berarti
jatuhnya itu
landing page ya
jadi informasi aja ya
isinya ya
gaada aplikasinya ya
cuma lihat ada jadwal
ada calendar-nya
ada calendar-nya ini calendar-nya juga
hanya react
aja ya berarti ya gaada database
gaada jadi sementara itu
sebenernya di hardcode gitu
jadi tiap mau nambah
jadwal event
gitu ya harusnya
langsung ya langsung code ya
oke
jadi tadi pertanyaannya berkaitan
dengan SEO sama
ini react apakah perlu
menggunakan
framework ya seperti Next.js
atau yang lain gitu ya
apakah perlu dimigrasi ke Next
oke
ada yang mau memberikan
komentar
mungkin saya perlu tahu
mungkin-mungkin
pengen tahu kenapa
pilihan pertamanya Next.js
kita bukan
Next.js di sini
pengen tahu dulu
sebelum saya mematahkan
inika atau engga
menyangga terima
perlu tahu dari masnya
pilihan utamanya Next.js kenapa
sebenernya
kalau bilang gitu malah sebenernya
saya pemilihannya malah sama Laravel sih mas
oke
malah jadi lebih pengen tahu
lagi kenapa pertama kali
memikirkan Next.js
iya
anyway
ada masalah utama
yang harus saya katakan di sini
karena
saya pencinta
performance dan
setiap kali situs itu
yang selalu saya lihat itu adalah
bagaimana situs itu
bisa memberikan informasi yang bagus
dengan cepat dan efisien
dan
menggunakan
resource
dari CPU, bandwidth
dan waktu dari si penggunanya
sedikit mungkin
kalau dari situsnya sendiri
banyak hal yang bisa
diperbaiki
contohnya kalau misalnya saya lihat
di sini
saya sampaikan ini dulu supaya nanti pemilihan
framework selanjutnya ya
jadi akan mengerucut nanti
apa yang cocok buat
frameworknya
jadi karena kalau misalnya
saya katakan oh ternyata kamu harus pakai
Next.js tapi hal utama
atau soulnya
atau goalnya
engga tercapai sama aja
saya bilang harus pakai
Astro
atau pakai Laravel
atau pakai WordPress dan ternyata cara buildnya
sama ya hasilnya akan sama
engga ngaruh
jadi sebenernya mau pakai framework apa aja
sebenernya
ada hal-hal
yang harus diperhatikan
contohnya
1x page load
misalnya saya coba gini aja ya
salah
1x page load
kita bisa lihat di bawah sini
keliatan ga ya?
1x page load aja
situs ini
memakan bandwidth
dari si user
itu sebesar 57mb
1x load
artinya kalau
banyak foto kali ya, banyak aset ya
banyak hal
nanti kita lihat satu-satu kenapanya
jadi artinya
artinya
kalau misalnya si user itu punya bandwidth terbatas
contohnya pakai
apa ya?
pakai data
yang harian
satu giga, dua giga
dia buka 10x
udah habis setengah giga
ya kan?
atau ya cash lah
tapi intinya bisa habis 57mb
1x buka
60mb ya kurang lebih ya
dan yang paling besar
tentunya kayaknya ini di
image brand tadi
kelihatan 800
ya
dan kalau misalnya kita lihat size-nya
yang paling besar itu
bisa 2 giga
2 mega
2 setengah ya
ada 4 mega sendiri
4,8
brand 5, brand 6
yang kayak gini, framework apapun
nggak akan solve
tetap akan begitu
jadi itu yang harus diperbaiki
jadi pemilihan image
ini gede banget ya image ya
oh gede banget ya
ini dimana?
image yang dimana ya?
oh yang dibawah
galeri-galeri
ya galerinya
kan kecil
nggak di resize
dengan hanya kamu mengecilkan ini semua
menjadi dibawah status
kilobyte
website kamu sudah jauh
banget lebih cepet
sudah jauh
lebih cepet
sebentar
kalau counter-argument
kalau misalkan nih pakai Next
atau pakai Astro
kan dia ada komponen image yang bikin
otomatis, itu bakal ngaruh kan?
nggak juga?
ngaruh dong
ngaruh
tapi tetap aja
musen mengaruh apapun
kalau misalnya originalnya sudah kecil
saat dia dipakai
Next dan
lebih optimize lagi kan
apalagi kalau
deploy-nya misalnya ke versel
yang sudah langsung ada cdn-nya
dan itu dipakaiin webp
otomatis conversion
ke webp, maka jauh lebih cepet
dan pertanyaan selanjutnya, apakah
untuk png?
nggak juga kan?
jpeg?
dengan mengubah ini ke jpeg
kalau ke webp
susah juga kan
mengubah webp di lokal
jadi jpeg
aja sebenarnya cukup, nanti
kalau ada cdn-nya yang bisa
mengubah ke webp, pakai cloudflare
misalnya di depannya ada cloudflare
sudah otomatis bisa di-convert
ke webp
biasanya
pas di-in pakai source set
image
element image source set
kalau perlu
picture element
buat kondisional
misalnya kalau
layar kecil, gambar mana
yang di-loading
layar besar, cuma biar lebih efektif
itu sebenarnya ada di
image responsive, kalau misalnya
next.js itu bisa ya
sudah ada image component kan ya
image component ya
next.js ada, astro ada
astro juga ada
Laravel
Laravel juga ada ya
ya itu yang dari
si frontend yang buat
ini, templating-templating ini
inertia, bukan inertia
setau gw sih gak ada ya
kalau yang image ya
yang otomatis bikin
source set, terus dia
dia bikin
oke, fine, kalau
gue gak tau banyak Laravel, tapi
WordPress pasti ada
otomatis lagi kalau WordPress
cegal install plugin atau gimana?
enggak, enggak, WordPress by the core
tinggal upload image-nya, tinggal taruh
webp get image
webp get image, langsung sudah
sudah pakai source set
jadi sebenarnya
kembali lagi, pembilihannya
mau pakai frame apa aja, bisa
kalau misalnya
kalau ini react
react murni ya maksudnya?
iya betul, react sama
react image responsive
pake CT atau
pake yang lain
CT ya
kayaknya banyak deh react
image responsive component
dipakein
kayak gini
atau
kalau pakai AI mah disuruh aja
pakai react mentahan juga buat lah
jadi seperti ini
atau posting image-nya
di CDN, kayak Cloudinary
misalnya, mereka tuh punya free tier
sama bisa
otomatis generate ya itu
macam-macam ukuran
sebentar, ini nge-noding sendiri
atau pakai AI, dibantu AI?
dibantu AI
oh dibantu AI
tinggal minta AI-nya
suruh dia jadiin
tapi kalau mau install
saya sih nggak nyaranin pakai popular
library, karena sebenarnya hal yang ini tuh
udah begini aja
nggak perlu pakai library gitu
bisa sebenarnya gitu
tinggal bikin satu component image
yang image dump
component lah bahasanya ya
component tinggal dipakein banyak-banyak
kemana-mana, semua image tag
diganti jadi image component
apa lagi ya
kalau dari sisi performance itu yang paling
kritik
yang signifikan ya
ya kritikal
kalau itu sudah diperbaiki semua, barulah
bisa kita
pikirkan
selanjutnya, karena lcp-nya
masih perlu diperbaiki
terus kemudian cls-nya
masih juga
perlu diperbaiki, karena ini gerak-gerak
ininya si logo-nya
dan ini nggak bisa di...
iya
ini logo-nya kuat
ini gede ini
oh iya
image-nya lumayan 2.000 kali
2.000 pixel
padahal tampilannya kecil gini ya
iya
di tampilannya 80 pixel
jadi harus dioptimasi lagi
terus kayaknya ada iframe juga nih ya
yang di instagram ini ya
iya
terus lazy load, lazy load
lazy load semua nih
loading lazy yang di bagian bawah
ini juga
dia berputar-putar, ini tuh pakai
wp ya, sudah wp kok ini
kenapa dia...
ya yang itu sebelumnya kan
png kan, terus
gede banget
terus aja bawa wp
harusnya berarti semua
ya wp bawa aja ya
tapi tetap aja gede, 600 kilobyte
sebisa mungkin setiap image itu
cuma
perlu di load di bawah 100 kilobyte
150 itu udah
mentok, 673
600 ya
iya
kadang-kadang
kalau kita bikin animasi kayak gini
tapi gak tau ya, ini tergantung
use case juga
kadang-kadang video bisa lebih kecil daripada
kita bikin animasi kayak gini
jadi bikin, di jadikan
ini di jadikan video aja animasinya
mungkin lebih kecil ukurannya
mungkin ya, webm
namanya webm
iya, kecil lagi
iya
kalau bisa sih
apa, image-image yang untuk
untuk foto
itu pake jpg
atau wp
kalau yang buat logo
atau asset icon dan lain-lain
baru png lebih cocok
jadi ukurannya juga menyesuaikan
oke, kembali ke pertanyaannya
apakah perlu pake next.js
kalau saya
pake apa aja bisa
asal tau
pakainya
dan apa yang
tujuannya
jadi, kembali ke
yang saya sampaikan tadi, tujuan utamanya
adalah bagaimana kita bisa memberikan
informasi ke si user
secepat mungkin
dan seefisien mungkin
dan user itu untuk mendapatkan
informasi tersebut
cepat dan hemat
jadi harus serba
diet
cepat dan hemat
jangan load
jangan berikan
sesuatu yang mereka gak perlu di awal
ada sebuah perumpamaan
kalau di sebuah restoran, kamu datang ke restoran ini
dan kamu datang
duduk dikasih menu
terus
kamu nya
mau pesan, tapi
gak ada yang
bantuin kamu
dan kamu nanya kenapa gak ada bantuin kan
tapi mereka itu sedang mempersiapkan
semua makanan nya dulu
jadi, waktu kamu minta
baru dikasih
jadi, sudah siap
itu kan jadinya gak efisien
karena mereka harus memasak semua makanan nya
nunggu, baru kamu bisa
ini
dapatkan
yang bener kan adalah
kamu minta dulu, dibuatkan
dan dikirimkan
jadi, pikirkanlah
dengan konsep seperti itu
usahakan web yang kamu buat itu
memberikan informasi
se-
se-efisien mungkin
nah, dari si CSS nya
juga banyak sekali
ini CSS nya
dan setiap satu CSS
ini CSS semua
iya, ini CSS semua ini
dan satu CSS itu
render blocking
artinya
browser tidak akan melakukan
apapun
sebelum loadnya selesai
sebelum CSS itu
didownload dan diparsing
dan di eksekusi
jadi dia render blocking
nah
kelihatan nih
kalau miskin saya gak, karena ini
kayak saya pakai disable cache ya
tapi, makanya kelihatan nih, jadi
kayak
double-double downloadnya nih
karena
secara request
per komponen kamu request ulang
oh, ini dari
iframe ya, dari iframe ya
instagram kali ya
oh, ini kayaknya soalnya
randomize
CSS class
berarti harusnya di lazy load
si bagian instagram nya
instagram nya di lazy load
hmm
ini iframe embed ya
iframe itu bisa loading lazy ko
iya
kayaknya ya
ini iframe
nih
bisa ko iframe
loading lazy
tuh
tuh
dan teknologi sudah
sudah baseline ko
sudah baseline, tinggal kamu tambahin loading lazy
dia sama dengan lazy
jadi sebelum dia
didownload
oh, saya kasih tau sebuah ini lagi
kita coba ya
saya berandai-andai
kita bisa lakukan begini nih
network application
salah, source
kita coba
satu magic
menemukan
gak bodoh-bodoh banget, kayaknya
override fact
to create directory
the workspace override
kok gak bisa sih
head folder manually
gak bisa, kan belum didownload
oh, dia taro disitu gitu
iya
bisa
override content
kok gak mau dia
override
yeah, over
enable
oke
salah, bukan
bukan ini
untung diingetin sama Siza
oke
allow, terus kemudian
saya override
override content
nah
terus kita masuk
cari
iframe
dia pakai Rie, gak bisa
belum didownload ya
div nya kosong
div nya kosong
ini pentingnya server render
eh, sebentar
ini gak server render ya
ada server render gak
kalau vt, tapi gak bisa dihosting dong
kalau server render
harus
bisa, kan si dominasi nya bisa
bisa kali
ada
atau kalau mau static
ya dibuild aja
emang ini kan sebenarnya landing page
seberapa sering sih dibuild ulang
cari aja yang ssg
buat dibuild
iya, ssg juga bisa
oh, udah astro aja
udah complete tuh
kayak gini
cepet nih, minta ampun
kalau mau build ulang
pakai astro aja
iya, jadi kalau pertanyaannya
next ya
sebenarnya lebih ke
tujuannya apa tadi ya
jadi kita simpulkan sedikit ya
kenapa harus menggunakan next
kalau tujuannya untuk menambah performance
itu bukan alasan
yang tepat, kenapa? karena
dengan kita menggunakan framework
itu justru menambah berat
bukan menambah ringan
karena dependensinya makin banyak
ya walaupun kayak image tadi
bener, mungkin itu bisa dioptimize
sama next.js atau astro
atau yang lain gitu
jadi
kalau pertanyaannya
misalkan tadi
oh, saya mau server render, harus pakai
misalkan manual pakai vt, agak ribet
nah, baru kalau mau pakai next boleh
pakai astro, kita lebih sarankan
juga boleh, atau pakai yang lain
misalkan pakai
paravel, pakai inertia
juga bisa, jadi
dipilih aja
tapi itu alasannya
sudah seperti itu, bukan alasan untuk
menambah performance, kalau
menambah framework, malah mengurangi
performance justru
nah bentar, kalau saya mau liat
silahkan, silahkan
silahkan
nah, ini kan
kalau dari sisi bisnis, kan
sebenarnya ini bisa macem-macem
tujuan ya, karena
pastinya juga kan, apa
masih lagi belajar juga, masa kuliah
mungkin pengen explore, ya wajar lah
itu wajar kan kita pengen explore
tapi daripada cuma bikin
to do atau hello world
atau apa, ya kita pengen build
sesuatu, pakai teknologi yang kita
penasaran buat explore untuk
real use case, ya kalau menurutku
itu valid-valid aja sih, jadi kalau
emang tujuannya explore, pengen tahu
next.js, ya boleh, bukan nggak boleh
tapi kalau dari sisi bisnis nih
pure bisnis, ya
itu kan udah jalan ya, itu the works
maksudnya
si calon customer
udah bisa liat juga, bisa liat
info-nya, ya udah
tetap react aja, tapi dioptimize
misalnya pakai itu tuh
apa?
VTSSG
maksudnya SSG itu
build time, ya udah
static
jadi degenerate secara static, yang
degenerate adalah HTML, CSS
JavaScript-nya udah langsung degenerate
semua, jadi nggak
apa nggak di render secara dynamic
udah itu bisa ditaruh di hosting
apa aja dengan mudah, nggak perlu
nggak perlu fungsionalitas
server-side, itu kalau dari
sisi bisnis
cuma kalau perkara itu tadi
masih banyak sarankan, mau pakai Astrolux
atau mau pakai apa, ya kalau itu sih
bebas ya, mau explore apapun
tapi tadi keliatannya di awal
ada bilang
perlu CMS, nah
kalau tujuannya biar pakai CMS
next.js, bukan, belum jadi
solusi, karena next.js kan nggak
ada CMS kan juga
tetap aja kalau mau CMS
yang jadi satu, itu kan
WordPress, terus sekarang
Cloudflare juga baru bikin namanya
Dash, kalau pengen yang jadi
satu sama CMS itu, tapi
kalau pengen pakai CMS
terpisah, kan banyak tuh headless CMS
ya itu sih bebas, pakai
apa, pakai framework apapun
nah, cuma lagi-lagi, itu kan
agak sedikit overkill juga ya
maksudnya untuk, ini kan keliatannya
cukup simple, landing page-nya
seberapa sering dan seberapa banyak
maksudnya, perlu CMS
yang full feature, tetung complex
terus, seberapa perlu sih, itu kalau
dari mindset business yang
beneran, apa, sisi
business-nya kan, itu perlu
dipertimbangin juga
kalau itu udah jalan, itu
kayak gitu aja, cuma dioptimize
pakai saran yang dari
Ivan tadi, sama
oh, tadi SEO ya
SEO ini tadi aku liat, ada
satu kesalahan yang fatal sih, kalau
pakai react-nya sih nggak apa-apa ya, kalau
SEO, maksudnya sekarang juga udah bisa
apa, search engine
udah bisa nge-crawl dengan baik
tapi coba deh, siapa
yang searscreen, buka
heymeta.com
open graph image-nya
ilang, nggak ada, dan
itu lumayan fatal sih, karena
kalau kita ngirim
misalnya kita promote link website-nya nih
nah, ketik
fotomate.com, eh
fotomate.id ya
kita kirim di whatsapp dan lain-lain
open graph image-nya nggak ada, itu kan
nggak muncul ya
eh?
nggak usah pakai protokol
fotomate.id aja
oh
ttp-nya nggak usah
tapi sebenarnya ada loh dia punya
ini, cuma nggak kebaca aja kali ya
nggak keload kayaknya ya
eh, sorry, ininya
metanya ada sebenarnya
ada, ada, ada, tapi image-nya
404
oh
iya, jadi nggak muncul
nah itu ada image-nya, jadi bukan belum diisi
tapi udah diisi, cuma 404
image-nya nggak ada
nggak bisa diakses image-nya
lupa upload atau gimana
gitu ya
oke
tambahan dari saya, kalau untuk
CMS
mungkin CMS juga
menambah dependensi ya
jadi lebih berat, karena kita harus
baca query database dan
lain-lain
kalau misalkan nanti seandainya memilih
untuk pakai Astro, kayaknya udah cukup ya
buat konten ya, Astro kita
bisa pakai markdown biar lebih gampang
ngedit, apa namanya, ngedit
kontennya, jadi nggak perlu
pakai HTML atau React gitu
kita pakai data atau pakai
JSON, kayaknya udah lebih dari
cukup ya untuk landing page
iya, pakai JSON udah lebih kars ya
ya React mode-nya kayak gini juga pakai JSON juga bisa kan
makanya diwork, pengen explore
betul
berarti Astro itu sudah
bisa, ya
Next juga bisa sih pakai JSON dan
pakai markdown juga harusnya bisa
iya, kayaknya untuk CMS
belum perlu, menurut saya ya
menurut saya pribadi kayaknya belum perlu
cukup menggunakan kayak markdown atau JSON
data, kemudian
di-load ke website-nya
karena ini kan landing page ya jatuhnya
terus kalau
untuk SEO juga kayaknya
untuk server render
lumayan butuh
terutama performance juga
jadi mungkin pilihannya ya tadi ya
bisa jadi SSG
static site generator
bisa pakai Astro juga yang ada SSG-nya
kayaknya Next juga ada ya
ada fitur itu ya, tapi ya antara dua itu lah ya
kurang lebih sama
untuk SEO
untuk SEO
benerin performance dulu
karena performance itu sangat
penting bagi SEO
selama ininya masih belum
jadi apa yang terjadi adalah
kamu menghabiskan namanya crawler
budget
jadi crawler,
masih pengkatanya crawler itu sudah bisa
render JavaScript, tapi belum tentu
bisa segini besar
render JavaScript bisa jadi banyak ya
karena dia bakal time out
juga nih ngedownload
50M, 60M
dan JS-nya
berapa gede ya, coba kita lihat JS doang nih
JS doang dia 17M
ya kan
jadi dia
akan
mengeluh gitu si
crawler
crawler bot-nya
untuk lebih
tau lebih dalem kamu coba pakai
search console
google search console ya
google search console nanti disana
bisa
disini ada nggak ya
bisa simulasi
ya dia bisa simulasi
bisa simulasi
itu sudah saya masukin ke situ sih mas
ya, bisa kamu
simulasiin
kayak gini
ngobrolin, ngobrol.in-nya
ini bisa disimulasi
contohnya ngobrolin web nih
yang library animasi
copy
masukin kesini
apa yang dilihat oleh si
apa yang
Googlebot
tes live url nih
nanti dia bisa kita lihat si
Googlebot itu
melihat apa dari situs kita
aku bisa cek
oh, bisa ya
bisa
bisa
1 menit, 2 menit ya
itulah gunanya
ngobrolin web mas
dan sekarang
Googlebot itu sebenarnya sudah pinter
dan yang dia butuhkan
kan cuma text kan, jadi selama
semua image di lazy load
terus nggak ada
client-side render-nya nggak
terlalu ekstrim yang
sampai stack, itu tuh
aman kok, maksudnya
text-text yang penting
buat crawling
itu hampir pasti
masuk
nah, kita lihat ya, kan ini hasil
live test-nya nih
dari si Google
ini HTML yang dia baca
terus ini screenshot yang dia lihat
coba aja buka screenshot-nya
dari situs yang kamu buat
bisa nggak dia render?
kenapa?
biasanya ada di more info
itu ada javascript
masalah-masalahnya bisa kelihatan
biasanya, tapi nggak semua-semua
nggak semua dia record
ini website ngobrolin web juga kita
pakai AI kok
cuma kita udah tahu
yang butuh di perbaiki bagian mananya
kita bisa kasih tahu
"tolong dong ini image-nya
kecilin" atau apa gitu ya
kadinya umu semua, sekarang umunya udah
berkurang ya, gara-gara pakai AI
nggak mau pakai umu
jadi, kedepannya
nanti kita lihat, setelah
dari ini
diperbaiki, bisa
lebih
efisien
iya, buat ini ya
untuk perbaikannya
targetnya begini nih
oh iya, tadi Mas Zain aja nggak sampe 100 ya
Mas Zain punya 65
react nih, makanya nggak bisa
kalau kita pakai astro ya
server render
nggak bisa, SSG
memang bisa-bisa aja
react kalau SSG bisa
ini kita bukan server render kali
kita SSG nih
nggak pakai server ya
iya
iya, gitu
mungkin ada yang mau ditanyakan lagi
perlu nggak pakai
udah terjawab semua ya
iya, sejauh ini
udah
udah dicatak semua sih mas
nggak mencoba sedang-sedang
targetkan
targetkan 100 semua
nanti kita undang lagi
ijo-ijo ya
nanti kalau udah ijo, nanti kita
nanti kita interview lagi
apa yang sudah diperbaiki
ini berapa lama bikinnya
sampe jadi
kayak sekarang
di-plan image-nya ya
sekitar 15 hari mungkin
15 hari ya
wah, mantep ya
cepet ya
itu full in 5 coding
atau kayak copy paste dari
CGPT atau apa
dari editor-nya udah
atau complete yang kayak
pakai agent gitu
editor-nya sih pakai
kursor, cuma
cuma kalau
react-nya ya, karena emang
agak paham sedikit, jadi ya
kalau yang nggak paham baru di-kursor
yang gitu sih, ditengani ke AI
kan biasanya
kalau dari AI gitu atau dari
agent kan kita tanya mau bikin gini-gini-gini
pasti yang disarankan pakai Next.js ya
You're absolutely right
oh kerahin dari agent
pakai VT atau itu
dari sendiri ya
apa, instruksi sendiri ya
tolong pakai react sama VT gitu ya
ya, itu dari saya sendiri sih
karena ya maksudnya sebelumnya
karena udah familiar ya
oke, ya
bagus sih, maksudnya nggak langsung
ke Next.js itu angka
yang bagus juga
Next.js pakai apa tuh namanya yang baru itu
pengganti webpack
turbo pack ya
nggak tau apa
noncingnya udah ya, udah bisa dipake ya
oke, nggak ada
nggak bisa dipake buat ini semua
iya, nggak di-open
nggak di-open
ada lagi mungkin terakhir
yang mau ditanyakan atau ada yang mau
disampaikan
eee
ini cukup sih mah dari saya
terima kasih mas
sama-sama yang membantu
dan
semoga dengan KKNnya
kuliah kerja dan
menjadikan nyata semua
kuliah kerja nyambi side hustle
nah, itu betul tuh
kuliah kerja nyambi
nah
kuliah kerja nyambi
wah, mantap lah
kayaknya bahan skripsinya udah banyak ya
kalau udah kerja gitu ya
udah selesai meeting dia
selesai meeting ya
selesai meeting
selesai meeting
kita mau
mau pamit, mau udahan
jadi terima kasih banyak buat Mas Zain
buat Baliyun, dan buat teman-teman yang
yang udah submit, dan udah nonton juga
ini ada, ada pertanyaan-pertanyaan
tuh, mau dijawab dulu mah
kita jawab dulu
jawab, nanggung
prospek
kerja tech yang akan ada untuk masa depan
pecut AI
udah ada yang bikin pecutnya
udah ada yang bikin pecutnya
oh iya
pecut AI
eee, itu siapa namanya
eee
bikin service-service sih sebenernya
prospek kerja tech yang akan ada
bikin service-service
epeding specialist
infra
network engineer
iot, hardware
kita bukung cina yang ya
gak bisa cina yang sih kalau teknologi sih
agak susah ya
atau kan juga akan di-redefine juga
maksudnya dev-ox yang seperti apa dulu
di-redefine seperti apa dulu
yang jelas kan role-role
mas Jiri
oish
role engineer juga berubah kan
developer kan berubah ya
role-nya
iya dulu banget
programmer nulis
kode assembly atau kode apalah
yang low-level, dulu kan
belum kepikiran programmer ada yang nulis
JS atau CSS
dan lain-lain
nah maksudnya besok kita nulis
apaan nih, maksudnya kita
melakukan pemrograman dengan cara apa
itu sih yang gak tau kan
VT+
ada yang tau gak VT+
itu yang baru kan ya
keluarannya VT+
iya
itu apa
versi berbayarnya
webnya
jadi jadi bisa kaya apa ya
kaya monorepo ya
terus kaya build process
semua workflownya
itu kaya
kaya pernah saya bilang
di group, kita mau bahas
VT+ yang baru kan
ini kita jadi satu episode
sendiri itu iya
bukan ada VT yang baru
itu kaya jadi satu
satu episode
sendiri itu nanti kita kulik sendiri
ya, nanti kita submit ya
terima kasih ya
ini nya, apa namanya
ide nya
gampang dan cepat
team astro
tecut AI
lama-lama mas Zain
pindah haluan nih ke astro juga nih
nungguin
itu ya, nungguin remix gak selesai-selesai ya
iya
tapi
sekalian selesai
kalau ternyata bisa
dengan mudah diadopsi oleh LLM
misalnya kalau seandainya produk-produk
baru ini sejalan dengan
preferensi LLM yaudah
saya sih yang mana aja yang LLM suka gitu aja lah
kalau penerawangan pun
yang keliatannya yang
pendatang baru, relatif baru
tapi LLM friendly
10 stack universe nih
kenapa?
dokumentasinya bagus
terus mereka tuh
provide agent skills
skill nya tinggal install
gampang install skill nya
gak tau, gampang aja dipakainnya
sama saya yang penasaran
yang saya penasaran
yang masih with list itu
UI.si itu
bawa nyetil win
itu gak tau entar mereka bakal bikin apa
baru lagi, itu masih with list ini
kita gak tau apa itu disini
kita itu
domain harganya berapa ya?
yang pesan mereka
mecat, pesan mereka
efisiensi berapa persen
itu udah income nya
oh buat beli domain
buat beli domain
buat beli domain
iya
acara apa?
ini acara ngobrolin web
tapi kita lagi buka situs
yang kita buka itu situsnya Mazayn
sama Ambaliun yang disubmit
lewat Domensia ya
ada lagi pertanyaan
yang belum kita tanya
eh jawab, ada venue gak
di Bekasi ini? pertanyaan yang tadi
ini saat yang waktu
itu kayak vibe cafe
vibe from cafe
banyak sih
cafe, tinggal tanyain aja
satu-satu yang mana bisa
yang mana bisa dipakai buat
meetup
iya cuma
iya cuma maksudnya
ada komunitasnya atau gak mungkin
bukan 4 huruf
ini 2 huruf
2 huruf, UI.SH
aja udah mahal
apalagi 2 huruf
lebih mahal lagi ini
berapa juta sendiri
yang paling mahal
AI provider
ada situsnya kan
Mazayn sama Ivan bikin itu
situs yang isinya
iya cuma
susah tractionnya
eh susah ngisi datanya makin
cepet banget perubah, cepet banget abis
update nya
capek nge update nya
karena
bansos-bansos
begitu bilang bansos sekarang
besok-besok
waktu hitungan jam udah habis
terus
itungan berapa bulan udah
gak kabar lah
gak bansos lagi
bansosnya hilang
ini ada pertanyaan
pada pake AI apa aja, kalau Mazayn kan tadi
ke cloud code ya
iya, tapi akan bergeser
ke codec sih mungkin
codec sih ya
kalau sekarang full opus sih
ya makanya harus beli yang mahal
pakai kursor sih
kursor ya
kursor itu bisa milih model ya
bisa
kayak yang auto gitu
yang auto ya
itu
kalau boleh tau
ada fasilitas dari kantor
atau dari kampus, atau bayar sendiri
atau masih yang gratisan
oh bayar sendiri
oke
entar-entar
model sekarang ya jadi developer ya
kalau
karena entry level untuk
ini kan harus pakai kartu kredit apa
pakai jenius dan segala macem
atau sekitarnya bisa gak sih yang debit card
virtual itu
bisa ya
oke, berarti sebenernya jadi kalau teman-teman
yang di kuliah
gak punya kartu kredit, bisa berarti ya
gak usah harus
punya kartu kredit, oke
kalau anak kuliah
yang mau nyoba coding masih telat gak?
gak, gak ada telat
iya, orang yang
udah bekerja berapa tahun juga belajar coding
juga belum telat, masih bisa kok
apalagi dengan adanya AI, makin
makin mudah
Lila Jovovich aja
udah kurang
berapa lagi tuh
gak tau ya, dia baru ngerilis
ini ya, Mempalace ya
gak tau, tapi
Mila Jovovich tau
Resident Evil kan
dia baru ngerilis
github repo
Mempalace namanya
itu Mila juga sih
kayaknya, tapi
gak tau juga
gak percaya
itu ketahunya
Udai P itu percaya karena dia videonya
ini kayak repo doang
iya, repo doang
siapa aja bisa bikin atas nama dia
iya, saya bisa
kalau mau bisa bikin repo atas nama Prabowo mungkin
tapi
mungkin
tapi bisa
kalau kalian lihat gininya
liat si Milanya
dia ada, dia
di instagramnya si Mila ada
ada video tersebut
iya
iya, di instagramnya si Mila
ada video yang sama
tapi gak tau itu asli apa tidak
oh iya bener ya
di instagram
enggak
enggak
dan itu
followernya
lima juta
dan jantan biru
ya maksudnya kalau mau bikin fake
niat bener
iya sih
enggak sih ya, lebih
tuh, Mbak Mila itu
kurang umur berapa lagi
Mbak Mila
saya umur 2.37
lagi belajar coding
tuh, bisa
Mbak Mila aja bisa
iya, Mbak Mila aja bisa
berapa lama Mbak Mila Jovovich?
Mbak Mila
50 tahun tuh
50 tahun
50 tahun, jangan kalah sama Mbak Mila
dia jurusan apa, jangan-jangan dia jurusan
komputer sains lho
bentar, ini Mbak Mila Jovovich yang artis
atau bukan, jangan-jangan namanya
artis
yang benar
yang pemain Resident Evil
oh ada Mas Danang
kabur-kabur
udahan berarti, saatnya udahan
udah diusir kita nih
next bahas apa tuh
next bahas
spider yang ada request per month
ada kredit, ada quota
bingung mau milih yang mana
oh, bisa-bisa
isi dong, isi dong dimana
di kesanain
kesanain, kesanain
udah gaada kesanainnya
github.com/ngobrolin
ga diperpanjang sama Mas Irfan
kesini, kesini, kesini
kesini aja ya, kesini nih
kesini
github.com/orgs/ngobrolin
session discussions
atau ke ngobrol.in aja
ngobrol.in
eh Mas Zain itu ga jadi
apply ke z.ai
buat ini
minta subdirektori N
jadi
z.ai + N gitu
keren tuh
udah cocok banget
jadi ambasadurnya
kenapa, kan pasti ada pertanyaan
motivasi, kenapa kamu cocok
sebagai ambasadur z.ai
namanya aja lah Mas Zain
iya, namanya saya udah Zain
yang cocok apa lagi
kebalik ya
ini bagus sih
ini dari opus pindah ke
GLM aja ya
GLM, GLM
iya, 51
51 nya ok lah, bagus kok
11-12 sama Kimi
Kimi 2,5
tapi Mas Riza
alirannya Quen, kalo Mas Riza
alirannya Quen, kalo saya alirannya
Eka
Eka GLM
aku punya lagi promo aja
ok, cukup kali ya
kita bahas model-model
model-model, nanti lain waktu lagi
terima kasih
buat semuanya, terima kasih buat Mas Zain
buat Baliyun, sukses terus
buat ini ya
karir dan pendidikannya
situsnya juga
semoga lebih keren pada depannya ya
kita pamit, selamat malam
selamat istirahat, bye bye
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
dengan Domainizia, dapatkan pengalaman
menggunakan layanan hosting yang lebih baik
dengan SSD berperforma
tinggi dalam infrastruktur cloud yang
telah dioptimalkan untuk kebutuhan personal
maupun bisnis
teknologi ini memungkinkan Anda memperoleh
layanan yang lebih stabil serta proteksi
dari korupsi data
hosting Domainizia juga telah mendukung Node.js
Python, Ruby, Go, PHP
Java, serta binary Linux
lebih dari
200.000 pelanggan telah mempercayakan
layanan hosting di Domainizia
kepercayaan yang kami jaga dengan
garansi uptime 99,9%
serta garansi uang kembali 100%
buat website Anda lebih mendingin ya
segera berali web hosting Domainizia
Deskripsi asli dari YouTube
🗣️🕸️ Selasa malam waktunya #NgobrolinWEB! Malam ini kita akan kembali membedah beberapa situs yang sudah disubmit. Ada juga hasil vibe coding 😎 Penasaran gimana pendapat para pakar kita Ivan dan Eka? Jangan sampai ketinggalan untuk menyaksikan sesi bedah situs nanti malam. Bedah situs kali ini hasil kolaborasi bareng Domainesia! 🎉 📦 Langganan Cloud VPS Turbo? Gunakan kode: NGOBROLINVPSDN → 50% OFF, bisa digunakan berkali-kali! Jadwal kembali ke jam 20:00WIB ya. Kunjungi https://ngobrol.in untuk catatan, tautan dan informasi topik lainnya.
Episode Terkait
1 Nov 2023
Ngoding di browser
Episode ini kedatangan seorang developer advocate dari AWS, dan pertanyaan pembukanya membumi: masih menjalankan lingkun...
1 Apr 2025
Ngobrolin Lebaran
Episode ini adalah ucapan Selamat Idul Fitri dari tim Ngobrolin WEB. Eka, Ivan, dan Rizah memberikan salam Lebaran denga...
18 Jul 2023
Ngobrolin Public Speaking
Topik malam itu keluar dari kebiasaan: bukan teknologi, melainkan berbicara di depan umum. Ketiganya berbagi cerita awal...
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 .