Why We Migrated 150k Lines of Vue to Olum

We've been running a large SaaS dashboard on Vue 3 for three years. It worked. But as the codebase grew to 150,000 lines, the cracks started to show: slow builds, a 340kb bundle that refused to shrink, and SSR hydration mismatches that cost us hours of debugging every sprint.

The decision to migrate

We evaluated Svelte, Solid, and Olum. Olum won on three criteria: the Vue-like single-file component format minimized the learning curve, the compiler promised genuine bundle improvements, and the migration tooling looked serious.

Phase 1: Running both frameworks side-by-side

We didn't do a big-bang rewrite. Olum's compatibility layer lets you mount Olum components inside a Vue app and vice versa. We started with leaf components — buttons, inputs, badges — and worked inward.

// Wrapping an Olum component for use inside Vue
import { defineOlumWrapper } from '@olum/vue-compat'
import { MyButton } from './MyButton.olum'

export default defineOlumWrapper(MyButton)

Results after full migration

• Bundle: 340kb → 41kb gzipped (88% reduction)
• Build time: 42s → 3.1s (cold), 90ms (incremental)
• Lighthouse performance score: 67 → 97
• SSR hydration errors: eliminated entirely
• TypeScript errors surfaced by stricter prop inference: 214 (all fixed)

What we'd do differently

Start the migration from the data layer, not the UI. Migrating stores first gave us a stable reactive foundation before we touched a single template. We wasted two weeks going UI-first before we realised this.