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

Я сижу на react, точнее на next.js и нет, я не делаю бекнд на js, next for SSR only.

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

пройдемся по списку

Перед тем как я начну, закину пару чужих мыслей на тему, понимание которых отличают хороших архитекторов и инженеров

Из ТРИЗ

Какая лучшая делать в танке ? – та которой нету но ее функция которой выполняется.

Из Талеба

Простое — это более сложное.

Фраза «простое — это более сложное» означает, что истинная простота требует глубокого понимания и синтеза, что сложнее, чем создание хаоса или усложнение.

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

• Redux – зачем это так сложно то а... зачем они тут построили самолет когда надо было открыть дверь.

• Mobx – вы че там такое употребляете а ? Тоже самое это плохое решение оно создает очень много когнитивной нагрузки без мазы.

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

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

const [state, setState] = useState(initialState)

Jotai - сейчас вы увидите что такое просто и понятно.

const [state, setState] = useAtom(initialState);

Разница том что initialState не дефолтное значение, а объект менеджера который мы описываем в отдельном месте, если хотите в сторе

import { atom } from 'jotai';
const counter = atom(0);

Готов пользуемся и мозги не делаем)

Nuqs – это НЕ general purpose state manager, это url стетйт менеджер.

const [name, setName] = useQueryState('name')

Тоже думаю что понятно все.
Нужен для параметров которыми нужно делится через ссылку, например пик размера и цвета в интернет магазине.

Офтоп

• Signals - preactjs это классно, но авангард не для всех, для тех кто любит создавать issues

• recoiljs – к сожалению депркейтед, но когда я его увидел я был так глуп, и подумал год без комитов - хороший знак наверное работает как ак47. я никогда так не ошибался ))