Redux никогда не работал в React

Значимый прорыв формирует отрасль ИИ: AlekseiVolkov 5 минут назад Redux никогда не работал в React Средний 8 мин 3 ReactJS * JavaScript * TypeScript * Мнение потому что нельзя просто взять redux и начать использовать в React. Необходима некая «react-redux» библиотека. А в чём тогда смысл талдычить, что «Redux works with any UI layer»?

На фронт-собесах часто спрашивают: «Как хранить состояние в крупных react-проектах? » Отвечают заученное: можно сделать редуктор в контексте через useContext и useReducer. Приходишь домой, думаешь: «Сейчас подключу разок, чисто пройти путь, подучиться».

Технические детали

Ставишь redux в свой проект, грамотно всё подключаешь: actions, reducers, events. В итоге — консоль обновляется; интерфейс мёртв. 🗿В прошлой статье я вывел Redux из конечных автоматов и закончил обещанием: «этот switch-case уже можно вынести в отдельную библиотеку».

Сейчас попробую вынести и проверить два мифа:Миф №1. Redux как-то по-особому хранит состояние: надёжно и без перерисовок. Не то что тупое замыкание в JS или контекст в React!

Redux — независимая библиотека. Её можно включить в любой проект и «просто» использовать. Выносим switch-case в библиотекуРедуктор (reducer) — функция переходов конечного автомата — остался с прошлой статьи.

Отраслевые последствия

Проигрыватель, три состояния, переходы между ними:// Чистая функция переходов: старое состояние + действие = новое состояние. // Ей не нужны ни DOM, ни библиотеки — поэтому она работает где угодно function редуктор(состояние = начальноеСостояние, действие) { // Поле называем «тип»: настоящий Redux требует type, но это наша поделка switch (действие. тип) { case "ИГРАТЬ": ; case "ПАУЗА": return состояние.

статус === СОСТОЯНИЯ. ПАУЗА } : состояние; case "СТОП": ; default: // Неизвестное действие не должно ломать автомат return состояние; } } Чтобы вынести это в отдельную «библиотеку», нужно придумать, где хранить состояние. Необходимо некое хранилище (store).

Требования короткие:хранить состояние,обрабатывать действия (action),сообщать об изменениях. Последний пункт — шаблон «Наблюдатель», тот же, что в статье про Jotai. function createStore(редуктор, начальноеСостояние) { // Вся «магия» хранения Redux — это переменная в замыкании.

Событие, по словам экспертов, усилит конкуренцию в сфере ИИ.