Библиотека React: особенности, перспективы, ситуация на рынке труда

JavaScript ~30 минут 13

React — одна из самых популярных библиотек для фронтендеров. Ее используют для создания современных интерфейсов. Расскажем подробнее, что такое React и как он работает.

Зачем нужен React
Как работает React
Преимущества и недостатки React
Конкуренты React.js
- Angular
- Vue
Востребованность React.js
Стоит ли учить React: мнение экспертов о развитии и перспективах библиотеки

React — JavaScript-библиотека для работы с пользовательскими интерфейсами (UI), которую создали разработчики Facebook. Библиотеку начали использовать на сайте этой социальной сети в 2011 году. А в 2013 году Facebook открыл исходный код React.

С помощью React разработчики создают веб-приложения, которые изменяют отображение без перезагрузки страницы. Благодаря этому сайты быстро реагируют на действия пользователя, например, заполнение форм, применение фильтров, добавление товаров в корзину и так далее.

React применяют для отрисовки компонентов пользовательского интерфейса. Также библиотека может полностью управлять фронтендом. В этом случае React используют с библиотеками для роутинга и управления состоянием, например, Redux и React Router.

Зачем нужен React

Фронтенд современных сайтов пишут на JavaScript. Этот язык программирования позволяет создавать интерактивные интерфейсы. То есть реагирующие на действия пользователей.

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

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

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

React — самая популярная библиотека для JS, его применяют на многих проектах.

Разработчики используют React, выбирая из его возможностей то, что может пригодиться для конкретной задачи.

Где используют React:

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

Как работает React

Расскажем о ключевых особенностях библиотеки, которые обеспечили ей популярность.

Декларативный подход

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

Проще говоря, разработчик при создании кода указывает, как должен себя повести интерфейс при получении определенных данных или наступлении событий.

Библиотека позволяет оптимизировать процесс разработки за счет того, что программисту не нужно описывать подробности. React.js самостоятельно будет обновлять элементы, ориентируясь на условия. Задача программиста — грамотно описать их.

Использование этого подхода позволяет создавать приложения на React максимально быстро.

Компоненты

Главная сущность в этой библиотеке — компоненты. Они представляют собой отдельные элементы на странице. Каждый компонент в React — инкапсулированный, то есть содержит в себе весь комплект данных и методов, необходимых для работы.

Инкапсуляция позволяет хранить состояние элементов в них самих. Это делает их изолированными и самостоятельными.

Эта особенность React предусматривает постоянное переиспользование элементов. Один и тот же элемент можно применить на другой странице или в другом разделе сайта.

Преимущества такого подхода очевидны — разработчику не нужно заново писать код для элемента. А отсутствие сложных зависимостей между ними упрощает отладку.

Рендеринг компонентов

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

У библиотеки React есть специальный механизм для управления рендерингом всех компонентов на странице. То есть создания визуального представления элементов.

Для этого React сохраняет в кэше копию DOM-дерева. Она изменяется быстрее оригинала, что позволяет приложению так же быстро обновлять страницу.

Например, если после какого-либо действия страница нуждается в перезагрузке, React будет работать не с реальной структурой, а с копией. Что позволит пользователю быстрее увидеть результат.

За счет этого в приложениях, написанных на React, изменения вносятся практически мгновенно — ждать несколько секунд не нужно.

Этот процесс основан на обновлении DOM по частям. В памяти остаются две копии: старая и новая. При необходимости React сравнивает две версии и меняет только ту часть, в которой что-то изменилось, а не весь DOM целиком.

За счет этого достигается оптимизация загрузки.

Передача свойств компонентов

В React реализовали нисходящий поток данных. Компоненты могут передавать данные и свойства только сверху вниз, от родительских к дочерним.

Такая иерархия позволяет быстро понять, откуда поступила информация, упрощая нахождение ошибок.

Также в этой библиотеке нельзя изменять свойства напрямую. Такую возможность реализуют только через callback-функции. Это участки кода в виде параметра функции, которые передают от одного компонента другому.

За счет этого все данные, свойства и события идут сверху вниз. Свойства не меняются после создания, а как бы пересоздаются. Это обеспечивает такой системе стабильность.

Hooks

Изначально в React использовали классы — тип компонентов, включающих в себя методы управления состоянием. Сейчас вместо этого используют хуки. Это функции, которые как крючки можно прицепить к состоянию метода или элемента.

