react-lite is an implementation of React that optimizes for small script size.
Note: react-lite dose not support React v16.x now.
|Web Components Polyfill||0.7.19||118kb|
|preact + preact-compat||8.2.1||5kb|
React-lite supports the core APIs of React, such as Virtual DOM, intended as a drop-in
replacement for React, when you don't need server-side rendering in browser(no
If you are using webpack, it's so easy to use react-lite, just config alias in webpack.config.js:
// webpack.config.jsresolve:alias:'react': 'react-lite''react-dom': 'react-lite'
Note: feel free to try react-lite, if something happen and we can't fix it in time, then use regular react instead.
You can install react-lite from npm:
npm install react-lite --save
supports IE9+ / ES5 enviroment
learn react-lite from React official documentation
What can react-lite do?
just the same as what react does, see some demos below(I just add the alias to webpack.config.js, no need to do anything else):
- works with material-ui: docs demo
- works with react-bootstrap: docs demo
- works with ant-design: demo
- works with react-router: examples
- works with redux:
- works with react-motion: demos
- works with react-d3-components: demos
- works with react-d3: demos
- react-lite vdom-benchmark
React-lite vs React
- all of React.PropTypes method is no-op(empty function)
- use React in server side rendering, and use React-lite in browser
- react-lite will replace the dom tree with new dom tree
- you had better avoid
script|head|linktag in client side
- can not use react-dev-tool inspect react-lite, should switch to regular react for debugging
- react-lite only works with a JSX toolchain(issue)
- unlike react,
eventobject in react-lite is always persistent, and
event.persistis set as no-op to avoid throwing error.
- react-lite can't work with
react-tap-event-plugin, please use
fastclickinstead. or add alias
'react-tap-event-plugin': 'react-lite/lib/react-tap-event-plugin', just like here
- can't work with
transform-react-inline-elements, you will get a bundle include both
react-litejust follow the best practice of
react-lite reuses react's unitest(170), you can see them in
__test__, and run the tests with:
License: MIT (See LICENSE file for details)