Хватит неправильно использовать localStorage в React
localStorage кажется простым решением, пока приложение не начинает расти. useEffect, useState, рассинхронизация между компонентами, проблемы с SSR и отсутствие типизации быстро превращают его в источник багов и хаоса.
В этой статье я показываю, почему localStorage стоит рассматривать как external store, а не как обычный state React, и как правильно работать с ним с помощью useSyncExternalStore. Мы шаг за шагом усложняем реализацию: добавляем строгую типизацию, реактивность между компонентами и вкладками, поддержку sessionStorage, валидацию данных и SSR-совместимость — без Redux и лишней инфраструктуры.
Материал основан на реальном коде и практических сценариях. В конце я показываю финальную архитектуру и готовую библиотеку, которую можно использовать в продакшене, если вам нужен безопасный и предсказуемый доступ к localStorage в React-приложениях.
