Perang Framework JavaScript Sudah Berakhir

Dan hanya ada satu pemenang.

Para peserta: perang antarkerangka kerja adalah topik panas di komunitas JS. Backbone, Sencha, dan lainnya sudah menghilang. jQuery, secara mengejutkan, masih punya komunitas besar. Ada juga yang hasilnya kurang baik seperti Angular.

jQuery: peserta tertua. Populer karena memperbaiki kompatibilitas browser. Namun sulit untuk diskalakan untuk aplikasi. Saat ini bukan lagi arus utama dan bukan pilihan terbaik.

AngularJS: sudah masuk mode LTS dan pensiun. Ini adalah lompatan besar dalam ekosistem framework dan banyak orang merindukannya. Karena tidak lagi dipelihara, ia bukan lagi peserta.

Angular:

• Muncul untuk bersaing dengan React. Karena masalah performa dan kekokohan AngularJS, banyak programmer iri pada React. Angular berusaha memodernisasi AngularJS dan memanfaatkan peningkatan ES6 untuk bersaing dengan React.
• Kurva belajar yang berat adalah kesulitan terbesar. Dibutuhkan banyak konsep. Ia mewarisi kurva belajar AngularJS, tetapi ada kesulitan baru seperti RxJS atau dependency injection (DI) hierarkis.
• Kekhawatiran lain adalah banyak janji yang dilanggar. Misalnya, V2 bisa membuat halaman server-side rendering (SSR) dengan mudah, tetapi per 2022/2/24 tidak dapat bekerja tanpa JS.
• Masalah terbesar adalah fragmentasi dan peningkatan versi. Upgrade versi terlalu sulit sehingga pengguna enggan mengambil risiko. Hal ini terlihat pada statistik situs npm.

VueJS:

• Bagi para developer, ini adalah jawaban yang lebih cepat daripada AngularJS, lebih stabil daripada Angular, dan lebih mudah digunakan. Vue pada sistem template sangat mirip dengan AngularJS, sehingga mempertahankan kesederhanaan AngularJS sambil memperoleh kekuatan dari React.
• Namun VueJS memiliki masalah serius di versi 1 dan 2. Ia tidak menangani array dengan baik, dan para pembuatnya menyalahkan JavaScript karena telah memilih algoritme pembaruan yang salah. Bergantung pada library seperti Vuex atau Redux.
• Masalah ini diselesaikan di versi 3. Namun menyalahkan pihak lain atas kesalahan sendiri bukanlah hal yang cocok untuk komunitas.

SvelteJS:

• Penantang yang sedang tumbuh. Membuat janji-janji besar. Mereka mengklaim bahwa menerjemahkan komponen ke bahasa imperatif adalah keunggulan utamanya. Menurut mereka, ini lebih baik daripada deklaratif milik React.
• Cara penggunaannya sederhana. Namun komponen yang dihasilkan dari terjemahan perintah tidak semudah yang terlihat untuk diprediksi. Dalam beberapa kasus, perubahan tidak dapat dideteksi dengan benar. Dalam situasi seperti ini, state bisa rusak dan view mungkin tidak diperbarui dengan benar. Masalah ini menimbulkan banyak kekhawatiran, sehingga seperti VueJS di masa lalu, sulit membenarkan proyek apa pun dengan SvelteJS.

StencilJS:

• Secara ketat, ini bukan framework. Ia dapat menulis komponen dan mengubahnya ke framework lain. Saat ini bisa diubah ke Angular, React, Vue, dan Web Components.
• Ia mengajukan pertanyaan: apakah ini kode yang mirip dengan kode framework lain? (lihat teks asli)

Mitosis:

• Mungkin Anda belum pernah mendengarnya, tetapi inilah alasan tulisan ini dibuat. Framework terbaru buatan Misko Hevery, pencipta Angular.
• Memiliki tujuan yang sama seperti StencilJS. Menerjemahkan komponen ke banyak framework.
• Demikian pula, ia mengajukan pertanyaan: apakah ini kode yang mirip dengan kode framework lain? (lihat teks asli)

