Sign Up for Free

RunKit +

Try any Node.js package right in your browser

This is a playground to test code. It runs a full Node.js environment and already has all of npm’s 400,000 packages pre-installed, including @mzvonar/defer-render-hoc with all npm packages installed. Try it out:

require("react/package.json"); // react is a peer dependency. require("react-dom/package.json"); // react-dom is a peer dependency. var deferRenderHoc = require("@mzvonar/defer-render-hoc")

This service is provided by RunKit and is not affiliated with npm, Inc or the package authors.

@mzvonar/defer-render-hoc v0.4.0

React defer render HOC


Forked from

Added WaitingComponent argument, so you can display some kind of loader while waiting for render. Added option to disable functionality for SSR.

Defer expensive react rendering with rAF


$ npm install @mzvonar/defer-render-hoc --save


import React, { Component } from 'react'
import deferRender from '@mzvonar/defer-render-hoc'

class RandomComp extends Component {

  render () {
    const { scroll } = this.props


export default deferRender(RandomComp)


You can use third parameter isEnabled to disable this component. Either pass boolean value or a function that returns boolean.

export default deferRender(RandomComp, null, canUseDom())


See this CodeSandbox for a demo.

MIT © Jack Hanford

RunKit is a free, in-browser JavaScript dev environment for prototyping Node.js code, with every npm package installed. Sign up to share your code.
Sign Up for Free