Это позволяет отказаться от применения классов. Вместо этого при изменении состояния автоматически выполняют заданные функции.

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

JSX

В React реализовали собственное расширение для JavaScript. С его помощью можно описывать элементы HTML-кодом на этом языке программирования. В итоге разработчики получают возможность менять структуру DOM, используя привычный JavaScript.

На практике это выглядит так: программист пишет компонент с HTML, но тот становится объектом на JavaScript с соответствующими возможностями. Это не всегда просто для новичков, но удобно для опытных разработчиков.

Developer Tools

Это специальный набор инструментов в виде расширения для браузера. Developer Tools в React помогают в деле проверки и отладки написанного кода.

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

Преимущества и недостатки React

Разберемся в преимуществах и недостатках этой библиотеки — как технических, так и с точки зрения обучения.

Технические достоинства:

Скорость загрузки

Виртуальный DOM позволяет приложениям на React загружаться гораздо быстрее аналогов. Такие сайты становится более отзывчивыми и хорошо реагируют на изменения.

Быстрая разработка

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

Минимизация ошибок

Использование этой библиотеки позволяет забыть о многих рутинных операциях. Это уменьшает влияние «человеческого фактора»: в готовых решениях сложнее ошибиться. За счет этого использование React на проекте упрощается отладка и уменьшается количество багов.

Если рассматривать React как технологию для изучения, его плюсы:

Распространенность

Сейчас он занимает первое место среди самых популярных инструментов для разработки интерфейсов. Из ближайших конкурентов — фреймворки Vue.js и Angular. Но о них мы поговорим ниже. В настоящее время библиотеку активно используют на проектах в крупных компаниях и найти работу со знанием React относительно легко.

Крупное комьюнити

Изучать React удобно в силу хорошей задокументированности и большого сообщества. Эту библиотеку используют тысячи опытных разработчиков, поэтому начинающим будет легко найти ответ на вопрос или попросить о помощи.

Большая экосистема

Библиотека React регулярно обновляется. А за счет крупного комьюнити есть множество энтузиастов, которые создают свои собственные решения. Их можно применять совместно с React. Речь идет и о дополнительных библиотеках, и об инструментах.

Недостатки у этой библиотеки тоже есть:

Сложность изучения

React отличается собственной архитектурой на основе компонентов. Новичкам бывает сложно овладеть всеми концепциями этой библиотеки. Большое внимание при разработке на React уделяют улучшению производительности при помощи виртуального DOM. А это потребует перестройки мышления.

Технология JSX также часто вызывает затруднение: разработчикам бывает тяжело собирать воедино язык разметки и JavaScript.

Высокий порог входа

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

Используя фреймворк, можно брать готовую структуру и изменять ее под нужды проекта, а библиотека предполагает собственную структуру и меньший объем готовых решений.

Таким образом, от программиста с React требуется больше квалификации.

Конкуренты React.js

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

Angular

Этот фреймворк выпустила компания Google. Его основная цель — создание одностраничных приложений на JavaScript и TypeScript. Angular — наследник AngularJS, разработанного в 2009 году. Но это другой фреймворк и обратной совместимости у них нет.

Он обладает принципиально другой архитектурой и даже написан на другом языке — TypeScript, а не на JavaScript.

Главное преимущество Angular — модульность. Этот фреймворк позволяет собирать приложения на основе готовых компонентов — модулей. Их пишут и тестируют изолированно, что добавляет надежности.

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

Angular применяют для создания крупных корпоративных приложений. Его преимущество в обилии инструментов для стандартных задач. Однако это может быть и ограничением. В Angular много «навязанных» решений и меньше гибкости по сравнению с React.js. Его редко используют для MVP и небольших проектов.

К тому же Angular как технология гораздо объемнее и для его изучения потребуется больше времени.

Vue

Vue.js — относительно молодой фреймворк для создания пользовательских интерфейсов. Его отличительная особенность — представление, которое изменяется по мере изменения модели.

Vue используют для создания быстрых сайтов, небольших блогов и нагруженных веб-приложений. Этот фреймворк подходит для внедрения в уже существующие проекты. На нем часто переписывают отдельные модули, а не всю структуру целиком.

Vue, по сравнению с аналогами, отличается простотой и низким порогом входа. Его сможет без труда освоить даже начинающий веб-разработчик. Vue применяют для MVP и средних приложений.

