I heared about lazy loading but I dont know what does lazy loading really do? Why do we need lazy loading in our apps?
The main goal of lazy loading is to make your app faster, it is related with images that are quite heavy (jpgs, pngs so on). To explain in short, normally you load a webpage with all images inside it, and the page is shown only when all images are downloaded. This can be super slow if you load for example 500 products on the same smartphone product page with infinite loop.
The goal of lazy loading is to load every images as you go down in the list, it could be described as “load on the go” like “pay as you go”.
This often results in very nice gain performance boosts, in terms of page speed load.
Hope I’m clear enough,
Thank you it’s clear. Is it always good to use lazy loading in your app?
another question, when you use lazy loading, is it applicable on all the app or just for some specific pages?
For example, out of ionic, i will do it in an ecommerce store soon based on magento.
EDIT : but the implementation is not so easy to make, because you have to create preloader classes, and interrupt the flow of ionic or magento for example, to make it work.
EDIT 2 : But if you load only like 15 products or articles per page, it’s not super useful. Lazy loading will be useful when people can browse more than 100s of records or products per page, with image loaded for each one. OR infinite loop, like in some apps you can go down infinitely (eg Asos), then Lazy Loading is super helpful.
Hope it helps,
Well @boussarhane it depends your level in coding in general. Are you familiar with php or mysql? What languages do you practice? It will help me tell you what to look (i’m an occasional teacher in digital).
Ooh that’s great. Yeah im familiar with php and mysql
ok then, lazy loading heavily uses Jquery in most libraries, it’s plugged by php or Typescript for ionic, to Jquery or custom made old school javacript if you know.
Some tutorials that are very nice
I suspect you speak french so this one for php:
That should be a good start,
Hope that helps,
Many example i gave use magento sorry, but it’s not a big deal to translate into TS.
u r such a nice helper I wish u all the best ( sorry for my english, it’s my third language)
no problem @boussarhane, many people helped me here, when i started to learn ionic
have fun with ionic
Thank you verry much François.
Goal of lazy loading:
Speed up boot time/start up of your app (“open the app faster when users start it”)
No lazy loading = All you app, everything, is loaded when you boot/start your app
Lazy loading = Only what you need for the core and first page is loaded when you boot/start your app. Then when you browse the next pages, each time you go to a new page, only then what’s needed for the page and the page itself gonna be loaded
Ionic and lazy loading tutorial and explanation:
Depends on the case then, at least in mine, implementing lazy loading in my Ionic app was straight forward. I just had to add
@IonicPage() in the pages, create the new modules and modify
app.module.ts that’s it, easy peasy