twobin/react-lazyload

SSR support

Saeeed-B opened this issue · 2 comments

@ameerthehacker
This package does not appear to support ssr.
Photos are not displayed in the viewport.

No more features are actively developed but I'm happy to accept a PR if you wish to contribute

@Saeeed-B

  /**
   * https://github.com/alex-cory/use-ssr
   * https://github.com/alex-cory/use-ssr/blob/master/useSSR.ts
   */
  const isBrowser: boolean = !!(
    typeof window !== 'undefined' &&
    window.document &&
    window.document.createElement
  );
  
  const Lazy = ({ children }) => {
    if (lazy && isBrowser) {
      return (
        <LazyLoad
          className={classes.avatar}
          once
          placeholder={<LoadingSpinner />}
        >
          {{children}}
        </LazyLoad>
      );
    } else {
      return children;
    }
  }