Route refreshing on redux store change and clicking continuously on Link

Question

I am using react: 16.6.0 and react-router-dom: 4.3.1 with redux setup

ReactDOM.render(
<Provider store={store}>
    <Router basename={process.env.PUBLIC_URL}>
        <App />
    </Router>
</Provider>, document.getElementById('root'));

here is my implementation of routes

<Suspense maxDuration={1500} fallback={<BundleLoading />} >
                                <Switch>
                                    <Route exact path='/' component={() => <Dashboard />} />
                                    <Route exact path='/settings' component={() => <Settings />} />
                                    <Route path='**' component={() => <PageNotFound />} />
                                </Switch>
                            </Suspense>

when I click on Link component continuously it re-render the component on every click. also whenever my redux store changes(changing theme to light/dark ) than also it re-renders. I have other apps that are implemented the same way but those are working as expected.

i am clueless about this, please help I can update more code if that helps

Answer 1

My guess that a fat arrow function is the reason. Try to switch like this <Route path="subroute1" component={SubRoute1} />