Этот фреймворк обеспечивает высокую скорость разработки и масштабируемость. Пока что он распространен меньше, чем Angular и React, но развивается более динамично.

Многие предпочитают делать проекты на этом фреймворке из-за более простого найма разработчиков. Освоить Vue несколько проще.

Востребованность React.js

Согласно исследованию портала Stackoverflow, React занимает второе место в списке самых популярных фреймворков и технологий. Немногим превосходит его только Node.js, который адаптирует JavaScript для серверной разработки.

А в технологиях для фронтенда React уверенно побеждает всех конкурентов.

Если посмотреть по статистике загрузок, то эта библиотека также уверенно лидирует, оставляя позади двух самых сильных конкурентов: Vue и Angular.

Что касается статистики hh.ru, на момент написания статьи:

React фигурировал в 3473 вакансиях.
Angular — в 1339.
Vue — 1977.

Стоит ли учить React: мнение экспертов о развитии и перспективах библиотеки

Специально для этой статьи опытные разработчики поделились мыслями о перспективах React, целесообразности изучения этой библиотеки и инструментах для управления состоянием и альтернативных библиотеках и фреймворках. Эксперты ответили на такие вопросы:

По данным LogRocket, доля React на рынке UI-фреймворков и библиотек составляет около 60%. Как вы считаете, в обозримом будущем эта ситуация может существенно измениться?
Провокационный вопрос: фреймворк или библиотека, который обойдёт React в будущем, уже существует или он только должен появиться?
Какие новые возможности React лично вы ждёте больше всего? Когда они могут появиться?
Для управления состоянием в более или менее сложных React-приложениях чаще всего используется Redux. Появятся ли альтернативы Redux, которые станут популярными и общепринятыми способами управления состоянием?
Вопрос, ответ на который заинтересует новичков: стоит ли изучать React, чтобы устроиться на работу фронтенд-разработчиком в 2020 или 2021 году?

Сергей Сова: React далеко не простой, но изучив его, можно не бояться фронтенд-разработки

Сергей Сова

О популярности

Сейчас появляется все больше фреймворков на рынке, и этот факт сам по себе снижает долю React. Думаю, что эта библиотека будет постепенно уходить из предпочтений разработчиков. Хоть и на данный момент это самое лучшее и популярное решение.

О библиотеке или фреймворке, который обойдёт React в будущем

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

О новых возможностях

Я жду, когда React научится батчить апдейты от сторонних событий. Например, от событий браузера, вроде клика по кнопке, двойной вызов хука setState или аналогичного, вызовет только один рендер. Но если двойной setState будет вызван по таймауту, то будет два рендера. Это не круто.

Помимо этого, хочется tree-shaking. Слишком уж много весит react-dom. Я не хочу «платить» за то, чего не использую.

О Redux и других инструментах управления состоянием

Redux изжил себя. Насчёт общепринятых или популярных — не знаю. Но я сам, а также в рабочих проектах с командой, полностью перешёл на управление состоянием с помощью Effector. Он поддерживает SSR, TypeScript, не привязан к фреймворку. Обеспечивает декларативные связи между сущностями, что помогает визуально отсматривать логику.

Я уже очень давно хотел отделить логику от вью. То есть ровно так, чтобы логика жила своей жизнью, независимо от вью. Компонент просто отправляет события в логику, а та сама решает, что делать с событиями, а вью лишь рендерится от стейта. Получаем React — та самая функция от состояния.

Effector позволяет мне реализовать это все без бойлерплейта, десятков различных методов, классов и декораторов. Лишь обычный JS/TS.

О целесообразности изучения

Да, стоит. Это самое популярное и гибкое решение на данный момент. Да, React далеко не простой, но изучив его, можно не бояться фронтенд-разработки. В отличие от фреймворков, React использует экосистему JavaScript, а не выдумывает полностью свою. Хоть и очень похож на фреймворк.

Об эксперте

Сергей Сова, Frontend Team-Lead at REDMADROBOT. Frontender, Podcaster, Rustacean. Telegram, «ВКонтакте».

Анна Селезнёва: начинать обучение надо не с фреймворка, а с чистого JavaScript

Анна Селезнёва

О популярности

