Ini pertama kalinya aku bikin dan publish website buat diri aku sendiri :<.
Aku bukan frontend dev, lebih ke orang AI/ML (mungkin). Jadi wajar kalau aku pikir ini nggak bakal sesulit itu. Paling cuma HTML, sedikit CSS, deploy, beres.
Ternyata salah.
AI nggak bisa nolongin kalau kamu nggak baca log sendiri
Masalah pertama yang sering muncul itu performa. Warning LCP, error layout shift, scrollbar yang aneh-aneh. Skor Lighthouse aku waktu itu hancur banget, bahkan buat jalanin di mobile aja masih nge-lag.
Aku terus-terusan lempar prompt ke AI berharap ada yang nyangkut. Kadang berhasil. Tapi seringnya? Kebanyakan masalah baru masuk akal setelah aku baca sendiri log-nya. AI nggak lihat apa yang kamu lihat. Dia bisa kasih saran, tapi nggak bisa bilang kenapa halaman kamu lambat kalau kamu nggak cerita dulu apa yang terjadi.
Jadi aku belajar baca log. Nggak enak, tapi perlu.
Animasi tema yang nggak pernah beres
Di satu titik aku mikir: keren nggak ya kalau pas ganti dark/light mode ada animasi bubble yang expand ke seluruh halaman?
Ya. Keren sih. Tapi juga rusak total di mobile.
Framer Motion, efek CSS berat, overlay full-page. HP nge-lag, transisinya patah-patah, dan hasilnya malah lebih jelek dari nggak ada animasi sama sekali. Aku buang waktu terlalu lama nyoba fix-nya sebelum akhirnya ganti ke fade CSS biasa.
Tapi waktu aku nggak balik.
Testing mobile: sebuah perjalanan
Aku kira harus deploy dulu baru bisa test di HP. Ternyata bisa pakai IP jaringan lokal. Eh tapi nggak nyambung.
Teori-teori yang aku terima:
- Windows Firewall (dari forum random)
- "Laptopnya nggak mau ngobrol sama HP-nya" (dari teman, sangat membantu)
- "Mungkin IP-nya salah" (dari AI, juga sangat membantu)
Ya... nggak membantu.
Yang beneran berhasil: bind dev server ke 0.0.0.0 dan connect lewat IPv4 laptop. Nggak paling aman, tapi ini di kamar tidur, kemungkinan kena hack kecil banget (kan?).
Samsung Browser kejam buat para web developer
Di Chrome oke. Di Edge oke. Lalu aku buka Samsung Browser.
Background grid ilang. Style-nya di-override sama entah apa yang Blink-based engine-nya mau lakuin hari itu. Dark mode-nya bentrok sama tema aku dan bikin setengah halaman jadi invisible.
Setelah banyak googling, ternyata ini memang... hal yang sering terjadi di Samsung Browser. Ada sesuatu soal cara dia handle color-scheme dan default stylesheet yang beda. Matt Sibson nulis breakdown yang bagus banget soal ini kalau mau baca penjelasan lengkapnya.
Aku tambah color-scheme: light ke CSS. Nggak ngaruh sama sekali. Grid-nya tetap ilang. Di satu titik aku udah pasrah dan lanjut.
Samsung Browser, dengan segala kerendahan dan rasa hormat saya: tolong perbaiki browser kalian. (Aku user Samsung btw.)
Pokoknya. Website-nya sudah live, jalan di Chrome dan Edge, dan aku cukup puas sama hasilnya. Kalau kamu baca ini di Samsung Browser dan ada yang rusak, maaf, aku sudah berusaha.