React:

• Salah satu framework tertua yang telah ada di repositori npm selama lebih dari 10 tahun. Sudah banyak berubah, tetapi sebagian besar tetap kompatibel dengan versi lama. Semua perubahan adalah perbaikan. Sebagian orang mengatakan bahwa React dengan hook telah menjadi framework yang jauh lebih baik.
• Kualitas terbaiknya bukan pada hook atau fitur yang terlihat, melainkan kebalikannya. Ia menerapkan standar terbaru JS dan JSX. Ini bukan lagi framework. Mungkin memang tidak pernah begitu. React berusaha sangat keras demi standar hingga menghapus dirinya sendiri dari kode pengguna.

Jadi pemenangnya adalah...

• JSX. Juga React, tetapi lebih tepatnya filosofi di balik React. React sendiri adalah library. Namun dapat digantikan oleh banyak library lain seperti Preact atau React Native. Jika dilihat lebih dekat, StencilJS atau Mitosis sangat mirip dengan React, dan ini bukan kebetulan.
• "Framework terbaik adalah framework yang menghapus dirinya sendiri dari kode pengguna"
• React sangat memanfaatkan JS dan JSX. Kode pengguna tidak bergantung pada React. Kode yang sama bisa berjalan di framework lain tanpa perubahan besar.
• Jadi tanpa ragu React adalah pemenang perang framework.
• Karena ia bukan framework di dalam kode pengguna.

[piriri11]

Yang penting, kalau kita menulis kode sambil sebisa mungkin mempraktikkan kata-kata Paman Bob, "jangan menikah dengan framework", bukankah kita bisa menikmati pengembangan baik dengan React, Vue, maupun Angular?

[polygon]

Bagaimana prospek marko js? Karena didukung oleh eBay, saya jadi tertarik belakangan ini, tetapi di artikel aslinya bahkan tidak disebut sama sekali...

[minhoryang]

"Banyak berubah tetapi sebagian besar kompatibel dengan versi lama" dari React - saya tidak terlalu merasakan pengalaman kompatibilitas ini.
"Fragmentasi dan upgrade versi" dari Angular - tetapi dalam hal ini, saya justru banyak mengalami pengalaman yang mulus.

[roxie]

Saya rasa JSX seharusnya diklasifikasikan bukan sebagai framework, melainkan sebagai specification. Saya paham maksud yang ingin disampaikan, tetapi pendahuluannya terlalu panjang untuk sesuatu yang sebenarnya tidak perlu, dan yang paling utama, judulnya clickbait. Gaya penulisannya juga membuat kualitas tulisannya sendiri turun.

[xguru]

Terima kasih atas rangkuman dan komentar-komentar bagusnya~! Sepertinya obrolan seperti ini akan sangat membantu banyak orang lain ;)

[plastic041]

Secara keseluruhan, menurut saya ini tulisan yang aneh.

Pertama, soal bagian Svelte.
Setelah melihat tulisan aslinya, tertulis bahwa saat memperbarui array, jika ditulis seperti array[0] += 1 maka pembaruannya tidak terjadi sehingga itu dianggap masalah. Namun, di dokumentasi resmi Svelte juga tertulis bahwa array harus di-assign ulang agar pembaruan terjadi, dan sejak awal bukankah di React juga array tidak diperbarui dengan cara seperti ini?

Begitu juga dengan bagian VueJS.
Sambil membandingkannya dengan Angular, tulisan itu membahas kekurangan Vue, tetapi saya tidak paham apa maknanya menaruh kode Angular yang berjalan dan kode Vue yang tidak berjalan lalu mengatakan bahwa Vue kurang bagus.

[pppqqq]

