search

JustFly1984 / react-google-maps-api

React Google Maps API
MIT License
1.81k stars 438 forks source link

GoogleMap rerender on setSate in functionnal component #2832

Open frankboris opened 3 years ago

frankboris commented 3 years ago

Hi all, I just created an example app using react and google map api. Everything works fine for the http queries. But the map reloads when I use setSate to save the result. Here is the link to test and see the errors: https://google-distance.herokuapp.com Github repository link for source code: https://github.com/frankboris/google-map-app

OS: windows

node --version 7.20.0

react version 17.0.2

@react-google-maps/api version 2.2.0

JustFly1984 commented 3 years ago

please provide minimal reproduction on codesandbox.io

frankboris commented 3 years ago

Here is my codesandbox.io link

https://codesandbox.io/s/eloquent-hopper-16k2e

JustFly1984 commented 3 years ago

@frankboris In your case it is easy - you need to isolate each state in separate component, and use React.memo on each component export. Also use eslint with eslint-perf plugin, it will help you to figure out performance issues.