Preact(具有相同ES6 API的3KB快速ReactJS替代方案)

本文概述

  • 什么是Preact?
  • 从React转变为Preact
  • 使用Preact进行调试
  • 贡献于行为
React并不是唯一一个实现虚拟DOM来解决更新浏览器DOM问题的库(因为从理论上讲它比虚拟DOM慢), 但是到目前为止最受欢迎。成为最受欢迎的项目意味着许多开源贡献者都在项目中工作, 并且可以在应用程序内部实现更多公共组件。这显然是你应该使用React而不是该类型的另一个库的原因, 但是, 如果我告诉你你仍然可以将大多数react组件与另一个库一起使用, 该库的工作原理相同, 并且与React相比非常轻巧?它存在, 并且项目名称为Preact。
什么是Preact?Preact是具有相同ES6 API的非常快速的React替代方案, 可以处理组件, 虚拟DOM, 并且仅重3KB。如果你担心React的大小和性能, 应该考虑使用Preact作为” 克隆库” , 该库声称具有更好的性能, 而且它非常轻巧。
Preact导出通用的Component类, 可以将其扩展以构建用户界面的封装的, 自更新的片段。组件支持所有标准的React生命周期方法, 例如shouldComponentUpdate()和componentWillReceiveProps()。提供这些方法的特定实现是控制组件更新时间和方式的首选机制。
从React转变为PreactReact最重要的一点是组件完成的出色工作。你可以随时随地在任何项目中使用它。尽管并非所有的React组件都与Preact兼容, 但是可以使用React兼容性层使其兼容。令人惊讶的是, 你需要做的就是安装preact和preact-compat, 删除react和add是Webpack中的别名, 仅此而已。
这是Preact最令人敬畏的功能之一, 因为如前所述, 这是一个示例项目, 该示例项目使用preact-compat与未修改的现有React库一起工作, 实现了超过95%的缩减(这是很多伙伴)。我们确信, 如果你真的在乎应用程序捆绑包的大小, 那么现在你的BFF就可以成为现实。值得一提的是, 如果你愿意从现有的React项目迁移到Preact, 则需要确保在切换之前对应用进行全面测试, 因为你可能会丢失React的某些功能(可以通过React的性能得到补偿)应用本身)。 Preact不尝试包含React的每个功能的原因是为了保持小巧和专注-否则, 简单地将优化提交给React项目就更有意义了, 该项目已经是一个非常复杂且结构良好的代码库。
使用Preact进行调试【Preact(具有相同ES6 API的3KB快速ReactJS替代方案)】你可以使用React Developer Tools浏览器扩展在运行时检查和修改Preact UI组件的状态。
  1. 安装React Developer Tools扩展
  2. 在你的应用程序中导入” preact / devtools” 模块
  3. 重新加载并转到浏览器开发工具中的” 反应” 标签
贡献于行为Preact可以接受拉动请求和任何形式的支持。你可以每月捐款支持该项目, 并帮助他们继续开展活动。不要忘记访问Github上的官方存储库以获取有关该库的更多信息。

    推荐阅读