Удалить полпроекта: как мы переписывали MobX‑сторы на React Query в большом Next.js‑проекте

Привет. Я Дима Рагозин, фронтенд-разработчик в KTS . Эту статью я хочу начать с предыстории. Полтора года назад на проекте для одного крупного клиента мы получили задачу — ускорить главную страницу. К тому моменту в кодовой базе уже жили два отдельных фронтенд-приложения под две разные платформы — CSR-версия (Client Side Rendering) и SSR‑версия (Server Side Rendering), — а MobX‑сторы все время жизни проекта разрастались вместе с функциональностью. Каждый новый экран приносил еще один класс (а то и несколько), еще кучу связей, и в какой‑то момент мы стали замечать снижение воспринимаемой скорости приложения, избыточные HTTP‑запросы, сложности с поддерживаемостью и другие проблемы, которые становились критичнее по мере роста проекта. В статье я расскажу о том, как мы шаг за шагом перевели такие сторы на React Query, сократили код вокруг запросов на ≈50 % и практически избавились от повторных GET‑ов. Попутно поведаю о наших граблях и поделюсь советами по миграции.

https://habr.com/ru/companies/kts/articles/935086/

#mobx #React #React_Query #Nextjs #Frontend #Управление_состоянием #Оптимизация_производительности #ssr

Удалить полпроекта: как мы переписывали MobX‑сторы на React Query в большом Next.js‑проекте

Привет. Я Дима Рагозин, фронтенд-разработчик в KTS . Эту статью я хочу начать с предыстории. Полтора года назад на проекте для одного крупного клиента мы получили задачу — ускорить главную страницу. К...

Хабр

@tanstack/react-query + react typescript

Хотелось бы рассказать как я использую @tanstack/react-query в своих проектах при построении архитектуры приложения

https://habr.com/ru/articles/843340/

#react #reactjs #typescript #react_query #@tanstack/reactquery #reactquery #frontend #frontendразработка #frontend_development #frontend_react

@tanstack/react-query + react typescript

Хотелось бы рассказать, как я использую @tanstack/react-query в своих проектах при построении архитектуры приложения. Все приложения, которые в той или иной мере имеют связь с сервером требуют...

Хабр

[Перевод] Преобразования данных с React Query

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

https://habr.com/ru/articles/810211/

#reactjs #react_query #преобразование_данных

Преобразования данных с React Query

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

Хабр
Reactで無限スクロールを実装する。(Handson,react-query,react-infinite-scroller) - Qiita

はじめに前回のライブラリ利用版です。react-queryとreact-infinite-scrollerを組み合わせた実装です。https://twitter.com/kkfactory070…

Qiita
Announcing TanStack Query v5 | TanStack Blog

About one year ago, we announced the TanStack Query v5 roadmap, and the whole team has been working hard on that version ever since. So we're super happy to announce that today is the day: After 91 alpha releases, 35 betas and 16 release candidates, TanStack Query v5.0.0 is finally here! 🎉 v5 continues the journey of v4, trying to make TanStack Query smaller (v5 is ~20% smaller than v4), better and more intuitive to use. One of the main focus points for this release was around streamlining and simplifying the APIs we offer: