https://github.com/lh0x00/rc-pure
a react package that improves render performance by reducing re-render component, fast and easy use!
https://github.com/lh0x00/rc-pure
component flow package performance pure react render
Last synced: 3 months ago
JSON representation
a react package that improves render performance by reducing re-render component, fast and easy use!
- Host: GitHub
- URL: https://github.com/lh0x00/rc-pure
- Owner: lh0x00
- License: mit
- Created: 2018-07-01T09:04:16.000Z (over 7 years ago)
- Default Branch: master
- Last Pushed: 2019-02-18T18:16:40.000Z (over 6 years ago)
- Last Synced: 2025-06-02T11:10:29.561Z (4 months ago)
- Topics: component, flow, package, performance, pure, react, render
- Language: JavaScript
- Size: 44.9 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 1
-
Metadata Files:
- Readme: readme.md
- License: license
Awesome Lists containing this project
README
# rc-pure
[![npm version][npm-version-image]][npm-url]
[![npm downloads][npm-downloads-image]][npm-url]
[![github issues][github-issues-image]][github-issues-url]
[![greenkeeper status][greenkeeper-image]](https://greenkeeper.io)
a react package that improves render performance by reducing re-render component, fast and easy use!
### reference
#### rc-pure-component
a wrapper use pure component wrap stateless functional components to class use pure component to reduce re-render. [read more](https://www.npmjs.com/package/rc-pure-component)
# install
```bash
# use npm
$ npm install rc-pure
# or yarn
$ yarn add rc-pure
```
# usage
```javascript
import pure from 'rc-pure'
const config = {
updateByKeys: ['name'],
}
const Component = ({ name = 'Hieu' }) => (
hello, {name})
// with config
const Pure = pure(config)(Component)
// simple
const Pure = pure()(Component)
```
# documents
## config
| name | type | description |
|----------- |-------- |------------------------------------------------------------------------------------------------------------------------|
| compare | Func | (optional) the function used to calculate the change value. default: `lodash.isEqual` |
| updateByKeys| Array | (optional) Only update when these values change. default: `undefined` |
[npm-url]: https://npmjs.org/package/rc-pure
[npm-version-image]: https://badge.fury.io/js/rc-pure.svg
[npm-downloads-image]: https://img.shields.io/npm/dm/rc-pure.svg
[github-issues-image]: https://img.shields.io/github/issues/lamhieu-vk/rc-pure.svg
[github-issues-url]: https://github.com/lamhieu-vk/rc-pure/issues
[greenkeeper-image]: https://badges.greenkeeper.io/lamhieu-vk/rc-pure.svg