• Stars
    star
    308
  • Rank 135,712 (Top 3 %)
  • Language
    JavaScript
  • License
    Apache License 2.0
  • Created almost 8 years ago
  • Updated over 6 years ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

QReact 是去哪儿网 YMFE 团队推出的 100% 兼容官方 React 的迷你框架

简介

QReact是去哪儿网推出的一款高度兼容 React迷你的 React 框架,让 React 在业务线上更具通用价值。

众所周知,React 一直存在体积过大的诟病,集成了许多在线上环境不需要功能。YMFE 团队在熟读其源码的基础上,去芜存精,重新实现了 React 所有公开接口,体积只有 React 的约三分之一,从而解决它在移动端上加载过慢的问题。由于没有使用高级 API,因此只需在 webpack ,uglify 上修改配置,便能运用于 IE8 上,从而解决 PC 端同学使用 React 的问题。

它对比官方 react, preact, inferno, react-lite 等框架,它具有以下优势。

  • 对比 preact等迷你框架,QReact 的事件系统更为完善,更具扩展性。像 mouseenter/mouseleave,focus/blur 等不冒泡的事件,preact 简单的基于**addEventListener(type, fn, true)**是无法正常运行。

  • 对比 preact等迷你框架,QReact 在处理混杂着 ref 与生命周期钩子的逻辑时,与官方的行为是保持一致。React.Children 与 React.cloneElement 在 key 生成策略上也是与官方行为一致。其他迷你框架则出入很大,或干脆没有实现。简而言之,QReact 与 React 高度兼容,在细节上做得原汁原味。因此它 99%上运行阿里的antd这样复杂的 UI 框架,当然我们不限于此,会努力做到完全兼容。

  • QReact 实现了官方 react/lib 下的许多子模块,它们的实现也非常简洁,从而整体减少 bundle 的大小。如果没有实现它们,许多第三方库就会直接引用官方提供的 react/lib 子模块,但由于迷你 React 们的内部实现与官方不一样,因此即便引用,也会运行出错。其次,RN 也用到它们,,这也为 QReact 支持三端合一的 QRN-WEB 做技术支撑。

  • QReact 包含了 reactreact-dom 的全部功能,同时有着更小的体积,[email protected] 的体积为(minified: 34.45KB gzipped : 12.88KB),作为对比, [email protected] + [email protected] 的体积则大了很多(minified: 5.1KB + 88.7KB = 93.8KB gzipped: 2.2KB + 28.3KB = 30.5KB)。

  • QReact 支持 IE6 - IE8,详细信息请参见使用中的“在 IE 6 - IE 8 及以下使用”。

  • QReact 是一个充满活力的库,它的开发版本anujs几乎每天都有更新,不断跟进官方 React 的新特性,React 16 的一些新功能也渐渐加入。

如何使用

详细使用方式请参见使用

组件规范

为了减少常见的编码错误,请尽量遵循编码规范

鸣谢

QReact 基于开源项目 developit [email protected] developit [email protected]Facebook [email protected]

QReact 在开发过程,从 preact, react-lite 的源码受到许多启迪,特此鸣谢。

欢迎大家对 QReact 与 anujs 进行试用与提 issue 与 PR!

More Repositories

1

yapi

YApi 是一个可本地部署的、打通前后端及QA的、可视化的接口管理平台
JavaScript
27,288
star
2

ydoc

🐶YDoc 是一个更懂你的文档站构建工具,基于 markdown 轻松生成完整静态站点
HTML
674
star
3

ykit

基于 Webpack 的灵活快速的打包工具,帮助稳定高效构建现代 JavaScript 应用。
JavaScript
392
star
4

yicon

可部署的矢量字体图标(IconFont)管理平台
JavaScript
367
star
5

cross-request

A chrome extension that gives the html page cross-domain request capability.
JavaScript
275
star
6

yapi-cli

YApi可视化接口管理平台部署工具
JavaScript
47
star
7

yapi-plugin-qsso

YApi可视化接口管理平台 qsso 登录插件
JavaScript
43
star
8

yshow

最好的移动端网页自动生成平台
28
star
9

ySniff

更全面的浏览器检测工具
JavaScript
22
star
10

yStorage

完善的本地存储封装
JavaScript
18
star
11

yGesture

移动端手势库
JavaScript
17
star
12

YIcon-Docker

YIcon Docker Image
JavaScript
15
star
13

yicon-builder

YIcon矢量字体图标管理平台部署工具
JavaScript
8
star
14

qreact-ie-demo

低版本 IE 下 QReact (https://github.com/YMFE/qreact) 示例
JavaScript
4
star
15

ykit-config-seed

ykit 插件的初始模板
JavaScript
4
star
16

ydoc-demo

sample application of ydoc
4
star
17

qreact-cli

qreact 脚手架
JavaScript
3
star
18

ykit-config-mock

ykit mock plugin
JavaScript
3
star
19

nanachi

小程序相关 https://rubylouvre.github.io/nanachi/
HTML
2
star
20

nanachi-runtime

runtime for nanachi
1
star
21

ykit-config-ssr

ykit + react + react-router-v4 + ssr 插件
JavaScript
1
star
22

ykit-config-ts

YKit-TypeScript 配置和脚手架
JavaScript
1
star
23

ykit-config-react

JavaScript
1
star
24

yicon-problem-code

维护 YIcon 平台所检测到的各种手机及系统所占用的可用区编码
1
star
25

ydoc-plugin-pangu

YDoc 插件,自动替你在网页中所有的中文字和半形的英文、数字、符号之间插入空白(盘古之白)
JavaScript
1
star