#javascript #reactjs #react-redux #react-hooks
#javascript #reactjs #реагировать-redux #реагирующие хуки
Вопрос:
Я работаю над созданием панели мониторинга в React, и в настоящее время у меня есть компонент страницы, содержащий все состояния и управляющий запросами к серверному API. Я рассматриваю рефакторинг для извлечения запросов из компонента страницы — с целью сохранения его чисто презентационным — и перемещения всего api и логики данных внутри компонентов виджета панели инструментов.
Хотя я считаю, что это должно быть лучшей практикой, меня беспокоят определенные недостатки. Одна из проблем, которую я предвижу, заключается в том, что запросы на выборку необходимо будет запоминать, иначе некоторые данные, совместно используемые несколькими компонентами, будут запрашиваться из API несколько раз. Еще одна проблема, которую я предвижу, заключается в том, что для каждого компонента требуется подключение к хранилищу состояний redux, и я не уверен в накладных расходах на использование ‘connect’ по сравнению с передачей реквизитов из объекта useState.
В целом, я в основном ни о чем не беспокоюсь? Это лучший способ подойти к этому? Или я должен сохранить некоторую логику в компоненте страницы, если это уменьшает количество вызовов api / соединений redux?
Комментарии:
1. Чтобы устранить проблему, связанную с «несколькими запросами API» для одних и тех же данных, вы могли бы ознакомиться с библиотекой «swr». Это React-хук, который имеет встроенное кэширование и массу отличных функций. Вы можете использовать перехват в нескольких компонентах, но фактическая выборка данных произойдет только один раз, и все они получат выбранные данные. swr.vercel.app . Я использовал этот хук в приложении, которое я сейчас создаю, и это довольно удивительно.
2. Крис — Я искал библиотеку кэширования, и это именно то, что мне было нужно. Спасибо!
3. @Chris это отличный комментарий. Спасибо, что поделились!
Ответ №1:
Оказалось, что использование библиотеки swr работает отлично. Я бы посоветовал всем, кому необходимо запоминать запросы API, сделанные разными компонентами, использовать библиотеку swr с общей строкой конечной точки для обеспечения кэширования.