Какво е React? - Как работи - Как да го използвам - Употреби и предимства

Съдържание:

Anonim

Преглед на React

React е една от JavaScript с библиотеки с отворен код. Използва се за изграждане на интерактивни потребителски интерфейси. Това е ефективна, декларативна и гъвкава библиотека. Той се занимава с V т.е. компонента View на контролера на модела-View (MVC). Това не е цяла рамка, а само библиотека на фронта. Тя позволява създаването или създаването на сложни потребителски интерфейси, като се използват изолирани и малки парчета код, известни като компоненти. Основното предимство на компонентите е, че промяната, направена на всеки един компонент, не засяга цялото приложение.

Това е разработено от софтуерния инженер Джордан Уолк, работещ във Facebook. Фейсбук го разгърна към новинарския си ефир и го използва за подобряване на потребителския им интерфейс. Тя беше оповестена публично през май 2013 г.

Използва се специално за приложения за една страница. Целта му е да бъде мащабируема, проста и бърза. Това може да се използва в комбинация с различни JavaScript рамки или библиотеки като Angular JS.

Характеристики на React

Нека разгледаме основните и най-взискателни характеристики на React:

1. JSX

JSX означава JavaScript XML. Това е разширение към синтаксиса на езика на JS. Той предоставя начин за изобразяване на компоненти, използвайки синтаксис, подобен на HTML. React използва JSX за писане на неговите компоненти. Той също може да използва чист JavaScript, но предпочита JSX. Използва се от Babel, предпроцесор за преобразуване на текста, подобен на HTML, намерен в JavaScript файлове, в стандартни JS обекти. HTML кодът може да бъде вграден в JavaScript, за да направи HTML код по-лесен и разбираем и подобрява работата на JavaScript и да направи приложението стабилно.

2. Модел на обект на виртуален документ

React направи кеш на структурата на паметта на паметта, след това изчислява разликата между предишния DOM и новия и след това актуализира извършените промени или мутации. Той актуализира само промените, а не цялото приложение. Това помага за увеличаване на скоростта и производителността и намалява загубата на памет.

3. Заверяемост

Реактивните изгледи се използват като функции на състоянието, в което състоянието определя поведението на компонента. Следователно можем да направим промени в състоянието и след това да го предадем на изглед ReactJS и след това да определим изхода и действията, функциите и събитията. Това прави тестването и отстраняването на грешки лесно.

4. SSR

Тя означава „Възпроизвеждане от страна на сървъра“. Тя позволява предварително да се представи първоначалното състояние на компонентите от страна на сървъра. Браузърът може да визуализира без да чака всички JavaScript да бъдат изпълнени или заредени. Това прави уеб страниците да се зареждат по-бързо. Той помага на потребителя да вижда уеб страниците, дори когато React все още изтегля JavaScript, свързва събития или създава виртуален DOM в задния ред.

5. Еднопосочно обвързване на данни

Той позволява еднопосочен поток от данни, т.е. еднопосочно обвързване на данни. Поради тази функция, има по-добър контрол върху приложението. Това прави състоянието на приложението да се съдържа в конкретни магазини и затова всички останали компоненти остават свободно свързани. Това повишава гъвкавостта и ефективността на приложението.

6. Простота

JSX файловете правят приложението просто и разбираемо. Стандартният JavaScript може да се използва за кодиране, но използването на JSX го улеснява. Няколко метода на жизнения цикъл и неговият компонент базиран подход улесняват обучението и изпълнението.

7. Крива на обучение

В сравнение с други рамки, кривата на обучение на React е ниска. Начинаещите, които имат основен език за програмиране, също могат да се научат да реагират лесно.

Как работи?

Когато екипът на разработчиците на Facebook изграждаше приложения от страна на клиента, той откри, че Document Object Model (DOM) е бавен. За да стане по-бързо, в React се реализира виртуален DOM, който представлява дърво представяне на DOM в JavaScript.

React работи на Virtual DOM. Той не манипулира документа в браузъра, след като са направени промените, той прави промени във виртуалния DOM. Когато виртуалният DOM е напълно актуализиран, той актуализира DOM на браузъра по възможно най-ефективния начин. Виртуалният DOM на React остава изцяло в паметта. Той представлява DOM на уеб браузъра, така че когато е написан компонент React, се прави виртуален компонент, който е евтин за създаване, който се превръща в DOM от React. React е направен да се използва в браузъра, но с Node.js, може да се използва и със сървър.

Как да го използваме?

Използването на React е просто, включително включването на JS файл в HTML. Нека видим използването на React чрез прост пример:

Код:


First React Code



ReactDOM. render( First Code, document. querySelector ('#application')
);



First React Code



ReactDOM. render( First Code, document. querySelector ('#application')
);



First React Code



ReactDOM. render( First Code, document. querySelector ('#application')
);

Изглежда малко трудно, но е лесно да се приложи и научи.

Кой използва Реагира?

React става все по-популярен на днешния пазар и неговите функции помагат на големите компании да подобрят своя опит и интерфейси.

Интернет гиганти като Facebook, Instagram, Netflix, New York Times, Yahoo Mail, Khan Academy, WhatsApp, Vivaldi Browser, Codecademy и Dropbox използват React по един или друг начин. Sberbank на Русия също използва React o за разработване на уебсайта на тяхната банка.

Много уебсайтове като github.com, reddit.com, outlook.live.com, bitbucket.org, account.godaddy.com и много други също използват React.

Предимства на React

  • SEO приятелски
  • Лесно е да се създават тестови случаи за потребителски интерфейс.
  • Реагиращите компоненти могат да бъдат използвани повторно.
  • Гарантира по-бързо изобразяване.
  • Отстраняването на грешки е лесно.
  • Лекота на миграцията.
  • Повишава производителността.
  • Писането на компоненти е лесно.
  • Стабилен код.
  • Има полезен набор от инструменти за програмисти.
  • React native е наличен за разработване на мобилни приложения
  • Лесен за научаване.
  • Подобрява производителността.

Недостатъци на React

  • Високи темпове на развитие.
  • Лоша документация.
  • Допълнителни SEO караница.
  • Само ориентиран към изгледа.
  • Библиотека с големи размери на React.
  • Крива на обучение за начинаещи.
  • Изисква ръчна обработка на промените в данните.
  • Нуждаете се от повече код в някои случаи.

Препоръчителен член

Това е ръководство за това какво е Реагирайте. Тук обсъдихме концепциите, дефиницията и разбирането с предимството и недостатъка на React. Можете да разгледате и другите ни предложени статии, за да научите повече -

  1. Какво е Agile програмиране?
  2. Какво е мултитройно четене в java?
  3. Използване на Raspberry Pi
  4. Какво е JMS? | Определение | обяснение
  5. React Native vs React
  6. Създаване на бутони за стил в React Native