Dwitter - Kumpulan Demo JavaScript 140 Karakter

 (beta.dwitter.net)
8 poin oleh GN⁺ 2026-01-11 | 2 komentar | Bagikan ke WhatsApp
  • Dwitter adalah platform untuk membuat dan membagikan demo visual dengan kode JavaScript dalam 140 karakter atau kurang
  • Setiap posting disebut 'dweet' dan menampilkan animasi grafis yang langsung dijalankan bersama kodenya
  • Pengguna berinteraksi melalui komentar, remix, dan hashtag, sehingga modifikasi dan kreasi ulang kode berlangsung aktif
  • Konten populer dapat dijelajahi dengan berbagai urutan seperti hot, new, top (mingguan/bulanan/tahunan/semua waktu)
  • Sebuah wadah eksperimen pemrograman kreatif untuk mewujudkan efek visual kompleks dengan kode singkat

Ikhtisar Dwitter.net

  • Dwitter.net adalah platform web untuk membuat demo visual dengan kode JavaScript yang dibatasi hingga 140 karakter
    • Setiap demo disebut 'dweet' dan menghasilkan grafik animasi yang langsung berjalan di browser
    • Setelah login, pengguna dapat menulis dweet baru atau me-remix karya yang sudah ada
  • Situs ini memungkinkan pengguna menjelajahi konten populer dengan berbagai urutan seperti hot, new, top (mingguan/bulanan/tahunan/semua waktu)
  • Setiap dweet dilengkapi fitur bagikan, layar penuh, laporkan, dan komentar

Contoh dweet unggulan

  • "Bubble universe colour expansion" dinilai menonjol berkat warna yang kaya dan efek visual yang jelas
    • Di komentar muncul tanggapan seperti "A whole universe!"
  • "Ants! 🐜" adalah karya yang menampilkan gerombolan semut dengan kode singkat, dan mendapat pujian seperti "god level dweetage!"
  • "Trees, shadows, hills." adalah animasi yang menggambarkan pepohonan, bayangan, dan perbukitan, serta mendapat respons "Amazing stuff!"
  • "Flight Over Destroyed City ✈️" mewujudkan adegan penerbangan di atas kota yang hancur
    • Komentarnya dipenuhi respons humor seperti "i love the smell of sulfur and uranium in the morning"
  • "Solar Orbit ☀️🌘" menghadirkan orbit planet dalam 140 byte, memunculkan kekaguman seperti "How did you fit a whole planetary system in 140 BYTES OF JAVASCRIPT!?!?"

Aktivitas komunitas dan budaya remix

  • Setiap dweet dapat di-remix berdasarkan kode pengguna lain, dan tautan ke karya asli dicantumkan
  • Kolom komentar memadukan umpan balik teknis, apresiasi, dan humor, membentuk suasana komunitas yang hidup
  • Melalui fitur hashtag, pengguna bisa menelusuri tema seperti #space, #galaxy, #lighting, #scene

Karakteristik teknis

  • Sebagian besar kode dipadatkan dalam bentuk eval(unescape(escape...)), untuk menghadirkan efek visual semaksimal mungkin dalam batas 140 karakter
  • Di dalam kode, penggunaan Canvas API berfokus pada penggambaran bentuk, warna, dan gerakan
  • Setiap dweet menampilkan panjang kode (misalnya "// 136/140"), sehingga teknik optimasi dan kompresi menjadi elemen penting

Wadah eksperimen pemrograman kreatif

  • Dwitter menggabungkan code golf dan seni visual, mendorong persaingan kreativitas antar pengembang
  • Proses menghasilkan hasil visual kompleks dari kode sederhana dinilai sebagai bentuk estetika pemrograman
  • Platform ini berfungsi sebagai ruang eksperimen untuk menjelajahi batas antara ekspresi artistik dan kompresi teknis

Bacaan terkait

2 komentar

 
roxie 2026-02-27

Sungguh menakjubkan
 
