Qwik starter CLI adalah starter sederhana bagi Anda untuk mencoba bereksperimen dengan Qwik secara langsung dan mendapatkan pemahaman yang lebih baik tentang betapa berbedanya Qwik.

CLI terdiri dari empat contoh berikut, yang akan diperluas dalam waktu dekat:

  1. starter: Halo dunia dasar.
  2. starter-builder: Hello world dasar yang terintegrasi dengan API Qwik Builder.
  3. starter-partytown: Hello world dasar yang menunjukkan betapa mahalnya tugas dapat dijalankan di pekerja web dengan Partytown
  4. todo: Aplikasi TodoMVC klasik.

Qwik adalah kerangka kerja JavaScript unik karena merupakan satu-satunya kerangka kerja yang ada saat ini yang dapat mengalami hidrasi yang tidak teratur pada tingkat komponen.

Dengan evolusi JavaScript dan kerangka kerja JavaScript, situs web modern kini memerlukan Jumlah JavaScript yang sangat besar agar menjadi interaktif. Dan, semakin berkembangnya situs kami, semakin besar peningkatan kompleksitas situs yang pada akhirnya memerlukan lebih banyak kode yang berdampak negatif pada kinerja permulaan situs. Memiliki terlalu banyak JavaScript memiliki dua dampak besar pada situs yaitu,

  1. Bandwidth jaringan: Jika situs kami memiliki kode JS dalam jumlah besar, akan membutuhkan waktu lama di jaringan yang lebih lambat untuk diunduh ke perangkat klien.
  2. Waktu mulai: Waktu mulai situs terpengaruh karena seluruh kode JS harus dijalankan sebagai bagian dari hidrasi setiap kali laman dimuat.

Seperti disebutkan di atas, dengan menghilangkan kemacetan waktu pemuatan, Qwik mengklaim dapat mencapai dua tujuan penting.

  1. Pemuatan instan: Tidak seperti kerangka kerja lainnya, quick bersifat “dapat dilanjutkan”, sebuah paradigma baru yang diciptakan oleh tim Qwik untuk memberikan 0 hidrasi. Hal ini memungkinkan aplikasi Qwik memiliki interaktivitas pemuatan instan, terlepas dari ukuran atau kompleksitas aplikasi. Ini berarti aplikasi akan dimuat secara instan tanpa jeda di jaringan mana pun.
  2. Kinerja: Qwik mencapai hal ini dengan menghadirkan HTML murni, dan memuat JS secara bertahap sesuai kebutuhan. Artinya, situs ini memiliki lebih sedikit JavaScript untuk dieksekusi saat dimuat dan mengunduh kode hanya saat interaksi. Hal ini menjadikannya kerangka kerja “HTML” pertama.

Bagaimana Qwik mencapai hal ini?

Qwik pada dasarnya mencapai hal ini melalui dua strategi penting:

  1. Tunda eksekusi dan pengunduhan JavaScript selama mungkin
  2. Buat serial status eksekusi aplikasi dan frame di server dan lanjutkan di klien.

Mari kita pahami bagaimana Qwik menerapkan strategi ini.

Lebih sedikit JavaScript

Seperti yang kita lihat di atas, salah satu masalah terbesar bagi sebuah situs adalah besarnya JavaScript yang harus dikirimkan ke klien. Qwiklangsung menghilangkan hal ini dengan hanya mengirimkan JavaScript minimum ke klien. Secara teori, aplikasi Qwik hanya memerlukan sekitar 1KB JavaScript untuk menjadi interaktif.

Anda mungkin berpikir jika kami tidak mengirimkan kode JS lalu bagaimana aplikasi kami akan menjadi interaktif? Sebenarnya, Qwik mengirimkannya tetapi tidak pada saat startup aplikasi melainkan pada interaktivitas. Qwik menggunakan banyak informasi selama SSR untuk mulai mengambil bit interaktivitas halaman saat ini sesegera mungkin, dengan cara ini ketika pengguna mengklik atau berinteraksi, JS sudah diunduh.

Ini mirip dengan apa yang kami sebut pemuatan lambat, tetapi Qwik membawa pemuatan lambat ke tingkat ekstrem dengan mengunduh JavaScript secara progresif berdasarkan interaksi pengguna.

Hidrasi, kita tahu, adalah proses inisialisasi kerangka JavaScript setelah dirender oleh server. Setelah merender HTML di server, kerangka JavaScript di klien perlu diinisialisasi ulang dengan menginstal semua event listening pada node DOM, membangun struktur data internal, dan memulihkan status aplikasi.

Semua kerangka kerja JavaScript saat ini memerlukan langkah ini untuk membuat aplikasi menjadi interaktif. Proses hidrasi ini cukup mahaldan Qwik sepenuhnya menghilangkannya sehingga membuat aplikasi Qwik dimulai secara instan. Untuk mencapai hal ini, Qwik menghentikan sementara eksekusi di server dan melanjutkan eksekusi di klien.