Invental/Review lessons/Client state that goes stale

Client state that goes stale

Clear scoped state before the reload starts

When the scope of a piece of client state changes, clear it before the async reload, not after: otherwise the UI spends the loading window showing, and submitting, values that belong to the previous scope.

01 · Before and afterThe pattern

TypeScript
setScope(ws: string, route: string) {
  if (ws === this.ws && route === this.route) return;
  this.ws = ws; this.route = route;
  this.models.value = []; this.modelId.value = undefined;   // before: kept until load() resolved
  const req = ++this.requestId;
  this.load(ws, route).then(r => { if (req === this.requestId) this.models.value = r; });
}

02 · Run it on your appThe check

If a user switches workspace and acts before the new data arrives, can your app submit a value from the old workspace?

If the honest answer is no or not sure, this is worth a look before it reaches production.

Want this checked on your code?

Tell us what you are building and what worries you. We match a senior reviewer to your code and confirm scope before anything starts.

— Get in touch
hi@invental.co ↗
— Or
— What to include

A link or short description of the code or system, what you want checked, your stack, and when you need the answer. No repository access is needed until scope is agreed.

— Or leave a note
We reply within one business day.