plainRoute objects versus JSX in react-router

Question

With react-router, you can use plainRoute objects or jsx to define routes.

I don't understand the advantage of of plainRoute objects, especially in the context of using redux. In many redux tutorials, including the one created by redux's author, plainRoutes objects are recommended over JSX, but I haven't seen an explanation of why.

JSX seems more succinct and has more documentation and examples so I'd like to use that.

Answer 1

With React Router v2/3, the <Route> components aren't actually components. If you look at the render method in Route.js , you'll see that it isn't rendering anything. Instead, the <Route> components are used to create a routes object. This is done when the <Router> in its call to createTransitionManager is first mounted by calling the createRoutes function.

Objects vs JSX is mostly a personal decision. I wouldn't say that defining your routes using as an object is better than using JSX, but if you realize that the routes are just going to be converted into an object anyways, using the JSX abstraction can feel unnecessary.

At the end of the day, you should just go with whichever version you are most comfortable with.