Preact: preact/compat, Trade-offs & Migration
preact/compat
preact/compat is a compatibility layer letting many existing React libraries/components run on Preact's core with minimal or no changes -- shims React-specific APIs onto Preact's leaner implementation, easing migration from an existing React codebase.
Migrating a Bundler Config
// webpack/vite resolve alias
resolve: {
alias: {
react: 'preact/compat',
'react-dom': 'preact/compat',
},
}
// Often lets an existing React app run on Preact's smaller
// runtime with comparatively few code changesPreact Signals: Fine-Grained Reactivity
Preact Signals, from the Preact team, offers a state primitive with fine-grained reactive updates -- updating only the specific DOM parts that depend on a changed signal -- as a complementary option alongside traditional hooks-based state.
When React Might Still Be the Better Choice
For a large app where bundle size isn't the binding constraint, and dependencies lean heavily on React-only behaviors not fully covered by preact/compat, React's broader ecosystem maturity can be the more pragmatic choice -- the trade-off is deliberate, not automatic.
Evaluating the Actual Benefit
If the React runtime itself is only a small fraction of a large app's overall bundle (dominated by business logic and other dependencies), switching to Preact may yield a smaller relative improvement than it would for a genuinely small, focused widget.
Keep your own version of these notes — editable, searchable, and organised by your stack.
Start free