DEV Community

Discussion on: Explain Lazy and Eager Loading Like I'm Five

khalyomede profile image

I will give a shot and try to explain it like you are five... with 1 year of exp in HTML and 1 year in SQL, which is the regular profile of our internships at my company :joke:.

lazy loading
When you browse a website with an image gallery using an infinite scroll, and when you scroll down too much, next images begin to load, and you scroll again, and new images appear, etc... That is lazy loaded: image will not load untill you asked to see them.

eager loading
Imagine a web page that list hot posts on, with for each post the title, the excerpt, and an "author" button. If you press the author button and you see the page displaying a loader, that was not eager loaded, but lazy loaded! Eager loading would have been the post page to instantly show the author name, location, and email on click on this button without loading, because it has loaded them ahead. We could rename this in "loading ahead of time", so when you do eager loading you are assuming things (maybe unefficient: if the use will click on the author button an average of 5% of the time, but your page is loading 100% of author's post anyway, you waste CPU and bandwidth nothing 95% of the time).