Lazy Loading Images in ReactJS - Mike Tsamis @ ReactNYC
In this talk, we will explore the concept of lazy loading which involves deferring loading content in order to optimize content delivery and improve website performance. We’ll walk through the process of how to wrap components that we want to lazy load using the open source package “simple-react-intersection-observer”, analyze the source code, and discuss practical use cases.
CONTENTS
0:04 - Intro
0:31 - What is Lazy Loading
0:55 - Example
2:49 - Simple-React-Intersection-Observer
3:39 - Source code
5:49 - Why not Use Intersection-Observer Polyfill
6:41 - Our Use Case
7:27 - Using simple-react-intersection-observer and Live demo
10:04 - Summary
11:16 - Question: Are there any alternatives?
12:31 - Question: Mobile experience
RESOURCES
simple-react-intersection-observer
https://github.com/eMarketerOSS/simpl...
React-Intersection-Observer
https://github.com/researchgate/react...
nwb Toolkit
https://github.com/insin/nwb