ReactNYC - Lazy Loading Images in ReactJS - Mike Tsamis HD

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/simple-react-intersection-observer React-Intersection-Observer https://github.com/researchgate/react-intersection-observer nwb Toolkit https://github.com/insin/nwb