Достаточно сложно представить современное react-приложение без роутинга компонентов.
Сразу обозначим — мы не будем рассматривать стандартный функционал роутеров: парсинг строки, работа с URL параметрами, обозначение активного раздела, наличие редиректов и распознавание несуществующего роута.
Мы будем рассматривать только различия и интересные особенности альтернативных роутеров, а так же их общую статистику использования:
👨💻— Используется в репозиториях GitHub
⭐— Количество звезд на GitHub
⬇️— Скачиваний в NPM
Reach Router
👨💻46,781 ° ⭐5,880 ° ⬇️956,541
Reach Router описывается с помощью JSX, умеет распознавать вложенные JSX компоненты, как внутренние пути. Роутер не привязан к глобальному провайдеру, поэтому компонент <Router /> может быть вызван в любой части приложения.
Так же предусмотрено: path c RegEXP, относительные ссылки, асинхронная загрузка, cервер-сайд рендеринг.
Сайт: https://reach.tech/router
Router 5
👨💻464 ° ⭐1,463 ° ⬇️15,590
Router5 использует популярные подходы для инициализации: HoC, Hook, Render prop. Основной пакет разработан на ванильном JS, поэтому подходит для роутинга в Node.JS окружении.
Роутер инициализируется с помощью 2-ух объектов: структуры и конфига. У роутов есть возможность указать уникальные имена, в будущем это существенно облегчит вам рефакторинг.
Так же роутер поддерживает middleware и асинхронную подгрузку компонентов.
Сайт: https://router5.js.org
Universal Router
👨💻2307 ° ⭐1,316 ° ⬇️12,802
Universal Router достаточно минималистичен, вес — 5.4 кб. В его внутренней работе достаточно просто разобраться.
Роутер инициализируется императивно (при помощи объекта) и декларативно (в виде функций). Отлично подойдет если вам нужен роутер с базовым функционалом. Так же он послужит достойной основой для вашего собственного роутера.
Сайт: https://www.kriasoft.com/universal-router/
React Router
👨💻719,866 ° ⭐37,782 ° ⬇️ 7,715
React Router попрежнему самый популярный роутер. В нем есть всё, что вам может понадобиться. Документация фреймворка является одной из подробнейших. Роутер успел обрасти всевозможным функционалом, в том числе излишнем.
Сейчас React Router разделяется на 4 основных пакета — react-router, react-router-dom, react-router-native, react-router-config.
Для разработки в react-среде можно использовать react-router-dom.
Сайт: https://reacttraining.com/react-router/
Заключение
Особой конкуренции в мире React-роутинга пока не наблюдается. Это связано с тем, что React Router удовлетворяет все основные базовые потребности разработчиков, поддерживает 2 основных подхода реализации (JSX, конфиг в виде объекта), имеет тщательно проработанную документацию.
В процессе изучения темы, так же были изучены:
Pilot — https://github.com/RubaXa/Pilot
Router.js — https://github.com/tildeio/router.js
Navigo — https://github.com/krasimir/navigo
Vaadin Router — https://vaadin.com/router
Вышеуказанные роутеры различаются подходами к написанию пакета и описанию API. Некоторые из них были созданы в рамках больших компания, например, Pilot — был написан в Mail.Ru и успешно не поддерживается с прошлого года.
