markdown guide
 

Your friend is coming over to play.

Eager Loading: You open the toybox and pull all the toys out.
Lazy Loading: You leave the toybox alone until your friend arrives.

When should we use them?

Eager Loading: You open the toybox and pull out the toys you know you are going to play with. Your friend arrives and you start playing right away.

Lazy Loading: You aren't sure what your friend wants to play, so you wait for her to arrive.

When should we not use them?

Eager Loading: You open the toybox and pull out every toy just in case you will play with it. Your friend rings the doorbell. You can't answer because you're still pulling out toys. Eventually you answer the door after she's been waiting a while and let her in. When she leaves you have unused toys all over the floor.

Lazy Loading: Your friend's favorite toy is your cowboy figure. But you don't like it, so it's buried at the bottom of the box. Your friend arrives and wants to play with the cowboy. She has to wait for you while you dig through the toy box to find it.

 

Someone gives you a box of candies.

Lazy loading: you're hungry, you know where the box is, you open it and eat all the candies, you close the box

Eager loading: you open the box, you put all the candies in your mouth, you close the box and when you're actually hungry you start eating them

candies = resource
box = connection
mouth = memory
eating = resource usage

Hopefully you only get a mouthful of candies, because if they are too many you can't fit them in your mouth so eager loading won't work and you'll end up with an issue :-D

 

I can't seem to get passed the "put all candies in mouth" and then NOT eating them immediately :)

 

You get math homework on Friday.

Eager loading is when you solve all your math exercises on Friday.

Lazy loading is when you solve all your math exercises right before the teacher checks if you did your homework.

Eager loading has the benefit, that you can simply point to the solutions when asked and don't need to do anything anymore.

Lazy loading has the benefit, that you don't have to do anything if nobody wants your solutions.

 

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 dev.to, 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 dev.to 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).

 

You just moved to a new house. You packed all of your belongings inside boxes. The truck just left all of them inside your new home, and you're about to start your new life in there.

Eager loading

You really want to have the house setup with everything in it's right place. Right after the moving truck leaves, you decide you will unpack everything and will put everything in their right place before anything else. It will take you, say, 6 hours in doing that, but after you finish, you know where everything is, and only then can start to live in the house.

Lazy loading

The boxes are everywhere, but you don't want to unpack everything all at once. You just decide that, every time you need something, you will look up on which box is it, remove only that thing from the box, and use it. After using that, you will place that into it's permanent place.

E.g.: You are hungry and wanna cook pasta with tomato sauce. You take the cooking pan from one box, the pasta and tomato sauce from another one and only the utensils that you will need from another one. You cook your pasta, do the dishes and store all of that into the places you will keep them from now. If you decide to have the same meal again later, you don't need to look for them in the boxes, you know they are in your cabinets and in the fridge.

You will notice that, over time, the amount of stuff inside boxes will reduce significantly and, one day, there will be nothing left. If there's still stuff in boxes that you never had to unpack after a while, you may realize you don't need that at all.

Also consider that, if you do not store food that needs to be refrigerated as soon as you move, this food can go bad! (like milk). This kind of food cannot wait, and cannot be looked up only when you need them, therefore cannot be lazy loaded.

Classic DEV Post from Nov 19 '18

10 Books I am reading (NOT at the same time)

Favorites books on my reading list

Sumit Wadhwa profile image
Web Developer

Sore eyes?

dev.to now has dark mode.

Go to the "misc" section of your settings and select night theme ❤️