Что такое Реакт?

React, также известный как React. JS — это библиотека JavaScript. Разработанный Facebook в марте 2013 года, в настоящее время это самый популярный фреймворк/библиотека JavaScript. Он используется для создания быстрых пользовательских интерфейсов. React можно использовать для разработки одностраничных приложений, а с React Native, который является фреймворком React, мы можем создавать гибридные мобильные приложения. React упрощает разработку одностраничных приложений, поскольку это базовая библиотека компонентов с магией Virtual DOM. Также это простая библиотека для изучения. Обычный разработчик JavaScript может изучить эту библиотеку за 1-2 месяца. Чтобы узнать ценность React, сначала нам нужно взглянуть на одностраничное приложение, виртуальный DOM.

Одностраничное приложение против многостраничного приложения:

Одностраничное приложение (SPA):

Одностраничное приложение или SPA — это веб-приложение, которое работает на одной странице. Без повторного рендеринга всего DOM оно динамически обновляет другой компонент приложения с помощью виртуального DOM. Это экономит время и данные, потому что нет необходимости перезагружать все файлы css, js и HTML, они просто загружаются при начальной загрузке. Теперь получение SPA раздвигает новые границы веб-разработки, многие Framework и библиотеки могут сделать SPAкак React. JS, Ангуляр, Вью. JS… Google, Facebook и Udemy используют одностраничное приложение в своей сети.

Многостраничное приложение (MPA):

Теперь давайте поговорим о многостраничном приложении (MPA). Оно работает по старому традиционному принципу. Вам нужно отобразить все css html и javascript, чтобы внести какие-либо изменения или перейти на другой маршрут/страницу. Каждый запрос к серверу повторно отображает DOM с каждым прикрепленным к нему файлом. Эти приложения больше и больше, чем SPA, потому что им нужно больше данных. Из-за отображения каждой отдельной страницы каждый раз, когда они могут иметь много уровней. пользовательского интерфейса. MPA подходит для Ecomerce, потому что у него много категорий и контента, вам нужно много полных отдельных маршрутов для вашего интернета, так что это может быть лучшим выбором.

Виртуальный DOM против DOM:

Виртуальный DOM не поставляется с React. Virtual — это метод рендеринга для рендеринга простого плоского объекта JavaScript в элементе DOM из памяти. React использует этот метод, чтобы все происходило быстро, потому что он легкий и хранится в памяти, поэтому нет необходимости визуализировать новый необработанный компонент DOM. Виртуальный DOM никогда не визуализирует реальный элемент DOM и не нацеливается на какой-либо элемент DOM. Всякий раз, когда состояние любого компонента изменяется, он соответствует этому компоненту из памяти и выбирает только измененную его часть и визуализирует его объект. Этот метод также известный как Shadow DOM.

Реагировать против Углового:

React и Angular похожи с точки зрения их компонентной архитектуры. Но есть большая разница: Angular — это фреймворк с полным решением, а React — это библиотека. React заботится только об отображении представления и о том, что представление синхронизировано с последним состоянием. При создании приложения с помощью React нам нужно использовать разные библиотеки для работы с ним. Но когда дело доходит до Angular — это полный пакет, в нем есть все, что вам нужно для разработки, но вы также связаны с этим. В React это неплохо, потому что мы можем выбрать то, что хотим использовать для выполнения задачи, из любой библиотеки, но в Angular нам нужно подождать пока не появится следующая версия с нашим решением.

Библиотека против фреймворка:

Ключевое различие между библиотекой и фреймворком — «инверсия управления». Когда вы вызываете метод из библиотеки, вы контролируете ситуацию. Но с фреймворком управление перевернуто: фреймворк зовет вас.

Библиотека — это просто набор определений классов. Причина заключается в простом повторном использовании кода, то есть в получении кода, который уже был написан другими разработчиками. Классы и методы обычно определяют определенные операции в конкретной предметной области.

Во фреймворке уже есть весь поток управления, и есть куча предопределенных белых пятен, которые вы должны заполнить своим кодом. Фреймворк обычно более сложный. Он определяет скелет, где приложение определяет свои собственные функции для заполнения скелета.