Mise en cache d’applications pour votre application d’onglet
La mise en cache des applications améliore le temps de lancement ultérieur des applications dans Teams en vous permettant de conserver en mémoire certaines ressources et ressources que vous pouvez utiliser lors de la réhydratation de votre application.
La mise en cache des applications est prise en charge pour les éléments suivants :
Portée | Ordinateur de bureau | iOS | Android |
---|---|---|---|
Personnel | ✔️ Durée de vie du cache : 30 minutes | ✔️ | ❌ |
Conversation | ✔️ Durée de vie du cache : 30 minutes | ✔️ | ❌ |
Canal | ✔️ Durée de vie du cache : 30 minutes | ✔️ | ❌ |
Onglet Réunion | ✔️ Durée de vie du cache : 30 minutes | ✔️ | ❌ |
Panneau latéral de réunion ou applications en réunion | ✔️ Durée de vie du cache : 20 minutes | ❌ | ❌ |
Activer la mise en cache des applications
Pour activer la mise en cache des applications, procédez comme suit :
Appelez
teamsCore.registerBeforeUnloadHandler
etteamsCore.registerOnLoadHandler
API.Utilisez et
entityId
passezcontentUrl
dans le gestionnaire de charge pour acheminer vers la page correcte de votre application et appelernotifySuccess
ounotifyFailure
pour informer le client Teams que le flux d’initialisation de l’application est terminé.- contentUrl : ajouter l’URL de la page de contenu.
- entityId : ajoutez un identificateur unique.
Supprimez les ressources et effectuez tout nettoyage nécessaire dans le
beforeUnload
gestionnaire, puis appelez le rappel pour informer lereadyToUnload
client Teams que le flux de déchargement de l’application est terminé.
Voici le diagramme de flux du premier lancement d’une application qui souhaite choisir la mise en cache de l’application (inscrire ou load
beforeUnload
lors du premier lancement de l’application) :
Voici le diagramme de flux du lancement de l’application mise en cache :
Lorsque vous optez pour la mise en cache de l’application, l’iframe ou l’affichage web utilisé pour héberger l’application incorporée est réutilisé lorsque les utilisateurs accèdent à différentes instances de l’application dans une fenêtre. L’iframe ou la vue web utilisée pour héberger l’application est masqué lorsque les utilisateurs quittent l’application et s’affiche quand les utilisateurs reviennent à l’application.
Remarque
Si la mise en cache de l’application n’est pas activée, l’iframe ou la vue web est recréée chaque fois que l’utilisateur lance l’application.
Il existe plusieurs raisons pour lesquelles une application n’est pas mise en cache ou pour qu’une application soit supprimée du cache, certaines des raisons en sont (les nombres ici sont susceptibles d’être modifiés) :
- Si la charge de mémoire système est élevée, l’application est supprimée du cache.
- Si le nombre d’applications mises en cache dépasse la taille maximale du cache, l’application mise en cache la plus ancienne est supprimée du cache.
- L’application n’est pas mise en cache si Teams ne reçoit pas le
readyToUnload
signal de l’application dans les 30 secondes après l’envoi de labeforeUnload
notification. - La mise en cache des applications est désactivée si la mémoire système est inférieure à 4 Go ou si la mémoire disponible est inférieure à 1 Go sur Windows ou 512 Mo sur Mac.
- Le panneau latéral est le seul frameContext pris en charge pour la mise en cache des applications dans les réunions.
- La mise en cache des applications n’est pas prise en charge pour les réunions où le nombre d’utilisateurs invités est supérieur à 20.
- Si le chargement d’une application échoue, l’application n’est pas mise en cache.
- Sur iOS, lorsque l’application Teams est arrêtée, l’application est supprimée du cache.
Exemple de code
L’extrait de code suivant est un exemple d’API teamsCore.registerOnLoadHandler
et teamsCore.registerBeforeUnloadHandler
:
microsoftTeams.teamsCore.registerOnLoadHandler((data) => {
console.log("got load from TEAMS", data.contentUrl, data.entityId);
// use contentUrl to route to correct page
// invoke notifySuccess when ready
app.notifySuccess();
});
microsoftTeams.teamsCore.registerBeforeUnloadHandler((readyToUnload) => {
// dispose resources and then invoke readyToUnload
readyToUnload();
return true;
});
Outil de débogage pour les applications mises en cache
Remarque
L’outil de débogage pour les applications mises en cache est disponible en préversion publique pour les développeurs.
Vous pouvez activer le Gestionnaire des tâches Proto dans Teams, un outil de débogage qui montre les status de vos applications mises en cache. Dans votre client Teams, sélectionnez les touches Ctrl+Maj+Alt+8 sur Windows ou Commande+Maj+Option+8 sur Mac pour ouvrir le Gestionnaire des tâches Proto.
L’onglet AppCaching contient les détails suivants :
- state : affiche l’état mis en cache ou non mis en cache de l’application.
- isActive : affiche le status actif ou inactif de l’application mise en cache.
- timeElapsed : indique le temps écoulé depuis la mise en cache de l’application.
-
supportsLoad : indique si l’application a inscrit le gestionnaire si la
Load
mise en cache de l’application est activée. -
supportsBeforeUnload : indique si l’application a inscrit le gestionnaire si la mise en cache de l’application
BeforeUnload
est activée. - totalFrameMemory : affiche l’utilisation de la mémoire de l’application.
- totalFrameCommitMemory : affiche l’utilisation du processeur de l’application.
Applications d’onglet de précaching
Remarque
- Les applications d’onglet précaching sont disponibles dans la préversion publique pour les développeurs.
- Le précaching des applications d’onglet est pris en charge uniquement dans les clients web et de bureau Teams.
Bien que la mise en cache réduise les temps de chargement suivants d’une application, le précaching optimise le temps de chargement initial d’une application en permettant à Teams de précharger l’application. Teams précharge les applications en arrière-plan après le lancement ou en cas d’inactivité, en fonction des modèles d’utilisation récents des applications des utilisateurs et de l’historique du cache des applications. Les applications préchargées restent mises en cache jusqu’à ce que l’utilisateur ouvre l’application, ce qui entraîne un temps de chargement plus rapide.
Si vous activez le précaching, votre application utilise des ressources et les données de télémétrie sont suivies dans un état précached. Pour savoir comment optimiser votre application pour le précaching, consultez les meilleures pratiques.
Activer le précaching pour l’application onglet
Pour activer le précaching pour votre application d’onglet, procédez comme suit :
Mettez à jour le manifeste de votre application comme suit :
Définissez la valeur de
showLoadingIndicator
surtrue
. Cette action garantit que Teams attend que votre application envoienotifySuccess
pour conclure la séquence de chargement de l’application pendant le précaching. Pour plus d’informations, consultez showLoadingIndicator.Ajoutez l’objet
backgroundLoadConfiguration
et définissez lecontentUrl
.{ "backgroundLoadConfiguration": { "tabConfiguration": { "contentUrl": "https://www.contoso.com/content?host=msteams&isBackgroundLoad=true" } } }
Remarque
- Le ne peut pas contenir de paramètres spécifiques au contexte, tels que l’URL
contentUrl
du site d’équipe ou l’ID de thread, car Teams charge des applications sans contexte antérieur au lancement. - Le
contentUrl
doit être suffisamment générique pour être chargé en arrière-plan sans aucune interaction de l’utilisateur.
Pour plus d’informations, consultez backgroundLoadConfiguration.
- Le ne peut pas contenir de paramètres spécifiques au contexte, tels que l’URL
Surveiller le chargement en arrière-plan
Vous pouvez déterminer si Teams a chargé l’application en arrière-plan sans interaction de l’utilisateur si vous surveillez la isBackgroundLoad
propriété. Si l’état de la propriété est true
, cela indique que Teams a chargé l’application en arrière-plan et n’est pas en mesure d’interagir avec l’utilisateur. Par conséquent, l’application n’a pas besoin de restituer des éléments d’interface utilisateur tels que des invites de connexion.
Surveillez la isBackgroundLoad
propriété dans le contexte de l’application pour optimiser l’application pour un chargement et un rendu de précache efficaces. Pour plus d’informations, consultez isBackgroundLoad.
Meilleures pratiques
Voici les meilleures pratiques pour la mise en cache et la précaching des applications :
Nous vous recommandons d’implémenter des fonctionnalités de stockage web ou de service worker pour stocker les données ou la vue web localement. Cela permet de charger l’application plus rapidement lors des lancements suivants.
Inscrivez les
beforeUnload
gestionnaires etonLoad
juste après l’appelapp.initialize
et avant que l’application n’envoienotifySuccess
. Si le client Teams ne voit pas ces inscriptions avant que l’utilisateur quitte l’application, l’application n’est pas mise en cache.Le précaching augmente le trafic vers votre application en plus des demandes lancées par l’utilisateur. Assurez-vous que le point de terminaison que vous fournissez en tant que
contentUrl
peut gérer les demandes en arrière-plan plusieurs fois pour chaque utilisateur dans une journée. Veillez à effectuer les ajustements de télémétrie nécessaires pour prendre en charge le chargement en arrière-plan de l’application.Vérifiez que votre application utilise moins de 130 Mo de mémoire dans l’état précached.
Limitations
Voici les limitations de la mise en cache des applications :
Les applications monopage qui utilisent le routage côté client pour la navigation dans les pages peuvent tirer parti de la mise en cache des applications. Il est recommandé d’utiliser le même domaine dans tous les contextes du lancement de votre application.
Les applications doivent se réinscrire pour des événements tels que
themeChange
,focusEnter
, et ainsi de suite, dans le gestionnaire de charge. Le client Teams n’envoie aucune notification à l’application lorsqu’elle est mise en cache. Si votre application nécessite des notifications même lorsqu’elle est mise en cache, la mise en cache n’est peut-être pas la solution appropriée.Le client Teams appelle le
loadHandler
uniquement une fois launload
séquence de l’application terminée. Par exemple, si un utilisateur lance l’onglet A de votre application, puis l’onglet B de la même application, l’onglet B n’obtient pas le signal de chargement tant que l’onglet A n’appelle pas lereadyToUnload
rappel.Les applications sont mises en cache par fenêtre. La mise en cache des applications se produit par application (et non par onglet) dans la même fenêtre.
La mise en cache des applications n’est pas prise en charge pour les contextes de la phase de réunion ou de la boîte de dialogue (appelé module de tâche dans TeamsJS v1.x), car ceux-ci peuvent être ouverts au-dessus de l’onglet et le même iframe ou vue web ne peut pas être utilisé pour afficher le contenu dans l’onglet et la boîte de dialogue.
Inscrivez uniquement le
beforeUnload
gestionnaire si votre application ne nécessite pas de mise en cache de l’application, mais qu’elle a besoin de temps pour enregistrer l’état en toute sécurité (car quitter l’application peut entraîner la suppression abrupte du contenu de l’application du modèle DOM (Document Object Model)). Si l’application n’est pas inscrite pour l’événementload
, elle est supprimée du DOM une fois leunload
flux terminé.Suivez les instructions de cette section pour intégrer votre application à la mise en cache des applications dans une réunion Teams. Pour la prise en charge de la mise en cache des applications uniquement dans les réunions, inscrivez les
load
gestionnaires oubeforeUnload
si le contexte estsidePanel
.Les applications sont censées être mises en veille lorsqu’elles sont mises en cache (utiliser des ressources réseau ou de calcul minimales et réduire les demandes de SDK). Tous les gestionnaires d’inscription et les demandes suivantes du Kit de développement logiciel (SDK) sont autorisés lorsque l’application est mise en cache :
initialize
notifyappLoaded
notifySuccess
notifyFailure
notifyExpectedFailure
getContext
getAuthToken
readyToUnload
getConfig/getSettings
Résolution des problèmes
Les applications ne sont pas mises en cache ? Pourquoi le gestionnaire de charge n’est-il pas appelé lors de la navigation suivante ?
Vérifiez si les contraintes système et mémoire disponible sont respectées.
Réduisez l’empreinte mémoire lors de la mise en cache. Utilisez le
beforeUnload
gestionnaire pour supprimer les ressources, par exemple libérer des références et supprimer les écouteurs d’événements qui peuvent ne pas être nécessaires lorsqu’ils sont mis en cache.
Exemple de code
Exemple de nom | Description | Node.js |
---|---|---|
Mise en cache des applications | Exemple d’application pour montrer le fonctionnement de la mise en cache des applications dans le panneau latéral de la réunion. | View |