react-fast-children

Render children fast! Improve the render time of React components with many children through cool data structures & algorithms.

Do you have a list with many children (50+) or a component that frequently rearranges children? This library is for you!

Installation

npm install --save react-fast-children

Usage

Simply wrap your children in the FastChildren component.

import { FastChildren } from 'react-fast-children'

...

return (
    <div className="list">

        <FastChildren>
            {manyChildren}
        </FastChildren>

    </div>
)

...and you're done!

Things to keep in mind

• Each child of FastChildren must specify a 'key' prop
• Children are only rendered once (unless you change the key!)

---

How does it work?

Read our post about the making of this package!

Addendum

This package was built for our crowd chat app Throne. We use it to load 500+ chats in a list, while supporting further live insertions by large crowds!

Have a comment or suggestion? Join us to chat about react-fast-children (on a site powered by it!): https://throne.live/ReactFastChildren