На мой взгляд, ситуация будет меняться, но несущественно, если говорить о цифрах. State of JavaScript наглядно показывает, что лидеры на рынке фреймворков постоянно меняются, и в любой момент могут появиться конкурентоспособные новички.

История успеха Svelte говорит о том, что в ближайшем будущем может появиться что-то новое, что заберет часть аудитории у React. Скорее всего, React еще долгое время будет если не на первом месте, то определенно в топе фреймворков.

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

О библиотеке или фреймворке, который обойдёт React в будущем

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

Не стоит забывать о том, что за любым фреймворком стоит комьюнити, и пока оно растет и развивается, развиваться будет и фреймворк. А если кто-то из главных игроков прекратит поддержку, это может привести к плачевным результатам.

О новых возможностях

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

Учитывая эти факторы, уже завтра может появиться что-то новое, что позволит улучшить проект. Но, честно говоря, это даже пугает. Ведь мне тут же захочется отрефакторить код и использовать возможности, а на это требуется время, которого у фронтенд-разработчика обычно не хватает.

О Redux и других инструментах управления состоянием

Новые инструменты появятся. Я бы даже сказала, что уже сейчас они есть. С одной стороны, появление хуков заставило взглянуть на управление состоянием под другим углом. С другой стороны, клиентские реализации для GraphQL (например, Apollo) позволяют некоторым проектам обходиться без Redux. Также не стоит недооценивать MobX, который развивается и в будущем может предложить неплохую альтернативу.

О целесообразности изучения

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

Как раз недавно на митапе MinskJS, который я помогаю организовывать, соорганизатор митапов MinskCSS и MinskJS Саша Шинкевич рассказывала доклад на тему «Как перестать выбирать фреймворки и начать жить». Мне кажется, это хорошая иллюстрация современного фронтенда. Выбирайте фреймворк не ради фреймворка, а для достижения хорошего результата.

Об эксперте

Анна Селезнёва, Lead Frontend Developer @ Spiral Scout.

Артём Арутюнян: на React уже написано слишком много, глобально бизнесу не выгодна его депопуляризация

Артём Арутюнян

О популярности

В обозримом по меркам фронтент-разработки будущем доля React существенно не упадёт. На нём уже написано слишком много, глобально бизнесу не выгодно его депопуляризация.

О библиотеке или фреймворке, который обойдёт React в будущем

Думаю, такого инструмента ещё нет. Но это мне как идеалисту хочется чего-то принципиально нового. Опыт Vue показывает, что может быть иначе.

О новых возможностях

Я знаю много приложений, которые реально станут быстрее при включении конкурентного режима. Хочется, чтобы это случилось быстрее, эта задача не такая сложная, как может показаться. Также хочется, чтобы в React появилась более явная система реактивности, хуки мне не нравятся.

О Redux и других инструментах управления состоянием

Это сложный вопрос, но серебряной пули, думаю, не будет. Redux Toolkit может ещё продлить жизнь Redux, но, честно говоря, это выглядит как серьезный костыль, и часть очень важных проблем он все ещё не решает. Reatom выглядит логичной эволюцией и я, конечно, надеюсь, что он отнимет часть рынка. При этом интересными выглядят и альтернативные подходы вроде graphQL-driven или grammarly/focal, думаю, они тоже будут развиваться.

Recoil также займет часть рынка, скорее всего в приложениях с небольшим сроком жизни (на пару лет). В чем-то крупном — не думаю.

Возможно будет ещё оптимизирован в плане DX и обезмагивания MobX, и его будут ждать новые высоты — автор все ещё активно им занимается.

XState мне кажется очень нишевым, как Rx и Effector.

В общем, подходов много, каждому своё, при этом я смогу точно сказать, что нам ещё предстоит встретить что-то новое и, возможно, нас ждёт более выраженная дисперсия, а не появление стандарта такой же популярности, как сейчас/раньше Redux.

О целесообразности изучения

Точно стоит, индустрия в лице бизнеса ещё долго будет нуждаться в разработчиках на React.

Об эксперте

Артём Арутюнян, автор библиотеки Reatom.

Роман Макаров: важно не забывать, что React — всего лишь инструмент, а по-настоящему ценно знание фундаментальных вещей

Роман Макаров

О популярности

В обозримом будущем, кажется, крупных изменений не стоит ждать. Во-первых, из-за инертности — очень уж много написано на React и вокруг него. Во-вторых, инструмент объективно удобный.

