artursvonda / react-pure-placeholder

A React component to easily replicate your page with nice placeholders while the content is loading

React Placeholder

A light React component library to provide placeholders while content is loading. Suited for use with lazy and Suspense.

import React, { lazy, Suspense } from 'react';
import { MediaPlaceholder } from 'react-pure-placeholder';

const MyComponent = lazy(() => import('./MyComponent'));

React.renderComponent(
  <div>
    <Suspense placeholder={<MediaPlaceholder rows={7} />}>
      <MyComponent />
    </Suspense>
  </div>,
  document.body);

Storybook and Live Demo

Install

npm install --save react-pure-placeholder

or

yarn add react-pure-placeholder