QUESTION: Why didn't you use React Router

[ahmetkuslular]

Why didn't you use React Router? This is the first time I've seen a React project without React Router. 😅

[artem-malko]

Hi, thanks a lot for your question)

First of I have to say, React Router is a great project. But there several problems. Or there were several problems, cause now it has version number six. But the last time, when I was looking on it — it was 5 alpha or something)

So, problems.

1. React router unsafe!

Let's imagine you have such Route:

<Route path="/user/:id" element={<User />}>

If you follows the docs of React router, you have to do something like this to get that id param:

function User() {
  const params = useParams();
  const userId = params.id;
  ...
}

But, you have no idea, if id is really existed? Or you could mistype like const userId = params.ib; — and there is no warnings, no errors =)

Yeah, v6 has useMatch, but it is so strange, that you have to copy the path from <Route /> to component inside it. But yes, it's much safer.

In my project you have quite strong types (https://github.com/artem-malko/react-ssr-template/blob/main/src/application/pages/shared.ts#L44C3-L46C3) You just can not apply newsItemPageRouteConfig if it does not satisfy '/news/:id'.

And it was just one example of type problem)

2. Loader concept

Actually, it is not bad idea, but IMHO quite strange limitation. I can't understand the idea, that every Route can have only one source of data. Especially when we have suspense and react-query, which works pretty ok with it.

3. How to navigate safely?

To open another page by using imperative API like navigate from useNavigate, or <Link /> I have to develop a specific storage for all of my supported URLs.

4. The speed

It's not so important, but just a nice bonus)

Actually, I'd like to discuss it, if you have an experience with React Router, especially with v6.

[artem-malko]

Oh, I forgot about one important thing. React Router v5 doesn't support renderToPipepableStream. It was a huge blocker for me

[ahmetkuslular]

I actually haven't had any experience with React Router v6. Currently, I'm working on a legacy project and essentially rewriting it. Since it's going to be a large and complex project, it sometimes makes more sense to lean on reliable packages. However, I haven't had the chance to dive deep into the structure of this template, so I wanted to ask you about your preferences :)

It's good to learn that v5 doesn't support renderToPipeableStream, which is beneficial for me. I was considering using v6 in the new project. I think it would make sense to do some research and conduct some experiments here.

Thank you very much for your response

[artem-malko]

@ahmetkuslular I have to correct myself, v5 had some problems with renderToPipeableStream on the alpha stage) May be they've done something and now it works) But other points are still valid, even for v6.

But, React Router has a big advantage — the community, which can help you with problems and questions.