О библиотеке или фреймворке, который обойдёт React в будущем

Мне кажется, это будет инструмент на базе React, но с большим количеством возможностей из коробки, то есть полноценный фреймворк: со встроенным стейт-менеджментом, роутингом, стандартизированным подходом к работе с формами, переводами и тому подобное.

О новых возможностях

Лично мне хочется дальнейшего развития create-react-app как инструмента для быстрого старта. Разработчики пошли по пути кастомных темплейтов вместо конфигурирования через cli при создании приложения. Это, конечно, уже лучше, чем создавать и поддерживать собственные бойлерплейты, но всё ещё недостаточно для того, чтобы считать CRA промышленным стандартом.

Кроме того, API хуков пока кажется неким промежуточным решением, поверх которого должна быть построена более удобная система работы с состоянием и методами жизненного цикла.

О Redux и других инструментах управления состоянием

Redux в чистом виде — это скорее концепция, чем инструмент для промышленной разработки. Сейчас, кажется, он вообще не используется в приложениях уровнем выше учебных.

За последние годы вокруг Redux возникла целая экосистема библиотек с мидлварами и хэлперами для удобной работы, а квинтэссенцией стала библиотека redux-toolkit. Из существующих альтернатив лично мне нравится библиотека mobx-state-tree, построенная поверх Mobx. И если для небольших приложений эта библиотека выглядит избыточной, то на проектах с большим количеством логики в тандеме с хуками она прекрасна.

О целесообразности изучения

Я думаю, что эта библиотека еще долгое время будет присутствовать в большинстве объявлений о поиске фронтенд-разработчиков, поэтому мой ответ — да, её стоит изучать. Но важно не забывать, что это всего лишь инструмент, а по-настоящему ценно знание фундаментальных вещей — операционных систем, сетей, структур данных, алгоритмов, концепций и парадигм.

Об эксперте

Роман Макаров, фронтенд-разработчик в Хекслете.

Сергей Головин: чем опытнее разработчик, тем менее важной для него становится конкретная библиотека, фреймворк и даже язык программирования

Сергей Головин

О популярности

Как мне кажется, сейчас нет совершенно никаких предпосылок к радикальному изменению положения дел на рынке разработки веб-приложений. Все лидирующие фреймворки и библиотеки поделили между собой сообщество разработчиков, заняли определенные ниши и год от года лишь незначительно меняют соотношение долей на «графике популярности». Тем не менее, есть несколько факторов, которые действительно могли бы что-то изменить.

Первый и основной — очередной технологический сдвиг. Так было, когда «эпоха jQuery» закончилась в связи с переносом бизнес-логики с сервера на клиент, что, в свою очередь, закономерно произошло из-за значительного увеличения производительности, как компьютеров в целом, так и браузеров в частности, существенного роста скорости доступа к сети интернет, а также из-за запроса со стороны бизнеса на перенос сложных технических решений в веб без потери отзывчивости, присущей десктоп-приложениям.

В ближайшее время чего-то подобного не предвидится, но, безусловно, нельзя полностью исключать возможность внезапного появления принципиально новой технологии, которая повлечет за собой очередной эволюционный виток или даже техническую революцию. Например, всё чаще и чаще подход SPA подвергается критике, звучат призывы к возврату бизнес-логики на сервер с сохранением отзывчивости, присущей SPA-приложениям. Одним из наиболее интересных и стабильных решений подобного плана является Phoenix Framework, который, тем не менее, пока не стал популярным и остается довольно нишевым продуктом.

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

О библиотеке или фреймворке, который обойдёт React в будущем

Оба варианта возможны. Но мне кажется, что второй вариант более правдоподобен. При этом нельзя исключать, что библиотекой, которая обойдет React в будущем, может стать условный React 2. Так или иначе, прогнозы по этому поводу делать очень сложно, но хотелось бы верить, что решение, которое станет популярнее React, будет чем-то принципиально новым, иначе это просто очередная смена шила на мыло.

О новых возможностях

На мой взгляд, вместо добавления чего-то нового команде React стоит сфокусироваться на доработке и стабилизации старого. Переработка методов жизненного цикла и добавление хуков привели к тому, что сейчас есть несколько разных способов делать похожие вещи, при этом best practices на этот счет в сообществе пока еще не сложились. Соответственно, мы имеем два параллельных мира: мир разработчиков, предпочитающих классы, где все еще есть неоднозначная замена componentWillReceiveProps на getDerivedStateFromProps, и мир разработчиков, предпочитающих функциональные компоненты и хуки, имеющие перегруженный и местами запутанный API.

