← Назад к проектам

Панель аналитики доставок

Единое окно для диспетчеров логистической платформы: статусы курьеров, задержки, тарифы и SLA в реальном времени.

Роль
Ведущий фронтенд
Период
2024 — 2025
Команда
6 человек
Стек
React, TypeScript

Задача

Диспетчеры отслеживали доставки в нескольких таблицах и мессенджерах, из-за чего реакция на задержки занимала в среднем 20–25 минут. Требовалось собрать мониторинг в одном интерфейсе, который выдерживает десятки тысяч строк и обновляется без перезагрузки страницы.

Решение

Спроектировали SPA на React и TypeScript. Данные получаем через TanStack Query с инкрементальными обновлениями, для тяжёлых таблиц использовали виртуализацию. Ключевые метрики вынесли в дашборд на Recharts, а статусы заказов обновляются по WebSocket.

  • Виртуализированные таблицы до 50 000 строк без потери плавности.
  • Гибкие фильтры и сохранённые представления для смен диспетчеров.
  • Единый центр уведомлений о нарушении SLA.
  • Экспорт отчётов в CSV и автоматическая рассылка сводок.

Результат

  • Среднее время реакции на задержку сократилось с 25 до 9 минут.
  • Ручные отчёты заменены автоматическими сводками.
  • LCP удерживается ниже 2 секунд при полной таблице.

Стек

  • React
  • TypeScript
  • TanStack Query
  • Recharts
  • WebSocket
  • react-window
  • Vite