A user can change routes or filters while an earlier request is still in flight. If the older response arrives last, it may overwrite data for the current view.

Tie the request to the view

const controller = new AbortController();
fetch(url, { signal: controller.signal });

// When this view is replaced:
controller.abort();
  • Create a controller for the request or view that owns the result.
  • Abort it when the view is disposed or the relevant search term changes.
  • Treat an abort as expected cancellation, not as a server error to retry.

Protect state updates too

Cancellation may not stop every operation after a response has arrived. Check that the result still belongs to the active request before committing it to shared state.

Test a slow first request followed by a faster second request. The final screen should reflect the current view, and cancellation should not show a misleading error message.