Добавление каких-то нововведений в библиотеку может фрагментировать сообщество ещё сильнее и повысить порог входа в React. Это сложно считать движением в правильном направлении, поэтому, как мне кажется, стоит сначала довести до ума всё, что еще не доведено, а уже потом только думать над добавлением чего-то нового.

О Redux и других инструментах управления состоянием

Такие решения уже появились. Например, те же MobX и Effector являются отличными production-ready альтернативами. Конечно, нельзя сказать, что они настолько же популярны, как Redux, и это, возможно, является сейчас их основным недостатком, из которого уже вытекают более конкретные. Например, сообщество этих библиотек значительно меньше, чем у Redux, из-за чего может быть сложнее найти готовые решения или ответы на возникшие вопросы. Банальное, но существенное преимущество Redux — огромное количество статей и гайдов по связке React + Redux.

Безусловно, есть много опытных разработчиков, для которых отсутствие готовых решений и малочисленное сообщество не являются минусом, так как они вполне могут сами написать необходимые библиотеки или дописать недостающую этим state-менеджерам функциональность, а также найти ответ на свой вопрос, прочитав исходники этих библиотек. Но не стоит забывать, что есть очень много разработчиков, которые просто не видят смысла переходить на другие библиотеки, понимая, что те недостатки, которые, безусловно, есть в Redux, не перевешивают для них его достоинств. Так или иначе монополии Redux уже не существует, разные команды по разным причинам выбирают разные решения, и выбор у них, безусловно, есть.

О целесообразности изучения

Если отвечать коротко, то да, стоит. React сейчас очень популярен, соответственно, вакансий, где требуются его знания, очень много. Но стоит отметить, что само по себе изучение React не должно являться самоцелью, важнее изучать принципы и основные концепции, лежащие в его основе. Чем опытнее разработчик, тем менее важной для него становится конкретная библиотека, фреймворк и даже язык программирования.

Опытный разработчик, который много лет работал с Vue, довольно быстро может переключиться на проект, где используется React. Это возможно, потому что он понимает, на каких принципах базируются данные библиотеки, видит похожие абстракции и пересечение концепций этих библиотек. Поэтому на самом деле, хоть React и вполне хорош для старта карьеры, выбор любой другой современной библиотеки или фреймворка будет не менее хорошим.

Об эксперте

Сергей Головин — ведущий разработчик/технический руководитель CSSSR.

Анна Волкова: много компаний с современным стеком технологий используют React, поэтому эту библиотеку стоит учить

Анна Волкова

О популярности

Да, думаю, что в какой-то момент ситуация может измениться, но это будет не очень быстро, как с jQuery. Когда появилась эта библиотека, она заняла большую нишу. Но ведь jQuery еще используют где-то, также будет и с React.

О библиотеке или фреймворке, который обойдёт React в будущем

Пока, наверное, реальной альтернативы не существует. Я думаю, что если бы уже существовала такая библиотека или фреймворк, то она бы также быстро и много стала использоваться, как React.

О новых возможностях

Жду от React стабильности и совместимости.

О Redux и других инструментах управления состоянием

Ответила бы тут также, как и на второй вопрос. Очень много проектов написано с использованием связки React/Redux, поэтому пока Redux вне конкуренции.

О целесообразности изучения

Да, безусловно стоит, так как много компаний с современным стеком технологий используют React.

Об эксперте

Анна Волкова, фронтенд-разработчик в «Альфа-банке».

Максим Лебедев: такой же крутой экосистемы, как у React, на горизонте не видно

Максим Лебедев

О популярности

По-моему мнению, в IT, а тем более в такой динамичной развивающейся его части, как технологии для веба и всё, что с ним связано, «обозримым будущим» можно называть период времени максимум в 2-3 года. React дает действительно неплохое видение, как нужно делать интерфейсы и веб в целом (с учетом всей той экосистемы, которая образовалась вокруг него). И то, что он предлагает, в достаточной степени гибко, производительно и совместимо с браузерами. Да есть интересные вещи типа Polymer Project, да и много чего ещё, что может давать какие-то плюсы, например, в производительность, но это требует каких-то дополнительных усилий, чтобы понять, как это правильно готовить. Такой же крутой экосистемы, как у React, именно с точки зрения порога вхождения, гибкости, производительности на горизонте «обозримого будущего» пока не видно, по-моему.

