Tukang Sate Mengipas Bara

Buat satu file HTML mandiri yang merender animasi pixel art seorang tukang sate mengipas bara di malam hari, memakai JavaScript murni dan Canvas 2D. Tanpa aset eksternal, library, atau request jaringan. RENDERING - Gambar semuanya ke canvas offscreen beresolusi logis tetap 160x90, lalu blit ke canvas layar penuh dengan faktor skala bilangan bulat terbesar yang muat, di tengah, imageSmoothingEnabled = false dan CSS image-rendering: pixelated. - Semua gambar dikunci ke koordinat bulat. Tanpa sub-pixel, anti-aliasing, gradient, atau shadowBlur. Transisi warna dan cahaya memakai dithering Bayer 4x4. - Palet tetap sekitar 36 warna hex: biru dan ungu tua untuk langit malam, kayu cokelat untuk gerobak, sarung kotak merah, dan enam warna api dari putih, kuning, oranye, merah sampai merah gelap. Setiap piksel berasal dari palet ini. KARAKTER - Tukang sate dibangun prosedural dari rect dan deret piksel, sekitar 24x32 piksel logis: ikat kepala putih, handuk di leher, kaos biru dua tone, sarung kotak merah, sandal, dan kipas bambu anyaman di tangan kanan. Outline gelap 1 px dihitung otomatis dari siluet. - Pose diparameterkan (ayunan lengan kipas, condong badan, mata menyipit, bob napas). Parameter dianimasikan halus lalu dikuantisasi ke grid dan ke sekitar 12 fps supaya terasa seperti animasi sprite, walau loop berjalan 60fps. ANIMASI - State machine dua siklus 5,5 detik: DIAM (bob 2 frame, kipas pelan, asap tipis) -> MENGIPAS (kipas makin cepat dan lebar, badan condong, bara berubah dari merah ke kuning, bara terangkat berpusar) -> SEMBUR (lidah api setinggi gerobak, cincin panas melebar, percikan meledak, guncangan layar 1 px, tukang sate mundur menutupi wajah dengan kipas) -> REDA (api turun, sate dibalik, pose kembali). Easing antar keyframe. - Sistem partikel pool tanpa alokasi: bara dan asap dialokasikan di awal dan dipakai ulang. Tiap bara melangkah di indeks palet dari putih ke kuning, oranye, merah lalu gelap sebelum hilang; asap membesar dan memudar lewat dither. Posisi partikel dikunci ke grid saat digambar. - Update timestep tetap 60hz dengan render rAF. ADEGAN - Langit malam berdither dengan bintang 1 px yang berkelip, bulan purnama berkawah, siluet atap kampung dengan jendela menyala, dan lantai batu dua baris. - Gerobak kayu dengan atap kain belang merah putih, etalase kaca berisi lontong daun, papan merah bertuliskan SATE AYAM, dan lampu petromaks yang dikelilingi ngengat. - Panggangan seng berisi arang dengan enam tusuk sate yang warnanya bergeser dari mentah ke matang sepanjang video. - Seekor kucing oranye duduk menunggu di kanan, ekornya bergoyang, dan ia terlonjak saat api menyembur. - Rim light 1 px dari api di sisi kanan siluet tukang sate dan kucing, makin terang saat MENGIPAS dan SEMBUR, plus pantulan cahaya hangat berdither di lantai. KUALITAS - Piksel tajam, siluet terbaca jelas, terasa seperti animasi sprite 16-bit yang rapi, bukan bentuk vektor yang diperkecil.