Refetching and polling in GraphQL - Step-by-Step Execution

Concept Flow - Refetching and polling

Start Query

↓

Fetch Data from Server

↓

Display Data

↓

Refetch Triggered?

No→Wait

↓

Fetch Data Again

↓

Update Display

Back to Wait↓

Polling Enabled?

No→Wait

Yes↓

Wait Poll Interval

↓

Fetch Data Again

↓

Update Display

↩Back to Wait

The flow starts with fetching data, then displays it. It waits for either a refetch trigger or polling interval to fetch and update data again.

Execution Sample

GraphQL

query GetUsers {
  users {
    id
    name
  }
}

// Poll every 5 seconds
useQuery(GetUsers, { pollInterval: 5000 })

This GraphQL query fetches user IDs and names, and polls the server every 5 seconds to update the data.

Execution Table

Step	Action	Data Fetched	Display Updated	Next Wait
1	Initial fetch	[{id:1, name:'Alice'}, {id:2, name:'Bob'}]	Yes	Wait for refetch or poll
2	Poll interval reached	[{id:1, name:'Alice'}, {id:2, name:'Bob'}]	Yes	Wait for refetch or poll
3	Refetch triggered manually	[{id:1, name:'Alice'}, {id:2, name:'Bob'}, {id:3, name:'Carol'}]	Yes	Wait for refetch or poll
4	Poll interval reached	[{id:1, name:'Alice'}, {id:2, name:'Bob'}, {id:3, name:'Carol'}]	Yes	Wait for refetch or poll
5	No refetch or poll triggered	No new data	No	Wait continues

💡 Execution continues indefinitely until stopped; polling and refetch keep updating data.

Variable Tracker

Variable	Start	After Step 1	After Step 2	After Step 3	After Step 4	After Step 5
data	[]	[{id:1, name:'Alice'}, {id:2, name:'Bob'}]	[{id:1, name:'Alice'}, {id:2, name:'Bob'}]	[{id:1, name:'Alice'}, {id:2, name:'Bob'}, {id:3, name:'Carol'}]	[{id:1, name:'Alice'}, {id:2, name:'Bob'}, {id:3, name:'Carol'}]	[{id:1, name:'Alice'}, {id:2, name:'Bob'}, {id:3, name:'Carol'}]
displayUpdated	No	Yes	Yes	Yes	Yes	No

Key Moments - 3 Insights

Why does the data update even if I don't manually refetch?

Because polling automatically fetches data at set intervals (see Step 2 and Step 4 in execution_table), updating the display without manual action.

What happens if no new data is available during polling?

The display does not update (Step 5), but polling continues waiting for the next interval to check again.

Can refetch and polling happen at the same time?

Yes, refetch can be triggered manually anytime, and polling runs independently on intervals (see Step 3 and Step 4). Both update data when they fetch.

Visual Quiz - 3 Questions

Look at the execution_table, what data is displayed after Step 3?

A [{id:1, name:'Alice'}, {id:2, name:'Bob'}]

B No data

C [{id:1, name:'Alice'}, {id:2, name:'Bob'}, {id:3, name:'Carol'}]

D [{id:3, name:'Carol'}]

💡 Hint

Check the 'Data Fetched' column at Step 3 in execution_table.

At which step does polling cause data to be fetched again?

A Step 3

B Step 2

C Step 1

D Step 5

💡 Hint

Look for 'Poll interval reached' in the Action column of execution_table.

If the pollInterval is set to 0, what changes in the execution_table?

A Polling steps disappear; only manual refetch updates data

B Polling happens more frequently

C Data never updates

D Initial fetch is skipped

💡 Hint

Consider how pollInterval controls automatic fetching in the concept_flow.

Concept Snapshot

Refetching and polling in GraphQL:
- Initial query fetches data once.
- Refetch manually triggers a new fetch anytime.
- Polling automatically fetches data at set intervals.
- Both update the displayed data when new data arrives.
- Polling continues until stopped or interval set to 0.

Full Transcript

This visual execution shows how GraphQL queries fetch data initially, then update it either by manual refetch or automatic polling. The flow diagram illustrates starting with a query, displaying data, then waiting for triggers to fetch again. The execution table traces each fetch step, showing data changes and display updates. Variable tracking follows the data and display update states. Key moments clarify common confusions about automatic updates and manual triggers. The quiz tests understanding of when and how data updates happen. The snapshot summarizes the core ideas of refetching and polling in GraphQL.