rc-pure-component

0.2.0 • Public • Published

about

npm version npm downloads github issues

a higher-order component to reduce render times quickly for lazy people like me!

install

# use npm 
$ npm install rc-pure-component
 
# or yarn 
$ yarn add rc-pure-component

usage

before

const Component = ({ name = 'Hieu' }) => (<div>hello, {name}</div>)

after

import pure from 'rc-pure-component'
 
// normal
const Component = pure(({ name = 'Hieu' }) => (<div>hello, {name}</div>))
 
// custom
const shallowCompare = (prevProps, nextProps) => !(prevProps === nextProps)
const Component = pure(({ name = 'Hieu' }) => (<div>hello, {name}</div>), shallowCompare)

compare

by default I use the calculation of fb, here:

import shallowEqual from 'fbjs/lib/shallowEqual'
 
const shallowCompare = (prevProps, nextProps) => !shallowEqual(prevProps, nextProps)

alternatively, you can use the function of the lodash:

import isEqual from 'lodash/isEqual'
 
const shallowCompare = (prevProps, nextProps) => !isEqual(prevProps, nextProps)

Package Sidebar

Install

npm i rc-pure-component

Weekly Downloads

38

Version

0.2.0

License

MIT

Unpacked Size

9.52 kB

Total Files

11

Last publish

Collaborators

  • lamhieu