Preact：具有相同API，组件和虚拟DOM的3kb快速反应替代方案

函数Counter（）{const [value，setValue] = useState（0）; return（计数器：{value}递增递减）}

在REPL中运行

Preact在DOM之上提供了最薄的虚拟DOM抽象。它建立在稳定的平台功能之上，可以注册真实的事件处理程序，并且可以与其他库很好地协作。

大多数UI框架都足够大，足以占应用程序JavaScript大小的大部分。 Preact是不同的：它小得足以使代码成为应用程序的最大部分。

这意味着更少的JavaScript可以下载，解析和执行-为代码留出更多时间，因此您可以构建自己定义的体验，而无需努力保持框架的可控性。

精确快速，而不仅仅是因为它的大小。由于简单且可预测的diff实现，它是目前最快的虚拟DOM库之一。

当涉及到性能时，我们会自动批量更新并优化Preact。我们与浏览器工程师紧密合作，以使Preact发挥最大性能。

Preact的占地面积很小，意味着您可以将强大的Virtual DOM Component范式带到其他地方无法使用的新地方。

使用Preact可以构建应用程序的各个部分，而无需复杂的集成。将Preact嵌入到小部件中，并应用与构建完整应用程序相同的工具和技术。

当您不必牺牲生产力来达到该目标时，轻便会有趣得多。 Preact可立即为您带来生产力。它甚至具有一些额外功能：

通过虚拟DOM组件，可以轻松共享可重用的内容-从按钮到数据提供程序的所有内容。 Preact的设计意味着您可以无缝使用React生态系统中可用的数千个组件。

向捆绑程序中添加简单的preact / compat别名即可提供一个兼容性层，该兼容性层甚至可以在您的应用程序中使用最复杂的React组件。

导出默认类扩展{state = {todos：[]，text：＆＃39;＆＃39; }; setText = e => { 这个 。 setState（{文本：e .target .value}）; }; addTodo =（）=＆gt; {让{待办事项，文字} =这个.state; todos =待办事项。 concat（{文字}）;这个 。 setState（{todos，text：＆＃39;＆＃39;}）; };渲染（{}，{todos，text}）{返回（添加Todo添加{todos。map（todo =＆gt;（{todo .text））}））; }}

在REPL中运行

导出默认类扩展{异步componentDidMount（）{让stars =等待githubStars（这个.props .repo）; 这个 。 setState（{stars}）; } render（{repo}，{stars = 0}）{let url =`https://github.com/ $ {repo}`; 返回（⭐️{stars} Stars）; }} 在REPL中运行 根据您是否有使用React的经验，我们有单独的指南。 选择最适合您的指南！