Instagram et Facebook offrent une lecture instantanée et boostent l'engagement des utilisateurs avec Media3 PreloadManager

Dans le monde dynamique des réseaux sociaux, l'attention des utilisateurs se gagne ou se perd rapidement. Les applications Meta (Facebook et Instagram) comptent parmi les plus grands réseaux sociaux au monde et sont utilisées par des milliards de personnes. Pour Meta, diffuser des vidéos de manière fluide n'est pas qu'une simple fonctionnalité, c'est le cœur de l'expérience utilisateur. Les vidéos courtes, en particulier dans le fil d'actualité Facebook et les Reels Instagram, sont devenues un moteur d'engagement majeur. Ils permettent d'exprimer sa créativité et de consommer rapidement des contenus, tout en connectant et en divertissant des personnes du monde entier. 

Cet article de blog explique comment Meta a transformé la lecture vidéo pour des milliards d'utilisateurs en proposant une lecture instantanée.

L'écart de latence dans les vidéos courtes

Les vidéos courtes entraînent des interactions très rapides, car les utilisateurs font défiler leur flux rapidement. Assurer une transition fluide entre les vidéos dans un flux en constante évolution présente des défis uniques pour la lecture instantanée. Nous avons donc besoin de solutions qui vont au-delà de la mise en cache sur disque traditionnelle et des stratégies de lecture réactive standards.

La voie à suivre avec Media3 PreloadManager

Pour répondre à l'évolution des habitudes de consommation liée à l'essor des contenus courts et aux limites de l'architecture de lecture traditionnelle des contenus longs, Jetpack Media3 a introduit PreloadManager. Ce composant permet aux développeurs d'aller au-delà du cache du disque, en offrant un contrôle précis et une personnalisation pour que les contenus multimédias soient prêts en mémoire avant que l'utilisateur n'appuie sur le bouton de lecture. Lisez cette série d'articles de blog pour comprendre les détails techniques de la lecture de contenus multimédias avec PreloadManager.

Comment Meta a réussi à proposer une lecture instantanée

Complexités existantes

Auparavant, Meta utilisait une combinaison de préchauffage (pour préparer les lecteurs) et de préchargement (pour mettre en cache le contenu sur le disque) pour la diffusion de vidéos. Bien que ces méthodes aient permis d'améliorer l'efficacité du réseau, elles ont entraîné des difficultés majeures. Le préchauffage nécessitait l'instanciation séquentielle de plusieurs instances de lecteur, ce qui consommait beaucoup de mémoire et limitait le préchargement à quelques vidéos seulement. Cette forte demande de ressources signifiait qu'une solution plus évolutive et robuste pouvait être appliquée pour offrir la lecture instantanée attendue sur les flux sociaux modernes à défilement rapide.

Intégrer Media3 PreloadManager

Pour obtenir une lecture véritablement instantanée, l'équipe Media Foundation Client de Meta a intégré PreloadManager de Jetpack Media3 à Facebook et Instagram. Ils ont choisi DefaultPreloadManager pour unifier leurs systèmes de préchargement et de lecture. Cette intégration a nécessité de refactoriser l'architecture existante de Meta pour permettre un partage efficace des ressources entre les instances PreloadManager et ExoPlayer. Ce changement stratégique a apporté un avantage architectural clé : la possibilité de paralléliser les tâches de préchargement et de gérer de nombreuses vidéos à l'aide d'une seule instance de lecteur. Cela a considérablement augmenté la capacité de préchargement tout en éliminant les complexités liées à la mémoire élevée de leur approche précédente.

Optimisation et réglage des performances

L'équipe a ensuite effectué des tests et des itérations approfondis pour optimiser les performances sur l'écosystème d'appareils mondial diversifié de Meta. Le préchargement agressif initial entraînait parfois des problèmes, y compris une utilisation accrue de la mémoire et des ralentissements des performances de défilement. Pour résoudre ce problème, ils ont affiné l'implémentation en mesurant soigneusement la mémoire, en tenant compte de la fragmentation des appareils et en adaptant le système à des modèles d'UI spécifiques.

Ajuster l'implémentation à des modèles d'interface utilisateur spécifiques

Meta a appliqué différentes stratégies de préchargement et a adapté le comportement aux modèles d'UI spécifiques de chaque application :

• Fil d'actualité Facebook : l'UI donne la priorité à la vidéo qui apparaît à l'écran. Le gestionnaire ne précharge que la vidéo en cours pour s'assurer qu'elle démarre dès que l'utilisateur arrête de faire défiler l'écran. Cette approche "current-only" (uniquement l'élément actuel) minimise l'espace mémoire utilisé et l'utilisation des données dans un environnement où les utilisateurs peuvent voir de nombreux posts statiques entre les vidéos. Bien que le système soit actuellement conçu pour précharger uniquement la vidéo en cours de lecture, il peut être ajusté pour précharger également les vidéos à venir. 
• Reels Instagram : il s'agit d'un environnement purement vidéo dans lequel les utilisateurs balayent l'écran verticalement. Pour cette UI, l'équipe a mis en œuvre une stratégie de "préchargement adjacent". PreloadManager conserve en mémoire les vidéos qui suivent immédiatement le Reel en cours. Cette approche bidirectionnelle garantit que, que l'utilisateur balaie l'écran vers le haut ou vers le bas, la transition reste instantanée et fluide. La qualité de l'expérience (QoE) s'est ainsi considérablement améliorée, notamment en ce qui concerne le démarrage de la lecture et le délai d'affichage de la première image pour l'utilisateur.

