What's causing a double render?

[b-89]

Hi,

I noticed recently when debugging in our app, that sticking console.log at the top of a page component would output twice to the console. We don't really have a complex setup with our Routes:

<React.StrictMode>
  <BrowserRouter>
    <Routes>
      <Route path="/" element={<App />}>
        <Route index element={<Home />} />
        <Route path="/page-1" element={<Page1  />} />
        <Route path="/page-2" element={<Page2  />} />
      </Route>
    </Routes>
  </BrowserRouter>
</React.StrictMode>

Is there something I'm doing or haven't done properly with this setup?

Thanks,
Brian

[b-89]

So after some more digging, it appears that it's caused by <React.StrictMode>.

supasate/connected-react-router#193 (comment)

Not sure why when I tried googling the other day, I didn't notice this topic. It could be useful to mention this in the official documentation that this happens.