Rumah  >  Artikel  >  hujung hadapan web  >  Apakah tiga rangka kerja arus perdana untuk bahagian hadapan web?

Apakah tiga rangka kerja arus perdana untuk bahagian hadapan web?

青灯夜游
青灯夜游asal
2022-07-12 18:07:0638596semak imbas

Tiga rangka kerja bahagian hadapan web arus perdana: 1. Angular, rangka kerja bahagian hadapan untuk mencipta antara muka aplikasi tunggal, dengan fungsi modul yang berkuasa dan arahan tersuai 2. React, rangka kerja pembangunan JavaScript yang mesra pengguna untuk membina antara muka pengguna, terutamanya digunakan untuk membina UI; 3. vue ialah rangka kerja JavaScript yang progresif untuk membina antara muka pengguna Pustaka teras Vue hanya memfokuskan pada lapisan paparan, dan sangat mudah dipelajari dan mudah disepadukan dengan Perpustakaan lain atau sedia ada penyepaduan projek.

Apakah tiga rangka kerja arus perdana untuk bahagian hadapan web?

Persekitaran pengendalian tutorial ini: sistem Windows 7, komputer Dell G3.

Dalam sepuluh tahun yang lalu, industri IT telah berkembang pesat, menghasilkan banyak profesion baharu, seperti pereka UI, jurutera pembangunan, jurutera ujian perisian, dll. Antara banyak profesion baharu berprofil tinggi, Web jurutera hadapan adalah salah seorang daripada mereka. Jadi apakah tiga rangka kerja arus perdana untuk bahagian hadapan web?

Tiga rangka kerja bahagian hadapan web arus perdana ialah Angular, React dan Vue.

1. Angular

AngularJS telah dicipta oleh Misko Hevery dan yang lain pada tahun 2009, dan kemudiannya diperoleh oleh Google. Ia merupakan rangka kerja JS bahagian hadapan yang sangat baik yang digunakan dalam banyak produk. Ia bukan sahaja rangka kerja pembangunan bahagian hadapan dengan konsep lanjutan, tetapi juga penyelesaian hujung ke hujung. Ia mengikuti corak MVC dalam reka bentuk seni bina dan menyokong gandingan longgar data dan komponen pemprosesan logik. AngularJS merealisasikan lanjutan semula jadi HTML melalui teknologi arahan, dan merealisasikan penyegerakan automatik dua hala model data dan paparan paparan melalui teknologi kompilasi, mengurangkan operasi DOM yang kompleks. Selain itu, ia juga menyediakan sokongan yang baik untuk teknologi ujian automatik bahagian hadapan.

Angular ialah rangka kerja bahagian hadapan untuk mencipta antara muka aplikasi tunggal Ia mempunyai banyak ciri teras seperti pengikatan data, perkhidmatan, arahan, suntikan pergantungan, dll. Ia mempunyai fungsi modul yang berkuasa dan mempunyai kelebihan arahan tersuai

Ciri:

  • Struktur aplikasi yang baik

  • 2. Pengikatan data dua hala

  • 3 Perintah

  • 4.Templat HTML

  • <.>
  • 5. Boleh dibenamkan, disuntik dan diuji

Kelebihan:

  • 1 Berkuasa dan kaya, ia datang dengan set arahan sudut yang sangat kaya.

  • 2. Ia adalah rangka kerja bahagian hadapan yang agak lengkap, termasuk perkhidmatan, templat, pengikatan data dua hala, pemodulatan, penghalaan, penapis, suntikan kebergantungan dan semua fungsi lain

  • 3 Sesuaikan arahan Selepas menyesuaikan arahan, anda boleh menggunakannya beberapa kali dalam projek.

  • 4.ng modulariti dengan berani memperkenalkan beberapa perkara daripada Java (suntikan kebergantungan), yang boleh menulis kod boleh guna semula dengan mudah, untuk pasukan pembangunan tangkas Sangat membantu.

  • 5.angularjs dibangunkan oleh gergasi Internet Google, yang juga bermakna ia mempunyai asas yang kukuh dan sokongan komuniti.

