Preact

追求极致性能与最小包体积的前端开发者，正在用Preact替代React——仅3kB的虚拟DOM库，完整兼容React现代API，支持无构建工具直接在浏览器运行。

核心优势：3kB的极致性能

Preact在保持与React相同API的前提下，将包体积压缩至3kB。其虚拟DOM实现采用简单可预测的diff算法，自动批量更新，并与浏览器工程师合作优化性能。相比多数UI框架占据应用JS体积大头，Preact让开发者代码成为应用主体，减少下载、解析和执行时间。

• 体积对比: 3kB vs React约40kB，减少90%以上框架代码
• 性能基准: 官方称其为“最快的虚拟DOM库之一”，通过自动批处理与极端调优实现
• 平台特性: 直接基于DOM注册真实事件处理器，无需转译即可在浏览器中使用

与React的差异与兼容方案

Preact提供与React相同的现代API（Hooks、useState、useEffect等），但并非完全复刻。它更贴近DOM原生行为，例如使用标准HTML属性class和for。通过preact/compat别名层，可无缝使用React生态中数千个组件，包括复杂组件库。

• API差异: props、state和context直接传入render()，减少样板代码
• 兼容方案: 在Webpack、Rollup、Parcel、Jest等工具中设置别名即可启用preact/compat
• 无JSX替代: 推荐HTM（基于ES2015标签模板语法），无需构建步骤即可编写类JSX语法

快速上手与生态工具

Preact提供多种入门方式：推荐使用Vite创建Preact应用，也支持无构建工具直接通过ES模块引入。官方提供详细指南，包括从React迁移、JSX替代方案、TypeScript配置等。生态包含丰富的插件与集成：preact-router实现URL路由，preact-render-to-string支持服务端渲染，Prefresh提供快速热更新。

• 零构建入门: 通过esm.sh直接import {h, render}，无需npm或打包器
• 脚手架: preact-cli可在30秒内生成PWA项目
• 开发工具: Prefresh实现Fast-Refresh，兼容Vite和Webpack
• UI库: 支持Material-UI、Preact Material Components等Material Design组件

企业级应用与真实案例

Preact被广泛用于从开源项目到跨国公司的公开项目。官网列出多个生产级案例：BBC Roasting Calculator（烤肉计时器）、BigWebQuiz（Chrome Dev Summit 2016互动PWA）、Dropfox（基于Electron+Preact的Dropbox桌面客户端）、Web Maker（离线前端游乐场）。

• 知名用户: 官网展示使用Preact的组织列表，并邀请企业自行添加
• 复杂场景: 支持嵌入Hacker News评论树、构建VR故事创建器（GuriVR）、实现P2P文件共享（Blaze）
• 性能验证: TodoMVC实现被官方称为“非官方最快版本”，并支持PouchDB离线同步

常见问题

Q1：Preact能否直接运行React组件？

A1：可以。通过preact/compat别名层，在Webpack、Rollup等打包工具中设置别名后，绝大多数React组件无需修改即可运行。官方强调甚至“最复杂的React组件”也能兼容。

Q2：Preact支持服务端渲染吗？

A2：支持。官方库preact-render-to-string提供通用渲染能力，可将JSX和Preact组件渲染为HTML字符串，适用于Node.js服务端。

Q3：不使用JSX如何开发Preact？

A3：推荐使用HTM（Hyperscript Tagged Markup），它利用ES2015的标签模板语法，在标准JavaScript中实现类似JSX的写法，无需构建步骤且支持所有现代浏览器。

更多同类工具与网站,可在其他框架分类继续挑选。

信息核实于 2026年7月,具体以官网为准。