Wondering what’s next for npm?Check out our public roadmap! »

@ultraq/react-deferred-loader

0.2.1 • Public • Published

react-deferred-loader

Build Status Coverage Status npm Bundlephobia minified size

Delay the rendering of a loader animation/component by 1 second. This is useful for not prematurely putting users into a "passive" state of waiting that a loader normally signals, thus giving the appearance of a faster web application.

Inspired by this talk by Eli Fitch about perceived performance: https://twitter.com/elifitch/status/1047187122229321728

Installation

npm install @ultraq/react-deferred-loader

Usage

The <DeferredLoader> takes a single child function that is passed a boolean value of whether the 1 second has elapsed (true) or not (false), eg:

import DeferredLoader from '@ultraq/react-deferred-loader';
 
<DeferredLoader>
  {showLoader => showLoader ? (
    /* Render your loading component here */
  ) : null}
</DeferredLoader>

Keywords

none

Install

npm i @ultraq/react-deferred-loader

DownloadsWeekly Downloads

0

Version

0.2.1

License

Apache-2.0

Unpacked Size

31.2 kB

Total Files

10

Last publish

Collaborators

  • avatar