Kelemahan:

  • 1 Sudut mudah untuk dimulakan tetapi terdapat banyak konsep apabila anda mendalami dan ia lebih sukar untuk difahami semasa pembelajaran.

  • 2. Terdapat sangat sedikit contoh dokumentasi rasmi pada asasnya hanya bercakap tentang API, dan tidak ada contoh langsung daripada Google, atau tanya terus misko, pengarang sudut.

  • 3. Keserasian dengan IE6/7 tidak begitu baik, tetapi anda boleh menggunakan jQuery untuk menulis kod anda sendiri untuk menyelesaikan beberapa masalah.

  • 4. Terdapat beberapa tutorial amalan terbaik untuk penggunaan arahan Angular sebenarnya sangat fleksibel kod, seperti dalam js atau Berfikir seperti jQuery terdapat banyak operasi dom.

  • 5. Suntikan pergantungan DI memerlukan pengisytiharan yang jelas jika pemampatan kod diperlukan.

2. React

React, dihasilkan oleh Facebook, versi rasmi dilancarkan pada 2013, lewat daripada sudut Ia mengambil masa 4 tahun, tetapi terima kasih kepada VirtualDOM yang inovatif, ia mengatasi angularJS dari segi prestasi Setelah ia dilancarkan, ia menjadi sangat popular. Ia mempunyai banyak ciri, termasuk VirtualDOM, JSX, algoritma Diff, dll., menyokong sintaks ES6, dan menggunakan pengaturcaraan berfungsi Ambangnya lebih tinggi sedikit, tetapi ia juga lebih fleksibel, membenarkan lebih banyak kemungkinan pembangunan.

Ciri

  • 1. Reka bentuk deklaratif: React mengamalkan paradigma deklaratif, yang boleh menerangkan aplikasi dengan mudah.

  • 2. Kecekapan: React meminimumkan interaksi dengan DOM dengan mensimulasikan DOM.

  • 3. Fleksibel: React berfungsi dengan baik dengan perpustakaan atau rangka kerja yang diketahui.

Kelebihan:

  • 1 Pantas: Semasa proses pemaparan UI, React lulus operasi Mikro untuk dilaksanakan kemas kini tempatan kepada DOM sebenar.

  • 2. Keserasian merentas penyemak imbas: DOM Maya membantu kami menyelesaikan masalah merentas penyemak imbas. Ia memberikan kami API piawai, yang tiada masalah walaupun dalam IE8.

  • 3. Modularisasi: Tulis komponen UI modular bebas untuk program anda, supaya apabila terdapat masalah dengan satu atau beberapa komponen, anda boleh mengasingkannya dengan mudah.

  • 4. Aliran data sehala: Fluks ialah seni bina untuk mencipta lapisan data sehala dalam aplikasi JavaScript 5. Isomorphic, JavaScript tulen: Kerana perangkak enjin carian bergantung pada Dengan menyediakan bahagian pelayan respons daripada melaksanakan JavaScript, pra-pemarahan apl anda membantu dengan SEO. 6. Keserasian yang baik: Contohnya, RequireJS digunakan untuk memuatkan dan membungkus, manakala Browserify dan Webpack sesuai untuk membina aplikasi yang besar. Mereka menjadikan tugas yang sukar itu kurang menakutkan. Kelemahan: React itu sendiri hanyalah sebuah V, bukan rangka kerja yang lengkap, jadi jika anda mahukan rangka kerja yang lengkap untuk projek besar, anda pada asasnya perlu menambah ReactRouter dan Flux untuk menulis aplikasi yang besar.

3 Vue

