Is there a way to set a priority to more important queries?

[eddiechan0101]

I have bunch of apis to fetch.

Some of them affects to the important components rendering (which should be high) , and others are kind of prefetching in background for the next screen or whatever (low).

It's like current screen is stuck because some of high queries are not handled, waiting for low queries are done.

I need to put a priority to render current screen immediately.

Is there any option or workaround to set priority? Something like:

const highQuery = useQuery({
    queryKey: ['users'],
    queryFn: fetchUsers,
    priority: 10
});

const lowQuery = useQuery({
    queryKey: ['userScores'],
    queryFn: fetchUserScores,
    priority: 2

[TkDodo]

It's like current screen is stuck because some of high queries are not handled, waiting for low queries are done.

I fail to see why firing a query would make the screen stuck? You can render your UI while lowQuery is still in pending state if you choose to do so...

[eddiechan0101]

Thank you for your reply. 🙏

And Sorry, for my bad explanation.
I have to say "still loading" instead of "stuck"

Query orders are random, but lowQuerys are much more than highQuerys in quantity.
So some of highQuerys are at the rear of queue and it can take comparatively much time to be shown.

I want important queries at the frontside of queue with proper probability algorithm.

I really like this stunning package and it has good potential to be more.

[TkDodo]

So some of highQuerys are at the rear of queue and it can take comparatively much time to be shown.

which queue? All queries are processed in parallel. If you have some queueing on your backend, you have to handle it there.