Базавы Рэайн супраць Vue

Час ляціць у школе Флатырон. Мы толькі што завяршылі 10 тыдзень, вывучаючы React Framework. React складаецца з JavaScript і JSX (спалучэнне ванільнага JavaScript і пэўнага сінтаксісу, падобнага на HTML). JSX - гэта крок папярэдняга працэсара, які дадае сінтаксіс XML у JavaScript. Можна дакладна выкарыстоўваць React без JSX, але JSX робіць React значна больш элегантным. Выкарыстоўваючы фрагменты JSX, вы можаце ствараць кампаненты, якія становяцца будаўнічымі блокамі вэб-прыкладання. Мне вельмі падабаецца дагэтуль, але мне было цікава пра плюсы і недахопы ў іншых кадрах, у прыватнасці Vue.

З дапамогай React, калі кампанент змяняе стан, ён запускае паўторнае рэндэрынг усяго кампанента. Для барацьбы з гэтымі паўторнымі візуалізацыямі вы можаце скарыстацца shouldComponentUpdate альбо React.PureComponent. Калі вы выкарыстоўваеце React.PureComponent замест React.Component, то ён рэалізуе павiнна аўтаматычнаComponentUpdate.

У React метад shouldComponentUpdate павінен выкарыстоўвацца толькі ў якасці аптымізацыі прадукцыйнасці. Вы б скарысталіся метадам ShouldComponentUpdate, каб паведаміць React, калі на выхад кампанента не ўплывае бягучае змяненне стану альбо рэквізіту.

У Vue сістэма Vue ведае, якія кампаненты трэба паўторна адлюстраваць пры змене стану. Гэта адбірае непатрэбнае паўторнае адлюстраванне кампанента.

Найбольш відавочныя адрозненні ў React і Vue ёсць у сінтаксісе

Як ужо гаварылася раней, React складаецца з JavaScript і (неабавязкова) JSX для стварэння кампанентаў, якія становяцца будаўнічымі блокамі прыкладання. Vue таксама можа выкарыстоўваць функцыі рэндэрынгу і падтрымліваць JSX, але яны таксама прапануюць шаблоны па змаўчанні. Дапушчальны HTML дзейнічае як шаблон у Vue. Гэта дазваляе нават пачаткоўцам працаваць з дапамогай кода і дадаваць да яго, бо чытаць і пісаць больш натуральна. Кампаненты Vue можна ахарактарызаваць альбо прэзентацыйнымі, альбо лагічнымі. Для лагічных кампанентаў рэкамендуецца выкарыстоўваць шаблоны для прэзентацыйных кампанентаў і функцыі візуалізацыі з JSX.

Стылізацыя CSS у React у асноўным выконваецца як CSS у JS. Метад стылю па змаўчанні ў Vue падобны на тэгі стыляў у кампанентах з адным файлам. Код кладкі ў кампанентах аднаго файла знаходзіцца ў тым жа файле, што і код кампанента.

У Рэага і Vue ёсць таксама падобныя рысы

Для вялікіх прыкладанняў React і Vue прапануюць добрыя рашэнні. Redux можа выкарыстоўвацца React для кіравання станам і рэагавання на дзеянні карыстальніка. Vue таксама можа выкарыстоўваць Redux, але ёсць нешта званае Vuex, што з'яўляецца іншай больш канкрэтнай сістэмай кіравання дзяржавай, спецыяльна для Vue. Яшчэ адно падабенства паміж React і Vue заключаецца ў іх выкананні. Яны вельмі падобныя, таму перавагі і недахопу ў гэтым няма.

Рэактыў ці Vue больш папулярныя?

Бібліятэкі Vue для кіравання дзяржавай абнаўляюцца асноўнай бібліятэкай, у той час як React выкарыстоўвае сваю суполку для гэтага. Праўда, Рэакт больш папулярны, таму ён можа ісці ў нагу з праблемамі. Апытанне StackOverflow паведаміла, што React з'яўляецца трэцяй па папулярнасці бібліятэкай сярод распрацоўшчыкаў. Як паведамляе LinkedIn, распрацоўшчыкі React больш запатрабаваныя, чым Vue з суадносінамі 5: 1.

Калі вы хочаце пачаць праект для React або Vue, вам пашанцавала!

І Vue, і React прапануюць стартары праекта. React - гэта дадатак create-react, у Vue ёсць CLI Generator. Адным з недахопаў для пачынаючых праектаў React з'яўляецца тое, што ён прапануе толькі адзін шаблон пры ўмове, што вы робіце SPA (дадатак на адной старонцы), у той час як Vue прапануе вялікую разнастайнасць.

На мой погляд, у React ёсць больш стромкая крывая навучання, чым Vue. Для Vue вам трэба проста паставіць адзін тэг сцэнарыя, каб пачаць будаваць невялікія прыкладанні. З React вы павінны ведаць JavaScript (ES2015 +) і JSX, каб мець магчымасць пачаць.

Як і ў любой рамцы, выкарыстоўвайце тое, што мае для вас найбольш сэнс (альбо ўсё, што ваша кампанія выкарыстоўвае!) Абодва маюць плюсы і мінусы, а таксама ёсць шмат іншых рамак, такіх як Angular або AngularJS.

Якія інструменты інтэрфейсу вы аддаеце перавагу для сваёй працы ў нашы дні? Шчаслівае кадаванне!

Крыніцы: