Sudut vs Bereaksi vs Vue: Kerangka Kerja Yang Dipilih pada 2020

Posting ini adalah panduan komprehensif yang mungkin merupakan solusi tepat untuk Anda: Angular vs Bereaksi vs Vue.


Hanya beberapa tahun yang lalu, pengembang terutama berdebat tentang apakah mereka harus menggunakan Angular vs React untuk proyek mereka. Tetapi selama beberapa tahun terakhir, kami melihat pertumbuhan minat pada pemain ketiga bernama Vue.js.

Jika Anda seorang pengembang yang memulai proyek dan tidak dapat memutuskan kerangka JavaScript mana yang akan digunakan, panduan ini akan membantu Anda membuat keputusan.

Kami membahas berbagai aspek Angular, Vue, dan React untuk melihat bagaimana mereka sesuai dengan kebutuhan Anda. Posting ini bukan hanya panduan tentang Angular vs Bereaksi vs Vue tetapi bertujuan untuk menyediakan struktur untuk membantu menilai kerangka JavaScript front-end secara umum. Jika kerangka kerja baru tiba tahun depan, Anda akan tahu persis parameter apa yang harus dilihat!

* Dalam posting ini, kami menganggap bahwa Anda memiliki pengetahuan dasar tentang JavaScript dan telah menggunakan kerangka kerja JavaScript juga.

Angular vs Bereaksi vs Vue

Mari kita mulai:

Bagian 1: Sejarah singkat Vue vs React vs Angular

Sebelum kita masuk ke detail teknis, mari kita bicara tentang sejarah di balik kerangka kerja ini – hanya untuk lebih menghargai filosofi dan evolusi mereka dari waktu ke waktu..

Bagaimana semuanya dimulai ��

logo sudut

Sudut, dikembangkan oleh Google, pertama kali dirilis pada 2010, menjadikannya yang tertua dari yang banyak. Ini adalah kerangka kerja JavaScript berbasis TypeScript. Pergeseran substansial terjadi pada 2016 pada rilis Angular 2 (dan menjatuhkan "JS" dari nama aslinya – AngularJS). Angular 2+ dikenal sebagai hanya Angular. Meskipun AngularJS (versi 1) masih mendapatkan pembaruan, kami akan memfokuskan diskusi pada Angular. Versi stabil terbaru adalah Angular 9, yang dirilis pada Februari 2020.

logo vue

Vue, juga dikenal sebagai Vue.js, adalah anggota termuda dari grup. Ini dikembangkan oleh mantan karyawan Google Evan You pada tahun 2014. Selama tiga tahun terakhir, Vue telah melihat perubahan besar dalam popularitas, meskipun tidak memiliki dukungan dari perusahaan besar. Versi stabil saat ini adalah 2.6, dirilis pada Februari 2019 (dengan beberapa rilis tambahan kecil sejak itu). Kontributor Vue adalah didukung oleh Patreon. Vue 3, saat ini dalam fase alfa, sedang merencanakan untuk pindah ke TypeScript.

bereaksi logo

Reaksi, dikembangkan oleh Facebook, awalnya dirilis pada 2013. Facebook menggunakan React secara luas dalam produk mereka (Facebook, Instagram, dan WhatsApp). Versi stabil saat ini adalah 16.X, dirilis pada November 2018 (dengan pembaruan inkremental yang lebih kecil sejak itu).

Berikut ringkasan singkat tentang Angular vs Bereaksi vs Vue, dalam hal status dan riwayatnya:

Sejarah Angular vs Bereaksi vs Vue

Sudut
Reaksi
Vue

Peluncuran pertama201020132014
Situs resmiangular.ioreactjs.orgvuejs.org
Perkiraan. ukuran (KB)50010080
Versi sekarang916.x2.6.x
Digunakan olehGoogle, WixFacebook, UberAlibaba, GitLab

Lisensi ��‍♂️

Sebelum Anda menggunakan kerangka kerja sumber terbuka, pastikan Anda membaca lisensinya. Menariknya, ketiga kerangka kerja menggunakan Lisensi MIT, yang memberikan batasan terbatas pada penggunaan kembali, bahkan dalam perangkat lunak berpemilik. Pastikan Anda mengetahui implikasi lisensi sebelum menggunakan kerangka kerja atau perangkat lunak apa pun.

Disini adalah ringkasan singkat dari lisensi MIT dalam bahasa Inggris yang sederhana.

Popularitas ��

