Understanding how frontend systems evolve under pressure.
Most frontend systems do not begin with architecture. They begin with delivery.
Systems rarely fail because of patterns.
They fail because prior decisions stop holding under new pressure.
Divergence was the first crack.
The solution: centralize cart state and derived logic.
Subtotal: $0
Shipping: $10
Total: $10
Consistency is restored across all surfaces.
Cart logic now lives in a shared provider.
All consumers depend on a global state boundary, increasing systemic coupling.
The provider becomes a concentration point. Every new rule lands here.
A bug in cart logic now affects every surface simultaneously.
// Global reducer
function reducer(state, action) {
switch (action.type) {
case "SET_CART":
return { ...state, cart: action.payload }
}
}
// All derived logic centralized
const subtotal = state.cart.reduce(...)
const itemCount = state.cart.reduce(...)
A promotion rule introduces a subtle bug.
The provider recalculates totals incorrectly.
Every surface displays the same incorrect total.
No divergence. No visible inconsistency. Just globally wrong data.
Centralization fixes divergence — but amplifies failure.