Performance improvements are easy to claim and hard to prove. When I joined the Liqua team at Pegasus Infocorp, the platform had real performance problems — not slow-by-benchmark problems, but slow-by-user problems. Operators managing smart pool hardware were waiting 4–6 seconds for dashboards to load. This is what we did about it.
Baseline measurement first
Before touching a single line of code, I spent two days with Chrome DevTools, Lighthouse, and the Vue Devtools profiler establishing a baseline. The main offenders were: a 2.1MB initial JS bundle (everything loaded eagerly), a dashboard component re-rendering on every Firestore snapshot regardless of which data changed, and twelve separate Firestore reads firing on page load that could have been three.
Route-level code splitting
Vue Router supports lazy-loaded routes with a single import() call. We split every major route — dashboard, members, finance, reports — into separate chunks. Initial bundle dropped from 2.1MB to 340KB. The remaining routes load on demand, and the browser caches them after first visit. This alone accounted for roughly half the improvement.
Component architecture: composables over bloated components
The existing components were doing too much. The MemberCard component, for example, fetched its own data, formatted currency, handled click state, and rendered three nested components — all in one 400-line file. We broke this into a presentational MemberCard, a useMember composable for data fetching, and a useCurrency composable for formatting. Pinia stores held shared state. Re-renders dropped because each piece only updated when its specific slice of data changed.
Firestore query consolidation
Firestore bills per read, which creates an incentive to consolidate queries. More importantly for performance, each query is a round trip. We batched twelve dashboard reads into three — one for sensor status, one for membership summary, one for financial totals — using collection group queries and aggregation. We also moved from onSnapshot (real-time listeners) to getDoc with manual refresh for data that doesn't need sub-second updates.
The result
Dashboard load time went from 5.8 seconds to 3.4 seconds on a mid-range Android device on a 4G connection. Lighthouse performance score went from 41 to 78. More importantly, support tickets about "the platform being slow" dropped by two-thirds in the month after deployment. That's the metric that matters.