Sebagai "bersudut" dan "reaksi" adalah kata-kata umum, sulit untuk memahami popularitas mereka dari Google Trends. Padahal, proksi yang baik untuk popularitas mereka adalah jumlah bintang yang diperoleh repositori GitHub mereka. Pergeseran tiba-tiba dalam jumlah bintang Vue terjadi pada pertengahan 2016 dan, baru-baru ini, Vue telah ada di sana dengan React di antara kerangka kerja paling populer.

Bintang di Proyek GitHub untuk Angular vs React vs VueJumlah bintang pada proyek GitHub untuk Angular, React, dan Vue

Mari kita periksa bagaimana pasar kerja untuk Angular vs React vs Vue, yang juga merupakan ukuran popularitas yang baik:

Pasar kerja untuk Angular vs React vs Vue ��‍♂️

Terbaik sumber data yang menunjukkan tren di pasar kerja adalah berbagai papan pekerjaan.

Seperti yang terlihat dari tren akhir 2018, jumlah pekerjaan yang membutuhkan keahlian Angular atau React kira-kira sama, sedangkan Vue masih hanya sebagian kecil dari jumlah ini (sekitar 20%). Daftar ini jelas tidak lengkap tetapi memberikan gambaran yang baik tentang industri teknologi secara keseluruhan.

Jika Anda benar-benar melihat dari sudut pandang pasar kerja saat ini, taruhan terbaik Anda adalah belajar Angular atau Bereaksi. Namun, mengingat bahwa Vue telah mendapatkan popularitas selama tiga tahun terakhir, mungkin perlu beberapa waktu bagi proyek untuk menggunakan Vue, atau proyek baru yang mengadopsi Vue untuk mencapai tingkat kematangan yang memerintahkan jumlah pengembang yang lebih tinggi..

Bagian 2: Komunitas dan pembangunan

Sekarang setelah Anda terbiasa dengan sejarah dan tren masing-masing kerangka kerja ini, kami akan melihat komunitas untuk menilai pengembangan kerangka kerja ini. Kita telah melihat bahwa untuk semua kerangka kerja, rilis tambahan telah dikirimkan secara teratur selama setahun terakhir, yang menunjukkan bahwa pengembangan sedang berlangsung dengan lancar.

Mari kita lihat Angular vs React vs Vue sehubungan dengan statistik pada repositori GitHub mereka:

Sudut
Reaksi
Vue

# Pengamat3.2k6.6k6.0k
# Bintang57k144rb157rb
# Garpu15.9k27.6k23.7k
# Kontributor1.0891,361289

Vue memiliki banyak pengamat, bintang, dan garpu. Ini menunjukkan popularitasnya di antara pengguna dan nilainya ketika membandingkan Vue vs React. Namun, jumlah kontributor untuk Vue lebih rendah dari Angular dan Bereaksi.

Satu penjelasan yang mungkin adalah itu Vue dikendalikan sepenuhnya oleh komunitas open source, sedangkan Angular dan React memiliki andil yang signifikan dari karyawan Google dan Facebook yang berkontribusi pada repositori.

Dari statistik, ketiga proyek menunjukkan aktivitas pengembangan yang signifikan, dan ini pasti akan berlanjut di masa depan – hanya statistik ini tidak dapat menjadi dasar untuk tidak memutuskan untuk menggunakan salah satu dari mereka.

Bagian 3: Migrasi

Saat Anda bekerja dengan kerangka kerja pilihan Anda, Anda tidak ingin perlu khawatir tentang pembaruan kerangka kerja yang datang dan mengacaukan kode Anda. Meskipun dalam kebanyakan kasus Anda tidak akan menemukan banyak masalah dari satu versi ke versi lain, penting untuk menjaga jari Anda pada denyut nadi karena beberapa pembaruan dapat lebih signifikan dan memerlukan penyesuaian untuk menjaga hal-hal yang kompatibel.

Sudut merencanakan pembaruan besar setiap enam bulan. Ada juga periode enam bulan sebelum API utama tidak digunakan lagi, yang memberi Anda waktu dua siklus rilis (satu tahun) untuk membuat perubahan yang diperlukan jika ada.

Ketika datang ke Angular vs React, Facebook telah menyatakan itu stabilitas sangat penting bagi mereka, karena perusahaan besar seperti Twitter dan Airbnb menggunakan Bereaksi. Pembaruan melalui versi umumnya paling mudah dalam Bereaksi, dengan skrip seperti bereaksi-codemod membantu Anda untuk bermigrasi.

Di bagian Migrasi pada FAQ, Vue menyebutkan itu 90% dari API adalah sama jika Anda bermigrasi dari 1.x ke 2. Ada sebuah alat bantu migrasi yang berfungsi pada konsol untuk menilai status aplikasi Anda.

Bagian 4: Bekerja dengan Vue vs Angular vs Bereaksi

