Marko – Bahasa Deklaratif Berbasis HTML

• Bahasa deklaratif yang memperluas sintaks HTML untuk membangun antarmuka web yang dinamis dan reaktif, memberikan lingkungan pengembangan yang familier bagi pengguna HTML yang sudah ada
• Melalui streaming rendering, konten dapat dikirim langsung dari server dan tetap bisa ditampilkan bahkan sebelum bundle JavaScript klien dimuat
• Dengan fine-grained bundling, pengiriman kode yang tidak perlu diminimalkan sehingga performa dan kecepatan pemuatan meningkat
• Melalui targeted compilation, dihasilkan output yang efisien dan dioptimalkan untuk browser dan server masing-masing
• Dukungan integrasi TypeScript dan fitur editor yang kaya meningkatkan produktivitas pengembangan dan kualitas kode

---

Ikhtisar Marko

• Marko adalah bahasa deklaratif yang membayangkan ulang HTML, dengan tujuan membangun antarmuka pengguna yang dinamis dan reaktif
  • Sebagian besar HTML yang valid dapat digunakan apa adanya di Marko
  • Sintaks HTML diperluas agar aplikasi modern dapat ditulis secara deklaratif
• Digunakan dalam operasional layanan nyata di situs dengan trafik berskala besar seperti eBay.com
• Jika Anda mengenal HTML, CSS, dan JavaScript, Anda dapat langsung menggunakannya tanpa kurva belajar tambahan

Fitur Utama

• Fitur Streaming Rendering memungkinkan server mengirim konten yang sudah siap secara langsung
  • Tampilan awal dapat muncul bahkan sebelum bundle JavaScript sisi klien dimuat
  • HTML, gambar, dan aset dimuat secara asinkron untuk menghadirkan render layar awal yang cepat
• Fine-Grained Bundling hanya mengirim kode yang benar-benar diperlukan
  • Menghapus kode yang tidak digunakan dan melewati hidrasi yang tidak perlu hingga tingkat subtemplate
  • Dirancang dengan filosofi “Lean by default, Fast by design”
• Mendukung Targeted Compilation
  • Menghasilkan output teroptimasi yang sesuai untuk tiap lingkungan dengan mempertimbangkan perbedaan antara browser dan server
  • Pemuatan lebih cepat, bundle lebih kecil, diwujudkan dalam satu bahasa terpadu

Contoh Kode dan Sintaks

• Menyediakan sintaks ringkas yang menggabungkan HTML dan JavaScript

  <let/count=0>  
  <button onClick() { count++ }>  
    Clicked ${count} times  
  </button>  
  

• Kode yang sama juga dapat ditulis dengan sintaks yang lebih ringkas

  let/count=0  
  button onClick() { count++ }  
    -- Clicked ${count} times  
  

• Menyediakan kumpulan tag yang diperluas seperti <for>, <if>, <await>, <const>, <define>
  • Tag bawaan HTML dapat dipakai bersama tag khusus Marko

Performa dan Skalabilitas

• Mendukung initial render yang lebih cepat (Faster First Paint) untuk meningkatkan pengalaman pengguna
• Skalabel: dapat berkembang secara fleksibel mulai dari template HTML sederhana hingga struktur komponen yang kompleks
• Dengan runtime yang kecil dan compiler yang dioptimalkan, performa tinggi tetap terjaga di berbagai kondisi jaringan

Integrasi TypeScript dan Alat Pengembangan

• Dukungan bawaan TypeScript memberikan inferensi tipe yang kuat
  • Menjaga konsistensi tipe antara template dan komponen
  • Editor mendukung fitur seperti pelengkapan otomatis, lompat ke definisi, penyorotan sintaks, dan formatting
• Menyediakan lingkungan pengembangan yang stabil melalui deteksi kesalahan lebih awal dan peningkatan kualitas kode

Kesimpulan

• Marko adalah bahasa pengembangan web modern yang menggabungkan sintaks ramah HTML, rendering berperforma tinggi, bundling yang presisi, dan integrasi TypeScript
• Bekerja secara efisien baik di server maupun klien, serta menawarkan skalabilitas dan performa yang cocok untuk operasional layanan berskala besar