React under 20k. react-lite is an implementation of React that optimizes for small script size.
It 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 React.renderToString/React.renderToStaticMarkup).
If you are using webpack, it's so easy to use react-lite, just config alias in webpack.config.js:
// webpack.config.js
{
alias: {
'react': 'react-lite',
'react-dom': 'react-lite'
}
}you can install react-lite from npm
npm install --save react-liteyou can learn react-lite from React official documentation
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):
- react-lite works with react-router: examples
- react-lite works with redux:
- react-lite works with react-motion: demos
- js-repaint-perf(which is faster?):
via react-lite:
- virtual-dom can not render to string(no React.renderToString and React.renderToStaticMarkup)
- event system is base on DOM level1(dom.>
- all of React.PropTypes method is noop(empty function)
- Do not support React-addons(for example ReactCSSTransitionGroup)
- 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 aviod
script|head|linktag in client side
- the rule about setting props
- if
propName in domistruethendom[propName]=propValue - else:
dom.setAttribute(propName, propValue)
- if
react-lite reuses react's unitest(162), you can see them in __test__, and run the tests with:
npm testLicense: MIT (See LICENSE file for details)