Apakah ini saatnya untuk melupakan Bereaksi dan meningkatkan ke Svelte?

Setiap tahun, suatu Negara JavaScript studi dipublikasikan yang merangkum hasil survei memeriksa keadaan saat ini ekosistem JavaScript. Studi ini mencakup kerangka kerja front-end, pengembangan server dan seluler, pengujian, sumber daya populer untuk pengembang, dan banyak lagi.

Segala sesuatu di dalamnya, tentu saja, berputar di sekitar JavaScript. Oleh karena itu, jika Anda menggunakan JS untuk pengembangan web, saya sangat merekomendasikan untuk melihat Status JavaScript jika Anda belum melakukannya.

Bagi saya, salah satu hasil paling menarik dari State of JavaScript adalah perhatian tak terduga dari mereka yang berpartisipasi dalam survei terhadap kerangka front-end Svelte .

Dalam peringkat keseluruhan alat-alat front-end terkemuka (berdasarkan indikator kesadaran kerangka kerja, minat dan kepuasan terhadapnya), Svelte muncul di tempat kedua. Dia pergi ke sana tepat setelah React , di depan alat-alat terkenal seperti Vue.js , Preact , Angular, dan Ember .
Ini sedikit mengejutkan saya, karena Svelte adalah alat yang relatif baru, baik dari segi usia maupun dari segi paradigma pengembangan perangkat lunak.


Kerangka kerja frontend peringkat berdasarkan penelitian State of JavaScript

Saya tahu bahwa banyak dari Anda dapat marah di sini dan mengatakan bahwa React dan Svelte, bagaimanapun, bukan kerangka kerja, tetapi perpustakaan. Saya tahu ini, tetapi laporan penelitian tidak ditulis oleh saya, jadi mari kita tutup pertanyaan tentang terminologi ini.

Saya menemukan contoh proyek template Svelte dan membuat aplikasi Hello World kecil.


Di sebelah kiri adalah proyek Bereaksi sederhana. Di sebelah kanan adalah proyek serupa berdasarkan Svelte.

Meskipun proyek sederhana ini tidak sulit untuk dibawa ke keadaan kerja, seseorang yang sebelumnya menulis tentang React akan membutuhkan waktu untuk menguasai Svelte.

Apakah sepadan dengan waktu untuk mempelajari Svelte? Mungkin kita hanya dihadapkan dengan hal lain yang modis yang akan menghilang secepat itu muncul? Saya mengusulkan untuk mencari tahu.

Tujuan penelitian


Saya ingin menjawab pertanyaan berikut: "Haruskah saya berhenti membuang waktu untuk belajar Bereaksi dan mulai berurusan dengan Svelte?"

Kami akan mencari jawaban untuk pertanyaan ini dengan menjelajahi perbedaan mendasar antara React dan Svelte. Ini akan memungkinkan kita untuk memahami kualitas unik apa yang dimiliki masing-masing alat ini. Sebagai hasilnya, kami akan mencari tahu investasi mana yang layak.

Kami mulai dengan ulasan dari masing-masing perpustakaan, kemudian berbicara tentang pro dan kontra mereka, dan kemudian menarik kesimpulan.

Reaksi


Dalam beberapa tahun terakhir, secara harfiah semua orang telah berbicara tentang Bereaksi. Perpustakaan ini, dibuat oleh Facebook, dengan cepat menangkap dunia pengembangan web. Sekarang ini adalah alat pengembangan web yang menempati urutan pertama di dunia (kebenaran, jawaban untuk pertanyaan "nomor satu" atau tidak tergantung pada siapa yang ditanya pertanyaan ini).

Perpustakaan React, sebagian besar berkat komunitas di sekitarnya, tumbuh lebih cepat akhir-akhir ini daripada sebelumnya. Dan sementara tidak ada tanda-tanda perlambatan pertumbuhan ini.

Berikut adalah tiga fitur Bereaksi yang membuat perpustakaan ini sangat menarik:

  1. Sifat deklaratif.
  2. Struktur aplikasi berbasis komponen.
  3. Kemudahan penggunaan dalam hal integrasi ke dalam tumpukan teknologi yang ada.

Sifat deklaratif dari Bereaksi adalah apa yang memungkinkan Anda untuk membuat antarmuka pengguna interaktif. Cukup bagi programmer untuk hanya mendesain elemen-elemen visual dari aplikasi untuk setiap keadaan, setelah itu Bereaksi akan melakukan sisanya. Ini menyederhanakan pembacaan dan pemahaman kode, memfasilitasi debugging.

Bagaimana React melakukan sisanya? Melalui penggunaan teknologi DOM virtual. Penentuan bagian DOM mana yang perlu diperbarui dilakukan di perut perpustakaan, pada tingkat menengah antara kode yang ditulis oleh programmer dan DOM yang sebenarnya. Berkat teknologi ini, kecepatan rendering halaman yang tinggi dapat dijamin.

Pustaka Bereaksi dirancang sedemikian rupa sehingga teknologi mana yang digunakan dalam tumpukan alat pengembang tidak masalah. React-frontend dapat "kacau" untuk apa saja. Misalnya, backends berdasarkan Node.js , Ruby on Rails , Spring Boot , PHP, dan sebagainya. Pustaka ini sepenuhnya netral dalam hubungannya dengan apa yang harus berinteraksi dengannya.

Mengapa beberapa panggilan Bereaksi "perpustakaan" dan beberapa panggilan "kerangka kerja"? Untuk membuat aplikasi tertentu, bersama dengan Bereaksi, Anda perlu menggunakan pustaka tambahan yang digunakan untuk mengontrol keadaan aplikasi, untuk perutean, dan untuk berinteraksi dengan berbagai API. Jika Anda membuat template proyek Bereaksi menggunakancreate-react-app - tidak akan memiliki seperangkat alat tertentu yang dapat diharapkan dari kerangka kerja.

