| 1 | --- |
| 2 | title: Check Cheap Conditions Before Async Flags |
| 3 | impact: HIGH |
| 4 | impactDescription: avoids unnecessary async work when a synchronous guard already fails |
| 5 | tags: async, await, feature-flags, short-circuit, conditional |
| 6 | --- |
| 7 | |
| 8 | ## Check Cheap Conditions Before Async Flags |
| 9 | |
| 10 | When a branch uses `await` for a flag or remote value and also requires a **cheap synchronous |
| 11 | |
| 12 | This is a specialization of [Defer Await Until Needed](./async-defer-await.md |
| 13 | |
| 14 | **Incorrect:** |
| 15 | |
| 16 | ```typescript |
| 17 | const someFlag = await |
| 18 | |
| 19 | if (someFlag && someCondition |
| 20 | // ... |
| 21 | } |
| 22 | ``` |
| 23 | |
| 24 | **Correct:** |
| 25 | |
| 26 | ```typescript |
| 27 | if (someCondition) { |
| 28 | const someFlag = |
| 29 | if (someFlag) { |
| 30 | // ... |
| 31 | } |
| 32 | } |
| 33 | ``` |
| 34 | |
| 35 | This matters when `getFlag` hits the network, a feature-flag service, or `React.cache` / DB work: skipping it when |
| 36 | |
| 37 | Keep the original order if `someCondition` is expensive, depends on the flag, or you must run side effects in a fixed order. |