Vue, sebagai rangka kerja terakhir yang dilancarkan (2014), menggunakan sudut dan sudut sebelumnya. React Ciri (seperti VirtualDOM, pengikatan data dua hala, algoritma perbezaan, atribut responsif, pembangunan komponen, dll.) dan pengoptimuman yang berkaitan telah dibuat untuk menjadikannya lebih mudah digunakan, lebih mudah untuk bermula dan kurang sesuai untuk pemula.

Ciri:

  • 1 Rangka kerja ringan

  • 2

  • 3. Perintah

  • 4. Plug-in

Kelebihan:

  • 1 Mudah: Dokumentasi rasmi sangat jelas dan lebih mudah dipelajari daripada Angular.

  • 2. Cepat: Kemas kini DOM dalam pemprosesan kelompok tak segerak.

  • 3. Komposisi: Karang aplikasi anda dengan komponen boleh diguna semula yang dipisahkan.

  • 4. Padat: ~18kbmin gzip, dan tiada kebergantungan.

  • 5. Berkuasa: ungkapan tidak perlu mengisytiharkan sifat boleh ditolak bergantung (sifat dikira).

  • 6. Mesra modul: Ia boleh dipasang melalui NPM, Bower atau Duo Ia tidak memaksa semua kod anda untuk mengikut pelbagai peraturan Angular, dan senario penggunaan adalah lebih fleksibel.

Kelemahan:

  • 1 Bayi Baru Lahir: Vue.js ialah projek baharu, tidak matang seperti sudut .

  • 2 Kesannya tidak begitu besar: Saya melayari google dan mendapati bahawa kepelbagaian atau kekayaan Vue.js adalah kurang daripada beberapa perpustakaan terkenal yang lain

  • 3. IE8 tidak disokong.

Pengetahuan lanjutan: Apakah perbezaan antara Vue.js dan rangka kerja lain?

1. Perbezaan daripada AngularJS

Mata yang sama:

kedua-dua arahan sokongan: arahan terbina dalam dan arahan tersuai.

Kedua-dua penapis sokongan: penapis terbina dalam dan penapis tersuai.

kedua-duanya menyokong pengikatan data dua hala.

Tidak menyokong penyemak imbas rendah.

Perbezaan:

1 AngularJS mempunyai kos pembelajaran yang tinggi, seperti penambahan ciri Suntikan Ketergantungan, manakala API yang disediakan oleh Vue.js sendiri agak mudah dan intuitif.

2. Dari segi prestasi, AngularJS bergantung pada penyemakan data yang kotor, jadi semakin ramai Pemerhati, semakin perlahan ia.

Vue.js menggunakan pemerhatian berasaskan penjejakan kebergantungan dan menggunakan kemas kini baris gilir tak segerak. Semua data dicetuskan secara bebas.

Untuk aplikasi besar, perbezaan pengoptimuman ini agak jelas.

2. Perbezaan daripada React

Mata yang serupa:

React menggunakan sintaks JSX khas, dan Vue.js juga disyorkan dalam pembangunan komponen Format fail khas .vue mempunyai beberapa konvensyen pada kandungan fail, dan kedua-duanya perlu disusun sebelum digunakan.

Idea utama adalah sama: semuanya adalah komponen dan tika komponen boleh disarangkan.

semuanya menyediakan fungsi cangkuk yang munasabah, membolehkan pembangun menyesuaikan keperluan mereka.

tidak mempunyai AJAX terbina dalam, Laluan dan fungsi lain ke dalam pakej teras, tetapi dimuatkan sebagai pemalam.

Menyokong ciri campuran dalam pembangunan komponen.

Perbezaan:

React bergantung pada DOM Maya, manakala Vue.js menggunakan templat DOM. DOM Maya yang digunakan oleh React akan melakukan semakan kotor pada hasil yang diberikan.

Vue.js menyediakan arahan, penapis, dsb. dalam templat, yang boleh mengendalikan DOM dengan sangat mudah dan pantas.

(Belajar perkongsian video: bahagian hadapan web)

Atas ialah kandungan terperinci Apakah tiga rangka kerja arus perdana untuk bahagian hadapan web?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn