Tab switch calls the data interface too frequently, how to optimize it so as not to waste the interface?

for example, in the tab switching page like the following, the method I use now is to click the current option to call the API, for example, click all to call, click to withdraw and call once, but this will waste the interface. What I want to do now is to call all at once, do I need to write three functions? If I call it in a loop, I don"t think so, because there is also a click paging function to find a simple method

.

function () {
    console.log(1)
}

clipboard.png


there is no need to struggle with this kind of problem. If you request 3 data at a time, but the user only looks at one of the tab, is the request of the other two tab a waste? The
front end can handle it appropriately. When switching tab, you can make a request if you enter the same tab, for the first time, and you can not make a request according to logic if you enter the same tab, for the second time.
the so-called waste I understand is the pressure on the database, which can be solved through data caching, or even using clustering solutions, using more machines to share the pressure.
is that just my opinion?

Menu