Scaling for a diverse global device ecosystem

Pour faire évoluer une pile vidéo hautes performances sur des milliards d'appareils, il ne suffit pas de précharger les données de manière agressive. Il faut aussi de l'intelligence. Meta a d'abord rencontré des problèmes de saturation de la mémoire et de latence de défilement, en particulier sur les appareils de milieu et d'entrée de gamme. Pour résoudre ce problème, ils ont créé un système de détection de stress des appareils autour de l'implémentation de Media3. Les applications surveillent désormais les signaux d'E/S et de processeur en temps réel. Si un appareil est soumis à une charge importante, le préchargement est mis en pause pour donner la priorité à la réactivité de l'interface utilisateur.

Cette optimisation adaptée à l'appareil garantit que la lecture instantanée ne se fait pas au détriment de la stabilité du système, ce qui permet même aux utilisateurs d'appareils plus anciens de profiter d'un flux plus fluide et sans interruption.

Avantages architecturaux et qualité du code

Au-delà des métriques visibles par l'utilisateur, la migration vers Media3  a apporté des avantages architecturaux à long terme. Bien que le processus d'intégration et de réglage ait nécessité plusieurs itérations pour équilibrer les performances, le codebase obtenu est plus facile à gérer. L'équipe a constaté que l'API PreloadManager s'intégrait parfaitement à l'écosystème Media3 existant, ce qui permettait un meilleur partage des ressources. Pour Meta, l'adoption de Media3 PreloadManager était un investissement stratégique dans l'avenir de la consommation de vidéos. 

En adoptant le préchargement et en ajoutant des portes intelligentes pour les appareils, ils ont réussi à augmenter la durée de visionnage totale sur leurs applications et à améliorer l'engagement global de leur communauté mondiale. 

Impact sur Instagram et Facebook

L'architecture proactive a permis d'améliorer immédiatement et de manière mesurable les performances sur les deux plates-formes. 

• Facebook a constaté un démarrage plus rapide de la lecture, une diminution des taux d'interruption de la lecture et une réduction des mauvaises sessions (comme la remise en mémoire tampon, l'heure de début différée, une qualité inférieure, etc.), ce qui a globalement entraîné une augmentation de la durée de visionnage.
• Instagram a constaté un démarrage plus rapide de la lecture et une augmentation de la durée de visionnage totale. La suppression de la latence de participation (l'intervalle entre l'action de l'utilisateur et l'affichage de la première image) a directement augmenté les métriques d'engagement. La réduction des interruptions dues à la mise en mémoire tampon a permis aux utilisateurs de regarder plus de contenus, ce qui s'est traduit par une amélioration des métriques d'engagement.

Principaux enseignements de l'ingénierie à grande échelle

À mesure que les habitudes de consommation des médias évoluent, la demande d'expériences instantanées continuera de croître. En mettant en œuvre une gestion proactive de la mémoire et en optimisant votre application pour l'évolutivité et la diversité des appareils, vous vous assurez qu'elle peut répondre efficacement à ces attentes.

• Prioriser le préchargement intelligent

Concentrez-vous sur la fiabilité de l'expérience en réduisant les saccades et les temps de chargement grâce au préchargement. Plutôt que de simplement mettre en cache le disque, le préchargement au niveau de la mémoire garantit que le contenu est prêt dès qu'un utilisateur interagit avec lui.

• Aligner votre implémentation sur les modèles d'UI

Personnalisez le comportement de préchargement en fonction de l'UI de votre application. Par exemple, utilisez une sélection "current-only" (uniquement l'élément actuel) pour les flux mixtes comme Facebook afin d'économiser de la mémoire, et une stratégie "adjacent preload" (préchargement des éléments adjacents) pour les environnements verticaux comme les Reels Instagram.

• Exploiter Media3 pour un code sain à long terme

L'intégration aux API Media3 plutôt qu'à une solution de mise en cache personnalisée permet un meilleur partage des ressources entre le lecteur et le PreloadManager, ce qui vous permet de gérer plusieurs vidéos avec une seule instance de lecteur. Cela permet d'obtenir un codebase évolutif que les équipes d'ingénieurs peuvent non seulement gérer et optimiser plus facilement au fil du temps, mais aussi faire bénéficier des dernières mises à jour de fonctionnalités.

• Implémenter des optimisations adaptées aux appareils

Élargissez votre portée sur le marché en effectuant des tests sur différents appareils, y compris des modèles d'entrée et de milieu de gamme. Utilisez des signaux en temps réel tels que le processeur, la mémoire et les E/S pour adapter les fonctionnalités et l'utilisation des ressources de manière dynamique.

En savoir plus

Pour commencer et en savoir plus, accédez à .

• Consultez la documentation sur PreloadManager de Media3.
• Pour en savoir plus sur les aspects techniques et l'implémentation, lisez la série d'articles de blog.
  • Partie 1 : Présentation du préchargement avec Media3
  • Partie 2 : Présentation détaillée de PreloadManager de Media3
• Consultez l'exemple d'application pour voir le préchargement en action.

Vous connaissez maintenant les secrets de la lecture instantanée. Essayez-les !