Shodipo Ayomide is a Senior Developer Advocate & Developer Program Manager who also contributes to a lot of open-source projects over on GitHub, he also runs some major communities like unStack Africa, Developers Circles Lagos from Facebook, Open Source Community Africa, DevRel Collective, and NaijaHacks driving Nigeria & Africa forward in Technology globally, he is an international speaker who has spoken at several technical conferences over time in various locations across countries, in his free time he loves to, read, see a movie and occasionally play video games, loves traveling to new countries, communicating/working with the developer community across the world, in Africa, Europe, America among others and importantly, love’s Family.
Lazy loading is a procedure that suspends the loading of non-critical resources at page load time, lazy loading of images, which can bring great savings in terms of speed, but it is also easy to execute incorrectly. fetching images and rendering to the client can be done in many ways but people often make lots of mistakes in this section.
Again, I will explain and describe some techniques to “occupy” space for an image before it is loaded, going from just displaying a blank area to displaying a progressive loading from a blurry image, exactly how Spotify, Google, and Facebook achieve this.
Lastly, we would go into analyzing the size of the image which would be rendered to the client using Webpack.
The major key takeaways from this session are, best-practices for fetching and rendering images, using the intersession observer API, auditing images, best practices in lazy-loading in relation to how Spotify, Facebook, Google, and other great company does it, also Analyzing images size using Webpack.