高性能迷你React框架 anu1.3.0 发布

anujs1.3.0是一款高性能React-like框架,是目前世界上对React16兼容最好的迷你库。

自React16起,相继推出createContext,createPortal, createRef与createResource等新API,表明官方正积极由纯view库向大而全的框架演变,它将会越来越好用。一些迷你库可能跟不上步伐,现在也只有anujs有这实力跟进。

1.3.0的改进如下:

  1. 支持React16.3的createContext new API

  2. 添加大量React.Fragment测试,修正一些边缘的BUG

  3. 升级diff机制,由新旧vnode进行比较,改成fiber与新vnode进行比较,用新vnode的数据更新fiber与视图

  4. 添加input[type=search]的onChange事件支持

  5. 修正传送门在antd3.0的一个边缘BUG(重复插入两次,导致文本节点消失)

  6. 属性名与方法名大改动,与React16的Fiber靠近

    • vnode.vtype --> fiber.tag
    • instance.__isStateless --> fiber._isStateless
    • updater --> fiber
    • updater.vnode --> fiber._reactInternalFiber
    • updater.willReceive --> fiber._willReceive
    • updater.children --> fiber._children
    • updater.isMounted() --> fiber._isMounted()
    • updater.insertCarrier --> fiber._mountCarrier
    • updater.insertPoint --> fiber._mountPoint
    • updater.parentContext --> fiber._unmaskedContext
    • getChildContext --> getUnmaskedContext
    • getContextByTypes --> 为getMaskedContext
    • CompositeUpdater.js --> ComponentFiber.js`
    • DOMUpdater.js --> HostFiber.js

使用

npm i anujs

或者使用架手架 https://github.com/Levan-Du/a...

npm i -g anu-cli

webpack.config中如何代替原来用React编写的项目

resolve: {
   alias: {
      'react': 'anujs',
      'react-dom': 'anujs',
        // 若要兼容 IE 请使用以下配置
        // 'react': 'anujs/dist/ReactIE',
        // 'react-dom': 'anujs/dist/ReactIE',

        // 如果引用了 prop-types 或 create-react-class
        // 需要添加如下别名
        'prop-types': 'anujs/lib/ReactPropTypes',
        'create-react-class': 'anujs/lib/createClass'
        //如果你在移动端用到了onTouchTap事件
        'react-tap-event-plugin': 'anujs/lib/injectTapEventPlugin',  
   }
},

欢迎大家为anujs加星星与试用!!!

https://github.com/RubyLouvre...

原文链接:segmentfault.com

上一篇:react-highlight-words源码解析
下一篇:浅谈Debounce 与 Throttle

相关推荐

  • 🔥基于vue3.0.1 beta搭建仿京东淘宝的电商商城项目!

    前言 就在前段时间,vue官方发布了3.0.0-beta.1 版本,趁着五一假期有时间,就把之前的一个电商商城的项目,用最新的Composition API拿来改造一下! 👉GitHub地址请访问�...

    6 个月前
  • 🌈 React 函数式组件优化

    1. React 性能优化思路 减少重新 render 的次数。 减少计算的量。主要是减少重复计算,对于函数式组件来说,每次 render 都会重新从头开始执行函数调用。

    1 个月前
  • 🆘 一次理解清楚,为什么使用 React useEffect 中使用 setInterval 获取的值不是最新的

    Intro 这篇文章将通过一个使用 React Hook 常遇到的问题(stale state)入手,尝试理解 Hook 的内部运行逻辑。 废话不多说,直接看示例Sandbox。

    3 个月前
  • (小白篇)vue-cli3.0创建项目+引入element-ui

    vue-cli在2018年8月份发布了3.0版本,经过重构之后,可以说是一个船心版本! 在项目都落地之后,就想升级一下cli版本,尝一尝3.0带来的舒适,也是为后面项目的开展做一个准备。

    2 年前
  • 高频数据交换下Flutter与ReactNative的对比

    (标题图片来自网络,侵删) 后端使用go写的socketio服务模拟期货行情数据,每10ms推送10条行情数据 ReactNative已经尽力优化了。 Flutter由于没flutter-socket...

    2 年前
  • 高德地图 react-amap 实战

    react-amap 是基于 React 的高德地图组件。 1. 获取地图示例 react-amap 作为高德地图在 React 中的实现,实际使用中不可避免的需要通过地图对象调用各种方法,reac...

    1 年前
  • 高品质 React UI 组件

    A high quality UI Toolkit, A Component Library for React 16+. 💘 Installation npm install isui --s...

    3 年前
  • 骚操作!在react中使用vuex

    原文地址 前言 笔者最近在学习使用react,提到react就绕不过去redux。redux是一个状态管理架构,被广泛用于react项目中,但是redux并不是专为react而生,两者还需要react...

    2 年前
  • 预计今年发布的Vue3.0到底有什么不一样的地方?

    还有几个月距离vue2的首次发布就满3年了,而vue的作者尤雨溪也在去年年末发布了关于vue3.0的计划,如果不出意外,我们将在今年的某个时间点见证Vue3.0的发布,虽然前几天在《StateOfJ...

    2 年前
  • 项目文档说明:react + Ant Design 的 blog-react-admin

    前言 此 blog-react-admin 项目是基于 蚂蚁金服开源的 ant design pro 之上,用 react 全家桶 + Ant Design 的进行再次开发的,项目已经开源,项目地址...

    2 年前

官方社区

扫码加入 JavaScript 社区