[React] APIProvider in root component or specific component?

[peterboccia]

Good morning community,

after a while of using this good library, I was wondering on the choice of the previous teams to put the APIProvider inside the Index.tsx instead of the component that is showing the map in one page of the whole application.

Scenario: a react application with tons of pages and components. Just two pages are using and showing a google map (wrapped in a MapComponent). One of this page it's often hit at least once by an user during a visit.

Question: Move the provider into the Map component to improve the performance of the entire application?

Thank you in advance to all 🙏

[peterboccia]

I don't know if it was a stupid question so no response at all 😭

[mrMetalWood]

I would say when you expect a user in a typical session to hit one of your maps it can make sense to load the api (via the APIProvider) in a parent component. In this case it would improve the performance because it is not in the same component as the map and the map could show immediately when the route is hit since the API is already loaded. The API loading happens asynchronously, so it does not block other stuff as well.

So it does't really "cost" anything to load the Maps API. I would only wait with the API loading if for some reason it is important that as few kilobytes as possible are downloaded.