GN⁺ 2026-01-11
Komentar Hacker News
  • Senang melihat ini muncul di HN :D
    Maaf sempat harus me-reboot server sebentar. Berkat pelajaran dari kejadian serupa sebelumnya, ukuran DigitalOcean droplet sudah saya sesuaikan
  • Keren sih, tapi kalau dibatasi berdasarkan jumlah karakter, akan muncul metagame untuk mengompresi karakter ASCII dengan memakai karakter Unicode multibyte
    Misalnya dalam bentuk seperti eval(unescape(escape\<<97 wide characters>>`.replace(/u../g,'')))`, yang memulihkan 194 karakter ASCII dari 97 karakter Unicode
    Saya malah berharap ada semacam kesepakatan seperti percakapan Ford Prefect dan Mr Prosser: “anggap saja 194 karakter ini dimasukkan ke dalam 140 karakter lalu tampilkan saja”
    Logikanya mirip dengan batas 4096 byte di demoparty, yang pada praktiknya diisi dengan mengompresi 12~20KB memakai Crinkler
    • Frontend beta beta.dwitter.net/top punya toggle “compressed”, jadi bisa dilihat dengan cara yang diinginkan
    • Cara lain adalah membatasi berdasarkan byte UTF-8 saja (misalnya 140 byte)
    • 140 byte setara dengan sekitar 160 karakter ASCII. Jika karakter kontrol dikecualikan, bisa sampai 170 karakter
    • Sepertinya ini komentar dengan balasan terbanyak yang pernah saya lihat di HN :-)
    • Senang ada yang menangkap referensi HHG (Hitchhiker’s Guide)
  • Dwitter akan merayakan ulang tahun ke-10 musim dingin ini
    Saya mencari wawancara lama dan ternyata menarik: wawancara Medium
    Sihir yang sesungguhnya ada pada komunitasnya: komunitas Discord
  • Saya merangkum koleksi sketsa generatif yang dibuat dalam 140 karakter di Dwitter
  • Dulu saya pernah ikut kompetisi kecil di edisi Authotokey Dwitter dan menang dengan animasi roda gigi
    GIF animasi
    Untuk detailnya, lihat postingan forum Autohotkey
  • Situs seperti Dwitter membuat kepercayaan saya pada kreativitas manusia terasa baru lagi
    Saat ada batasan, keragaman justru meledak. Ilusi visual, kalimat pendek, eksperimen ke arah yang tak terduga, dan sebagainya
    Batasan mendorong fokus dan menurunkan biaya kegagalan sehingga eksperimen jadi lebih mudah
    Kebanyakan platform mencoba memperluas kreativitas dengan menambahkan fitur, tetapi justru membuatnya lebih rumit
    Saya sering teringat aturan bahwa batasan menciptakan kesenangan
    Saya penasaran kapan batasan menghasilkan hasil yang lebih baik, dan kapan batasan terasa seperti sesuatu yang dibuat-buat
  • Dulu pada masa awal Twitter saya sempat sangat tenggelam dalam code golf 140-byte
    Pengalaman itu benar-benar mengubah cara saya berpikir tentang kode
    Di komunitas kecil kami berbagi teknik penghematan byte sambil membuat berbagai hal, dari renderer Mandelbrot sampai solver Sudoku
    Sepuluh tahun kemudian, saya sangat terkejut ketika menemukan implementasi UUID yang dulu saya buat di codebase perusahaan saya
    Tautan terkait: video YouTube, Byte-saving techniques, UUID gist
  • Fakta yang baru saya ketahui hari ini: 
    js_func`string`
    Ternyata ini sintaks JS yang valid. js_func dipanggil sebagai tagged template literal
    Sekarang saya jadi ingin mencoba hal seperti console.log\weeee``
    • Beberapa library mendukung sintaks mirip JSX tanpa proses build lewat sintaks ini
      Contoh: htm, lit.dev
    • Saya juga baru-baru ini memakai fitur ini di generator gambar dalam kode
      Saya menyimpan data SVG kecil dalam kode inline dan membuat sampler berukuran 13KB
      contoh tautan
    • Sekarang saya akhirnya paham kenapa sintaks ini dipakai untuk template SQL dan GraphQL
      Contohnya: 
      sql`SELECT * FROM users WHERE id = ${userId}`
gql`query GetUser { user(id: ${userId}) { name email } }`
  • Saya suka Dwitter, tapi saya berharap penggunaan eval diblokir
    Sebagai gantinya, sebaiknya ditambahkan lebih banyak shorthand. Misalnya s berarti Math.sign, tetapi sebenarnya masih bisa diperluas
    • Platform seperti ini harus ada dulu agar orang bisa menemukan cara untuk “melanggar” aturannya
      Jika diubah belakangan, target yang tetap akan hilang dan daya tariknya berkurang
      beta.dwitter.net mempertahankan target tetap sambil meningkatkan aksesibilitas encoding
      Pengecualian seperti Math.sin atau encoder warna CSS ditambahkan karena alasan praktis
      Di Dwitter 2 bahkan sempat ada pembahasan untuk memasukkan lebih banyak karakter pradefinisi agar pengguna bisa memperluasnya sendiri
      Pada akhirnya yang penting adalah kreativitas. Bahkan memelintir aturan pun merupakan tindakan kreatif
    • Jika cara menghitung skor diubah menjadi berdasarkan byte UTF-8, masalah eval bisa diselesaikan dari akarnya
      Kompresi data lewat string literal masih mungkin, tetapi kompresi keseluruhan kode akan berkurang
    • Saya sudah lama memakai dwitter.net, dan saya puas eval diperbolehkan. Aturan adalah aturan (atau memang tidak ada aturan)
  • Sebagai contoh terkait,