Anujs 高级兼容 React16 的迷你 React 框架

发布于 2020-02-25 11:41:27 字数 2561 浏览 1554 评论 0

npm install anujs

Anujs 是一个高级兼容React16的迷你React 框架,它兼容 React16.3.0 的 99% 接口, 跑通了官方 788 个 case, 支持 React 生态圈的 99% 的组件与 UI 库。

众所周知, React  一直存在体积过大的诟病, 因此我在熟读其源码的基础上,重新实现了React, gz 后只有 React+ReactDOM 的三分之一。详细数据见 https://bundlephobia.com/, anu@1.4.3只有 13.1 kb, react@16.4.1为 2.3 kb, react-dom@16.4.1为 30.5 kb。如果使用路由器,react-router-dom@4.3.1为11 kb, reach@1.0.1为 4.3kb。

体积比对

现在 React 全家桶有如下常用套餐

套餐1:react + react-dom + react-router-dom + redux + react-redux + redux-saga,
体积为 2.3 + 30.5 + 11 + 5 + 4.3 + 8.4 = 61.4 kb
合适于刚入门的人群

套餐2:react + react-dom + react-router-dom + mobx + mobx-react
体积为 2.3 + 30.5 + 11 + 13.8 + 6.4 = 64 kb
合适于对 redux 怨言的人群

套餐3:anujs + reach + redux + react-redux + rematch
体积为 13.1 + 6 + 2.5 + 5 + 4.3 = 31 kb
合适于体积、兼容性、易用性有要求的人群

上述代码的测量工具为 gzip-size-cli, jsize 及 https://bundlephobia.com/

与其他迷你 react 的比较

主要竞品有 inferno, preact, rax, react-lite, nervjs, 前两个是海外的, 后三个是中国的,中国由于网络的状况,对体积要来比较高。

inferno, 需要加上inferno-compat, 才能与官方的API保持一致, 但组件套组件的情况下, 生命周期钩子的执行顺序与官方不一致, 因此不兼容React的绝大多数的UI库。不支持旧式IE。

preact, 需要加上preact-compat, 才能与官方的API保持一致, 但组件套组件的情况下, 生命周期钩子的执行顺序与官方不一致, 因此不兼容React的绝大多数的UI库。 并且preact-compat内部使用了Object.definePropety,因此无法运用于IE8, 也造成它的性能严重劣化。

rax, 中国的阿里巴巴集团推出,支持React16大多数API,不支持IE8, 能跑一些React UI库。

react-lite, 中国的携程集团推出,只兼容React15, 支持IE8,能跑一些React UI库。

nervjs, 中国的京东集团推出,支持React16大多数API,代码与inferno, rax很相近, 没有case证明其兼容IE8,性能指标也很可疑。

Anujs 优势

  1. 支持React16的各种新功能,Fragment, componentDidCatch, creactContext, createRef, forwardRef...
  2. 跑通官方近800多个单元测试(其他迷你库都无法跑官方测试)
  3. 支持React全家桶(react-redux, react-router-dom, react-router-redux, react-lazy-load, react-hot-loader...)
  4. 支持99%的antd组件 (antd为中国最有名的React UI 库)

测试

npm test

中文文档:https://www.wenjiangs.com/docs/anujs

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。
列表为空,暂无数据

关于作者

JSmiles

生命进入颠沛而奔忙的本质状态,并将以不断告别和相遇的陈旧方式继续下去。

0 文章
0 评论
84961 人气
更多

推荐作者

醉城メ夜风

文章 0 评论 0

远昼

文章 0 评论 0

平生欢

文章 0 评论 0

微凉

文章 0 评论 0

Honwey

文章 0 评论 0

qq_ikhFfg

文章 0 评论 0

    我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
    原文