О библиотеке или фреймворке, который обойдёт React в будущем

Честно говоря, для меня это не является провокационным вопросом :-) Сами создатели React считают его библиотекой, и я склонен с ними согласиться. Да, React с легкостью можно назвать MV-фреймворком, который берет на себя довольно большую часть ответственности за архитектуру вашего приложения. Но степень этого охвата в то же время не такая всеобъемлющая, как у Angular, Vue, Ext — они в своей официальной документации дают вам полное видение того, как должна выглядеть ваша архитектура, и вполне обоснованно называют себя фреймворками. С другой стороны, вокруг React образовалась существенная экосистема, которая в большинстве случаев говорит вам, как нужно делать React-приложение. И вот если взять React + экосистема, то можно увидеть уже кучку фреймворков. Вы сами можете сделать еще один фреймворк на React, если вам это нужно.

О новых возможностях

Мне нравится их идея сделать в React 17 механизм, позволяющий из коробки рендерить некие заглушки в момент асинхронной загрузки данных.

О Redux и других инструментах управления состоянием

По-моему, этих конкурентов уже и так полно, вы не находите? Да, все они — некая вариация на тему Flux(читай MVC)-подобных архитектур c однонаправленным потоком данных, но их действительно много. Redux, MobX, Cerebral, xstate, и я думаю, это даже не половина всего, что есть в современной экосистеме. Да, Redux наиболее популярен, наверное, но совсем не значит, что он общепринят и безальтернативен на данный момент. Если же имеется в виду что-то принципиально новое, то я даже не знаю, скорее всего ничего лучше вариаций на тему MVC всё-равно не придумаешь, особенно если в качестве View у тебя «реакт головного мозга».

О целесообразности изучения

Однозначно стоит. Но нужно понимать, что самое важное — не знать все тонкости React, а понимать принципы, на которых он построен, что лежит в основе его архитектуры. Также не стоит забывать про базовые знания касательно JS и веба в целом. То есть если вы научились в хуки на React, но не понимаете, зачем в JS нужны прототипы, что такое замыкание, не представляете same origin policy и для чего оно нужно — это повод задуматься и изучить вопрос.

Об эксперте

Максим Лебедев, тимлид команды интеграций в Miro.

Алексей Резвов: знание React делает любое резюме весомее

Алексей Резвов

О популярности

Мои личные наблюдения подтверждают тренд на снижение доли React на рынке. В первую очередь за счет увеличения доли Vue, к тому же растут и другие фреймворки вроде Aurelia, Svelte. Существенного изменения ждать не стоит, скорее всего React продолжит, постепенно замедляясь, терять долю рынка.

О библиотеке или фреймворке, который обойдёт React в будущем

Это вполне возможно, однако рынок разработки фронтенд-приложений ещё довольно непредсказуем, я бы не стал загадывать.

О Redux и других инструментах управления состоянием

Redux ещё долго будет существовать на рынке просто в силу размера уже разработанной базы кода и количества освоивших его разработчиков. Далеко не все любят учиться, поэтому используют однажды освоенные технологии от проекта к проекту.

О целесообразности изучения

Ради востребованности на рынке труда, безусловно, эту библиотеку учить стоит. Шансы на то, что в интересующей вас компании будут применять React, очень высоки. По моему мнению, React чаще выбирают в компаниях, где он уже используется в качестве основного инструмента в одном или нескольких проектах.

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

Сложно вообще представить специалиста, который освоил какие-то альтернативные фреймворки, при этом не применив ни разу что-нибудь из большой тройки — React, Vue, Angular. Определенно можно сказать, что знание React делает любое резюме весомее, даже если работать с React не предполагается вовсе.

Ещё хочу акцентировать внимание на усилении тенденции использования TypeScript. Она есть как на фронтенде, так и на бэкенде, чему лично я рад. Таким образом, стоит уделить внимание изучению фреймворков именно в связке с TypeScript.

Об эксперте

Алексей Резвов, организатор разработки программного обеспечения.

Анастасия Уминская 29 февраля 2024