Svelte adalah tambahan lain untuk beragam opsi di kumpulan 'Framework Berbasis JavaScript'. Tidak realistis untuk berpikir bahwa Kita dapat mempelajari setiap framework baru setiap minggu atau bulan, tetapi Svelte benar-benar patut dicoba. Mengapa? Mari kita cari tahu.

Mengapa Tetap Menjalankan Pembaruan Waktu?

Kerangka kerja populer seperti React & Vue telah mempromosikan DOM virtual sedemikian rupa sehingga setiap framework baru mencoba menggunakan DOM virtual dengan lebih efisien. Penting untuk mengelola pembaruan waktu proses dan jika Kita memperbarui semuanya pada waktu proses maka Kita hanya memiliki sedikit opsi & DOM virtual, dalam hal ini, adalah solusi yang sangat sederhana dan elegan.

Di sinilah Svelte mengubah permainan. Svelte mengelola semuanya pada waktu kompilasi dan tidak peduli dengan pembaruan waktu proses. Svelte mengetahui bagaimana status komponen dapat berubah dan menghasilkan langkah sesedikit mungkin untuk mengelola perubahan tersebut hanya pada waktu kompilasi.

Bagaimana cara melakukannya?

Jadi mengelola pembaruan pada waktu kompilasi terdengar bagus, tetapi bagaimana Svelte mencapainya? Mari kita gali lebih dalam. 

Pertama, kita harus membahas Reaktivitas di Svelte. Ngomong-ngomong, Svelte menangani reaktivitas, itu bisa dianggap benar-benar reaktif.

Gambar di atas merangkum reaktivitas di Svelte. Jika hitungan adalah variabel status Kita, maka status Kita sekarang reaktif. Menugaskan ulang nilai ke variabel menggunakan operator penugasan adalah semua yang diperlukan untuk membuat Svelte reaktif. Sekarang mari kita bahas bagaimana reaktivitas ini menyebabkan Svelte memperbarui DOM.

Svelte menandai variabel status ini sebagai dirty & menghasilkan fungsi yang memperbarui nilai ini di DOM asli setiap kali variabel status ini bereaksi (dipindahkan). Fungsi ini kemudian disematkan ke dalam output bundel pada waktu kompilasi & akan dipanggil setiap kali variabel status kita bereaksi. Itu saja.

Ukuran Bundel Lebih Kecil -> Boot-up Cepat Di Browser

Yang hebat tentang Svelte adalah ukuran bundelnya yang kecil. Jadi Kita lebih menghemat memori & pada saat yang sama menikmati boot-up cepat di browser. Svelte lebih merupakan kompiler daripada framework yang mengubah semua kode kerangka Kita menjadi kode javascript biasa pada waktu kompilasi & Kita mendapatkan ukuran bundel yang sangat kecil. Di atas itu, kode framework Svelte juga dibatasi hanya pada beberapa baris kode. Fungsi utama yang diperlukan untuk kerangka boot-up berada di file internal.js dalam paket Svelte.js. Dari fungsi tersebut, hanya fungsi tersebut yang akan diimpor yang benar-benar berkontribusi pada aplikasi di browser. Tidak ada fungsi atau data yang tidak perlu untuk membebani aplikasi Kita.

Animasi di Svelte

Svelte memberikan performa yang luar biasa. Sebagian besar animasi di Svelte dicapai hanya dengan menggunakan CSS, penggunaan javascript sebagian besar dihindari, karena animasi CSS dijalankan dari utas utama, animasi Kita lebih berkinerja.

Say Hello To Embedded Applications

Meskipun untuk saat ini, penggunaan Svelte untuk aplikasi web besar masih dalam pengawasan. Menggunakannya untuk aplikasi yang disematkan sepertinya cukup menjanjikan. Kita tunggu saja untuk perkembangan Framework ini :)