Flux: Разделяем ответственность.
Всем привет! Часто в различных проектах я вижу очень большие компоненты с большим количеством логики по работе с сервером, хранилищами и.т.п. Недавно узнал о таком подходе как Flux.
Flux — это архитектурный паттерн, разработанный Facebook для управления состоянием в веб-приложениях, особенно в сочетании с React. Он основывается на однонаправленном потоке данных, что обеспечивает предсказуемость и упрощает отладку.
Основная идея Flux заключается в разделении ответственности между составляющими приложения. Хороший пример: мы подключаем библиотеку для управления состоянием(Mobx, Redux и.т.д) и доверяем ей бОльшую часть логики приложения(хранение глобального состояния, взаимодействие с сервером), а компоненты лишь подписываются и реагируют на изменения.
Таким образом мы минимизируем количество логики и кода в самих компонентах и доверяем нашему фреймворку только задачу рендеринга.
Основные компоненты Flux: • Диспетчер (Dispatcher): центральный элемент, который управляет потоком данных и получает действия от различных источников.
• Действия (Actions): объекты, описывающие изменения, которые должны произойти в состоянии приложения.
• Хранилища (Stores): хранят состояние приложения и реагируют на действия, обновляя свое состояние.
• Представления (Views): компоненты, которые отображают данные из хранилищ и обновляются при изменении состояния.
Прикрепляю полезные ссылки по этой технологии: https://habr.com/ru/articles/246959 https://metanit.com/web/react/5.1.php
Кстати, я нахожусь в поиске работы фронтенд-разработчиком. Если вам интересно, то напишите в личные сообщения:)
#flux #frontend #фронтенд #react #vue #angular #svelte #mobx #redux #архитектура #паттерн #веб