IONIC Section 7 - 7.3 Le caching d'une page Ionic et ses cycles de vie supplémentaires
Bonjour à tous, dans la vidéo précédente, nous avons parlé du cache. Mais qu’est ce que c’est ? Pour faire simple, la mémoire cache a pour rôle de stocker les informations les plus fréquemment utilisées par les logiciels et applications de votre ordinateur. La façon de voir comment le cache fonctionne, est d’intégrer des « console.log » à chacune des fonctionnalités comme nous avons intégré dans notre code dans le fichier « recipes.page.ts », vous pouvez voir que nous avons intégrer pour chaque fonction « ngOnInit », « ionViewDidEnter », « ionViewWillEnter », « ionWillLeave », « ionViewDidLeave » et « ngOnDestroy ». Cela permet d’observer le basculement des pages concernant notre pile de page comme expliqué dans la vidéo précédente. Sachez que, entre-temps, j’ai déconnecté la simulation, pour se faire, vous devez faire « contrôle C » sur le terminal qui la build. Pour se faire nous pouvons aller dans l’application, plus précisément dans notre console, afin d’observer ce qu’il se passe lorsque nous surfons un peu sur notre application. Par exemple, dans notre page d’accueil on retrouve « ngOnInit » et « ionviewDidEnter » et quand on va dans une recette « ionViewDidLeave » par exemple. Donc voilà comment vérifier et checker le cycle de vie de notre application. Cela nous permet d’y voir plus clair et plus en détail. Encore une fois si vous avez des difficultés, je vous conseille fortement de suivre le cours dédié à la technologie JavaScript de mon collègue qui vous permettra d’acquérir et de bien comprendre la méthodologie de cette techno. Ce que nous allons faire maintenant, c’est de planifier le projet en cours afin de créer nos pages d’application. Commençons par notre plan dans la prochaine vidéo.
En résumé
Cette leçon couvre le caching des pages en Ionic et l'exploration des cycles de vie supplémentaires disponibles au-delà de ngOnInit. Elle explique comment utiliser les consoles d'observation pour tracker le basculement entre les pages et affiche les différents hooks de cycle de vie (ionViewDidEnter, ionViewDidLeave, ionViewWillEnter, ionViewWillLeave, ionViewDidLoad, ionViewDidUnload). L'objectif est de comprendre en détail le fonctionnement du cache et la pile de navigation pour mieux optimiser les applications Ionic.
Points clés
- Le cache stocke les informations fréquemment utilisées pour optimiser les performances de l'application
- Les cycles de vie supplémentaires (ionViewDidEnter, ionViewDidLeave, ionViewWillEnter, ionViewWillLeave) complètent ngOnInit et onDestroy
- L'intégration de consoles de log dans chaque fonction permet d'observer le basculement entre les pages en temps réel
- La console du navigateur (accessible via Ctrl+C au terminal) permet de vérifier et tracer le comportement des cycles de vie
- La compréhension des cycles de vie est essentielle pour gérer efficacement la pile de navigation et les performances Ionic
Questions fréquentes
Qu'est-ce que le cache dans une application Ionic ?
Le cache est une mémoire qui stocke les informations les plus fréquemment utilisées par l'application, permettant d'optimiser les performances et d'accélérer le chargement des pages.
Quels sont les cycles de vie supplémentaires au-delà de ngOnInit ?
Les cycles de vie supplémentaires spécifiques à Ionic incluent ionViewDidEnter, ionViewDidLeave, ionViewWillEnter, ionViewWillLeave, ionViewDidLoad et ionViewDidUnload, permettant un meilleur contrôle du comportement lors de la navigation.
Comment observer les cycles de vie de ma page Ionic ?
En intégrant des consoles de log dans chaque fonction correspondant aux cycles de vie (dans le fichier component.ts), vous pouvez observer le comportement dans la console du navigateur en appuyant sur Ctrl+C au terminal pour accéder aux logs.