Menurut saya ini kritik yang valid. Perbedaan antara reassignment dan mutation memang bagian yang membingungkan bagi pemula, dan karena baik Svelte maupun Vue sama-sama menggunakan sintaks tersendiri yang mirip JavaScript, bagian yang tidak berjalan sesuai ekspektasi memang pantas dikritik.

Khususnya Vue memperbarui state saat set terjadi melalui proxy; sekilas terlihat mudah, tetapi ada banyak jebakan yang bisa membuat orang terperangkap, jadi saya juga sangat setuju dengan kritik terhadap bagian itu.

React jauh lebih bebas dari masalah seperti ini, karena update state tidak terjadi lewat reassignment, melainkan dengan memanggil fungsi setUpdate secara eksplisit, sehingga memberikan update satu arah dalam standar JavaScript. Karena itu, sejak awal memang tidak muncul masalah seperti bingung membedakan perubahan pada sebagian elemen array dengan reassignment.

[tequila]

Ini agak menyelip dari topik utama, tetapi di Vue 3 pembaruan array dalam bentuk seperti itu didukung secara reaktif, jadi menurut saya tulisan ini cuma mengkritik habis-habisan Vue versi lama lalu lewat begitu saja...^^;; Padahal di React pembaruan seperti ini justru tidak bisa dilakukan, dan itu sama sekali bukan kekurangan kecil, tetapi rasanya karakteristik seperti itu tidak benar-benar dibahas dengan tepat. haha

[tenshi]

Di artikel asli juga ada banyak komentar, dan tampaknya cukup banyak komentar yang menunjukkan berbagai masalah.

[riddler]

Bagian "apakah ini kode yang mirip dengan kode dari framework lain?" yang disertai penjelasan tentang StencilJS dan Mitosis agak membingungkan, jadi saya melihat teks aslinya, dan sepertinya itu menanyakan apakah kode yang digunakan di dua framework tersebut terasa seperti pernah dilihat di framework lain, bukan?

Mungkin maksudnya ditulis untuk menunjukkan bahwa gaya penulisan kodenya mirip dengan React.

[jjpark78]

Penilaiannya terhadap VueJS terlalu keras..

Ketergantungan pada redux juga rasanya React tidak benar-benar bebas darinya..

Kalau dari skala pengguna, memang benar React jauh mendominasi di peringkat 1,

tetapi dari sisi teknis, tidak bisa dibilang itu proyek yang lebih buruk daripada React.

[cckn1985]

Bukankah inti yang terutama dibicarakan di sini tentang VueJs bukan ketergantungan pada library eksternal, melainkan "sikap melempar tanggung jawab ke JS atas masalah yang mereka timbulkan sendiri"?

Saya rasa memang benar opini publik terhadap vueJS tidak begitu baik.

Kalau Anda membaca isi artikelnya, bagian yang menyebut ketergantungan pada Vuex dan Redux juga menjelaskan bahwa untuk menyelesaikan masalah yang muncul di VueJS 2, library seperti Vuex dan Redux adalah sesuatu yang 'wajib'.

[jjpark78]

Ini juga sudah merupakan isi dari beberapa komentar di sumber aslinya.

Saat kompleksitas meningkat, baik di Vue maupun React, library penyimpanan state/caching seperti redux semuanya menjadi "wajib".

Benar juga, di sumber asli untuk VueJS ini dianggap sebagai kekurangan, sementara untuk React hal ini "sengaja" tidak disebutkan.

Perilaku komunitas dari sudut pandang saya tidak terlalu penting..

[road4one]

Di React, redux tidak wajib. Karena state bisa dikelola dengan menggunakan contextAPI atau useReducer, dan sebagainya. Namun, saya juga tidak berpikir bahwa ini bisa dianggap sebagai dasar bahwa React lebih baik daripada Vue.

[cckn1985]

Ya hehe, secara keseluruhan sepertinya ini bukan tulisan yang bagus.

Penulisnya tampaknya sudah menetapkan kesimpulannya lebih dulu lalu merendahkan framework-framework lain demi sampai ke kesimpulan itu.