Langsing


Svelte adalah alat yang diciptakan untuk mengubah situasi di bidang pengembangan frontend. Berikut adalah video yang bagus tentang Svelte 3, di mana Rich Harris, pencipta Svelte, sangat menarik dan secara emosional berbicara tentang perpustakaan ini. Jika Anda belum menonton video ini, saya sarankan untuk melihatnya.

Dalam presentasi ini, sejarah pemrograman reaktif disajikan dengan baik, kelemahan yang melekat dalam implementasi tradisional mekanisme reaktif disorot, solusi untuk masalah yang sesuai disajikan.

Banyak dari apa yang dapat dikaitkan dengan kekuatan React adalah fondasi Svelte. Rich Harris sangat berpengetahuan tentang pro dan kontra dari internal Bereaksi.

Bereaksi menjaga antarmuka agar tetap terbaru dan melakukan tindakan lain langsung di peramban. Svelte melakukan tugasnya selama pembangunan proyek. Ini adalah perbedaan utama antara React dan Svelte. Inilah yang dikatakan dokumentasi Svelte tentangnya: "Svelte mengubah aplikasi Anda menjadi kode JavaScript yang sempurna selama pembuatan proyek, daripada menafsirkan kode aplikasi saat sedang berjalan."

Svelte tidak menggunakan teknik seperti membandingkan DOM nyata dan virtual.

Kompiler Svelte mengambil komponen deklaratif dan mengubahnya menjadi kode tingkat rendah yang efisien, penting, yang berinteraksi langsung dengan DOM.

Karena Svelte menggunakan kompiler daripada DOM virtual, ini memungkinkan untuk mengurangi beban pada browser, meningkatkan kecepatan halaman, dan memfasilitasi mesin JS browser untuk mengumpulkan sampah. Browser tidak harus menyelesaikan beberapa tugas saat mengeksekusi kode halaman, yang meningkatkan produktivitas proyek.

Benar, seperti Bereaksi, Svelte menggunakan komponen yang ditulis dalam gaya deklaratif. Sebagian besar perbedaan antara React dan Svelte dimulai setelah mereka membangun proyek Svelte.

Kekuatan dan kelemahan React dan Svelte


Mari kita bicara tentang kekuatan dan kelemahan perpustakaan yang dipelajari.

▍ Kekuatan Bereaksi


  • Dukungan komunitas yang kuat.
  • Banyak perpustakaan untuk menguji kode yang ditulis berdasarkan Bereaksi.
  • Dukungan TypeScript.
  • Alat pengembang berkualitas.
  • , .
  • React-.

▍ Svelte


  • , , Svelte.
  • - (HTML, CSS, JS).

    • JSX .
  • .

    • Svelte- 40% , React-.
  • ( ).
  • .

▍ React


  • DOM — .
  • .
  • .
  • - React.
  • JSX- .

▍ Svelte


  • ( React) .
  • TypeScript.
  • , , , .
  • , Svelte ( , ).


Kembali ke pertanyaan kami: "Haruskah saya berhenti membuang waktu untuk belajar Bereaksi dan mulai berurusan dengan Svelte?"

Jujur, saya mulai bekerja pada artikel ini, berharap untuk sampai pada kesimpulan bahwa Svelte terlalu muda teknologi, dan bahwa tidak ada gunanya berinvestasi terlalu banyak waktu dalam studinya. Tetapi setelah saya mengetahui apa yang sedang terjadi, setelah saya masuk ke dasar-dasarnya, saya sangat tertarik dan terkesan dengan apa yang diungkapkan kepada saya, oleh dinamika Svelte macam apa yang saya rasakan.

Tidak dapat disangkal bahwa proyek-proyek Svelte memiliki kinerja yang sangat baik.

Gagasan di balik Svelte terlihat berani dan progresif. Ukuran komunitas Svelte tumbuh. Saya yakin bahwa keberhasilan alat-alat front-end (serta luasnya distribusi mereka) sangat tergantung pada komunitas dan bagaimana pengembang mengadopsi alat-alat ini.

Sebagai hasilnya, kita dapat mengatakan bahwa jika Svelte dan segala sesuatu yang berkaitan dengan perpustakaan ini terus berkembang pada kecepatan yang sama, kita dapat mengharapkan penyebaran luas teknologi ini.

Tentu saja, Svelte baru memulai perjalanannya, jadi kita belum tahu tentang masalah-masalah itu, dan mungkin ada banyak dari mereka yang pasti akan muncul selama implementasi Svelte dalam proyek-proyek nyata. Kami tidak tahu bagaimana programmer akan menghindari masalah ini, bagaimana pengembang perpustakaan akan memperbaikinya.

Ketika perpustakaan Bereaksi pertama kali muncul, itu tampak seperti alat canggih yang tidak memiliki kelemahan sama sekali. Tetapi, dengan pengembangan dan penyebaran React, ternyata pengembang web harus mengatasi berbagai situasi sulit, mereka harus mencari solusi, kompromi. Dan para pengembang perpustakaan itu sendiri juga harus bekerja keras untuk memperbaikinya.

Saya yakin Svelte menunggu hal yang sama. Bagaimanapun, dunia pengembangan web sangat fluktuatif.

Jika Anda belum siap untuk meninggalkan React, saya akan menyarankan Anda, minimal, untuk memonitor Svelte dengan cermat. Perpustakaan ini dapat menjadi pesaing yang kuat untuk Bereaksi jauh lebih cepat dari yang Anda bayangkan.

Pembaca yang budiman! Apa pendapat Anda tentang Svelte?


All Articles