The Teams List page currently uses the functional widget _buildTeamHeader to display the list of visible teams, which in turn calls getData to query backend API via getTeams and populate a teamWidgetList of Team cards to display. Since _buildTeamHeader is within the widget tree, the API is called on every refresh and causes to page to become slow when there are a large number of teams.
Possible refactor fixes
[ ] Change _buildTeamEntry from a functional widget to a stateless class widget that takes in the Team object and builds a formatted team Card to be displayed
[ ] Wrap the ListView.builder that builds _buildTeamEntry cards in a FutureBuilder calling the teams list API endpoint and providing the list of teams in its snapshot . Might consider using a RefreshIndicator widget to re-call the API on pull down and refresh the list of teams so the endpoint isn't called every time. For reference: https://stackoverflow.com/questions/65682460/how-to-use-refreshindicator-to-update-futurebuilder-state
Description
The Teams List page currently uses the functional widget
_buildTeamHeaderto display the list of visible teams, which in turn callsgetDatato query backend API viagetTeamsand populate ateamWidgetListof Team cards to display. Since_buildTeamHeaderis within the widget tree, the API is called on every refresh and causes to page to become slow when there are a large number of teams.Possible refactor fixes
_buildTeamEntryfrom a functional widget to a stateless class widget that takes in theTeamobject and builds a formatted teamCardto be displayedListView.builderthat builds_buildTeamEntrycards in aFutureBuildercalling the teams list API endpoint and providing the list of teams in itssnapshot. Might consider using aRefreshIndicatorwidget to re-call the API on pull down and refresh the list of teams so the endpoint isn't called every time. For reference: https://stackoverflow.com/questions/65682460/how-to-use-refreshindicator-to-update-futurebuilder-stateDesigns
No response