Ada beberapa karakteristik penting untuk dilihat di sini, utamanya adalah ukuran keseluruhan dan waktu muat, komponen yang tersedia, dan kurva belajar.

Ukuran dan waktu muat ⏲️

Ukuran perpustakaan adalah sebagai berikut:

  • Angular 4+: Tergantung pada ukuran bundel yang dihasilkan
  • Bereaksi: 116 KB
  • Vue: 91 KB

Meskipun ada perbedaan yang signifikan antara ukuran kerangka kerja, mereka masih kecil dibandingkan dengan ukuran halaman web rata-rata (2+ MB pada 2018). Selain itu, jika Anda menggunakan CDN populer untuk memuat pustaka ini, sangat mungkin bahwa pengguna memiliki pustaka yang sudah dimuat di sistem lokal mereka.

Komponen ��️

Komponen adalah bagian integral dari ketiga kerangka kerja, tidak masalah jika kita berbicara Vue, React, atau Angular. Suatu komponen umumnya mendapat input, dan mengubah perilaku berdasarkannya. Perubahan perilaku ini umumnya bermanifestasi sebagai perubahan di UI dari beberapa bagian halaman. Penggunaan komponen membuatnya mudah untuk menggunakan kembali kode. Komponen dapat berupa gerobak di situs e-commerce atau kotak masuk di jejaring sosial.

Sudut Sudut:
Dalam Angular, komponen disebut sebagai arahan. Arahan hanyalah penanda pada elemen DOM, yang Angular dapat melacak dan melampirkan perilaku tertentu juga. Oleh karena itu, Angular memisahkan bagian UI komponen sebagai atribut tag HTML, dan perilakunya dalam bentuk kode JavaScript. Inilah yang membedakannya ketika melihat Angular vs Bereaksi.
Reaksi Reaksi:
Bereaksi, yang menarik, menggabungkan UI dan perilaku komponen. Sebagai contoh, ini dia kode untuk membuat komponen halo dunia di Bereaksi. Di Bereaksi, bagian kode yang sama bertanggung jawab untuk membuat elemen UI dan mendiktekan perilakunya.
Vue Vue:
Dalam Vue, UI dan perilaku juga merupakan bagian dari komponen, yang membuat semuanya lebih intuitif ketika melihat Vue vs React. Selain itu, Vue sangat dapat disesuaikan, yang memungkinkan Anda untuk menggabungkan UI dan perilaku komponen dari dalam skrip. Selanjutnya, Anda juga bisa gunakan pra-prosesor di Vue daripada CSS, yang merupakan fungsi luar biasa. Vue sangat bagus dalam hal integrasi dengan perpustakaan lain, seperti Bootstrap.

Untuk membandingkan tampilan aplikasi yang sama dengan berbagai pustaka, berikut adalah pos yang bagus membuat aplikasi daftar hal yang sama pada React and Vue dan membandingkan perbedaan kedua kerangka kerja tersebut.

Kurva belajar ��

Jadi betapa sulitnya mempelajari masing-masing kerangka kerja ini?

Sudut Sudut:
Sudut memiliki kurva belajar yang curam, mengingat itu adalah solusi yang lengkap, dan menguasai Angular mengharuskan Anda mempelajari konsep terkait seperti TypeScript dan MVC. Meskipun butuh waktu untuk belajar Angular, investasi membayar dividen dalam hal memahami bagaimana ujung depan bekerja.
reaksi Reaksi:
Bereaksi menawarkan Mulai panduan yang akan membantu seseorang mengatur Bereaksi dalam waktu sekitar satu jam. Dokumentasi lengkap dan lengkap, dengan solusi untuk masalah umum sudah ada di Stack Overflow. Bereaksi bukan kerangka kerja yang lengkap dan fitur-fitur canggih membutuhkan penggunaan perpustakaan pihak ketiga. Ini membuat kurva pembelajaran kerangka inti tidak terlalu curam tetapi tergantung pada jalur yang Anda ambil dengan fungsionalitas tambahan. Namun, belajar menggunakan Bereaksi tidak selalu berarti Anda menggunakannya praktik terbaik.
vue Vue:
Vue memberikan kemampuan penyesuaian yang lebih tinggi dan karenanya lebih mudah dipelajari daripada Angular atau Bereaksi. Selanjutnya, Vue memiliki tumpang tindih dengan Angular dan Bereaksi sehubungan dengan fungsi mereka seperti penggunaan komponen. Oleh karena itu, transisi ke Vue dari salah satu dari keduanya adalah pilihan yang mudah. Namun, kesederhanaan dan fleksibilitas Vue adalah pedang bermata dua – memungkinkan kode yang buruk, membuatnya sulit untuk di-debug dan diuji.

