Is that possible to cache widget to resue?

I am using getbody() method to get app body and the getbody() return a Widget <br>If i change the variable ct count the the getbody() will return different widget and each widget is stroied in Listqueue<MyPage()> <br> if i set variable ct value 1 it return widget from my list at position 1 and if i set variable ct 2 then it will return corresponding widget .

<br>But the problem is in each widget i am doing an api call but when i reuse that widget it is again calling the API call and why this is calling after first time nd how to stop calling api when i am reusing the widget
<br><br>

ListQueue<Page> page1, page2, page3, page4;
  _AppFramePageState() {
   
    page1 = ListQueue();
    page1.add(Page(widget: AppHomePage(), title: "Home Page"));
    page2 = ListQueue();
    page2.add(
        Page(widget: TemplesListing(), title: "Temple listing"));
    page3 = ListQueue();
    page3.add(Page(widget: AppCommunities(), title: "Communities"));
    page4 = ListQueue();
    page4.add(Page(widget: AppVideos(), title: "Media"));
  }

<br>

If user click on cart button from toolbar then i will add more value to page1 list and if user click on back button then i will remove last item from page1 list
<br>

     Widget getBody() {
 //This code is solved my 50% issue but renaming 50% is there. How to solve this issue?
        return IndexedStack(
          index: _selectedIndex,
          children: <Widget>[
          page1.last.widget,
          page2.last.widget,
          page3.last.widget,
          page4.last.widget
        ],);<br>
//This is the code i used first time 
        switch (_selectedIndex) {
          case 0:
            return page1.last.widget;
          case 1:
            return page2.last.widget;
          case 2:
            return page3.last.widget;
          case 3:
            return page4.last.widget;
        }
      }

<br><br>

class Page{
  Widget widget;
  String title;
  Page({this.title,this.widget});
}

<br><br>
<br><br>Note: All widgets are StatefulWidget

In general, it's not possible to reuse the widgets.

You can manually reuse the cache widget by comparing old and new state of the widgets. Which is very lengthy and i don't think you should follow it.

There are many State management architecture patterns like Provider, BLOC, MOBX etc. to manage your app in a great way. They are used to improve your app performance and decrease widget re-renders, manage data flow across the whole app etc.

One more thing you can do to make your Stateful widgets more impactive by using the const keyword whenever possible.

like for following widget ,

Column(
        children: <Widget>[
          // Widget 1
          Center(child: Text(dynamic_value),),
          // Widget 2
          Container(
            child: const Center(
              child: const Padding(
                padding: const EdgeInsets.all(10),
                child: Text("Hello"),
              ),
            ),
          ),
        ],
      )

In above example for Widget 1, you can't use "const keyword" as it depends on "dynamic_value".

While for Widget 2, you can use the "const keyword" which will be useful if your build method gets called again then "Center", "Padding" & "Text" widgets will be not called again as they are declared as constant widgets.