Everyone talks about optimizing load time, but here’s an underrated bottleneck: module communication.

Vue’s Composition API gives you tools like provide/inject, stores, and custom composables… but when should you use which?

My go-to rules:

If two sibling components talk → shared composable or scoped store

If parent provides data → props or provide/inject

If data needs to survive route changes → Pinia/global store

What kills DX is mixing strategies. I once saw a component that injected data from one parent, pulled another from global store, and passed props to a nested modal — impossible to test.