Meskipun Angular, React dan Vue memiliki kurva belajar yang signifikan, penggunaannya pada penguasaan tidak terbatas. Misalnya, Anda dapat mengintegrasikan Angular dan Bereaksi dengan WordPress dan WooCommerce untuk membuat aplikasi web progresif.

Sudut vs Bereaksi vs Vue: Siapa yang menang?

Menjelang akhir posting ini, mari kita ingat fitur karakteristik dari setiap kerangka kerja untuk mencoba menjawab pertanyaan: Angular vs Bereaksi vs Vue: mana yang harus Anda pilih?

logo sudut Sudut adalah kerangka kerja yang paling matang, memiliki dukungan yang baik dalam hal kontributor dan merupakan paket lengkap.

Namun, kurva belajarnya curam dan konsep pengembangan di Angular dapat menunda pengembang baru.

Angular adalah pilihan yang baik untuk perusahaan dengan tim dan pengembang besar yang sudah menggunakan TypeScript.

Ekstra �� Berikut adalah beberapa templat templat admin sudut yang mungkin menarik bagi Anda.

bereaksi logo Reaksi hanya cukup tua untuk menjadi dewasa dan memiliki sejumlah besar kontribusi dari komunitas. Itu telah diterima secara luas. Pasar kerja untuk React sangat bagus, dan masa depan untuk kerangka kerja ini terlihat cerah.

Bereaksi terlihat seperti pilihan yang baik untuk seseorang yang memulai dengan kerangka JavaScript front-end, pemula dan pengembang yang menyukai fleksibilitas. Kemampuan untuk berintegrasi dengan kerangka kerja lain memberikannya keuntungan besar bagi mereka yang menginginkan fleksibilitas dalam kode mereka.

logo vue Vue adalah terbaru ke arena, tanpa dukungan dari perusahaan besar.

Namun, itu telah dilakukan dengan sangat baik dalam beberapa tahun terakhir untuk keluar sebagai pesaing yang kuat untuk Angular dan Bereaksi. Ini mungkin memainkan peran dengan banyak raksasa Cina seperti Alibaba dan Baidu memilih Vue sebagai kerangka JavaScript front-end utama mereka.

Namun, masih harus dilihat bagaimana hal itu terjadi di masa depan dan seseorang dibenarkan untuk berhati-hati dengannya. Vue harus menjadi pilihan Anda jika Anda lebih suka kesederhanaan, tetapi juga suka fleksibilitas.

Ekstra �� Berikut adalah beberapa templat admin Vue yang dibuat dengan Bootstrap yang mungkin menarik bagi Anda.

Jawaban atas perdebatan Angular vs React vs Vue adalah bahwa tidak ada pilihan yang benar mutlak, yang mungkin Anda harapkan.

Masing-masing perpustakaan memiliki kelebihan dan kekurangannya masing-masing. Berdasarkan proyek yang sedang Anda kerjakan, dan persyaratan pribadi Anda, salah satunya akan lebih cocok daripada yang lain. Itu selalu penting untuk melakukan riset Anda sendiri sebelum memutuskan, terutama jika Anda akan bekerja pada usaha bisnis dan bukan pada proyek pribadi.

Kerangka mana yang menurut Anda adalah pemenang di sini – Angular vs Bereaksi vs Vue? Beri tahu kami di komentar di bawah.

Bacaan lebih lanjut: ��

  • Templat Desain Bahan untuk Vue, Angular, React (Material UI)
  • Perpustakaan / Kerangka Komponen UI Bereaksi Terbaik
  • Perpustakaan Komponen UI Vue yang Menarik
  • Templat Dasbor Admin Angular Terbaik
  • Templat Bootstrap Gratis Terbaik untuk ReactJS
  • Bereaksi Template Asli Gratis
  • Template Admin VueJS gratis dan Premium Dibangun dengan Bootstrap

Pada catatan lain, bagaimana kalau menggunakan WordPress lagi? WordPress sangat cocok untuk menjalankan hampir semua proyek situs web yang dapat dibayangkan, dan ada beberapa tema mengagumkan yang tersedia untuk membuat desain Anda tampak hebat (banyak di antaranya gratis). Belum lagi Anda dapat meng-host situs web WordPress dengan lebih murah.

Jangan lupa untuk bergabung dengan kursus kilat kami tentang mempercepat situs WordPress Anda. Dengan beberapa perbaikan sederhana, Anda dapat mengurangi waktu loading hingga 50-80%:

Tata ruang dan presentasi oleh Karol K.

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map