Fallstudien

Sofortige Wiedergabe und höhere Nutzerinteraktion auf Instagram und Facebook mit Media3 PreloadManager

Lesezeit: 4 Minuten
Mayuri Khinvasara Khabya
Developer Relations Engineer

In der dynamischen Welt der sozialen Medien lässt sich die Aufmerksamkeit der Nutzer schnell gewinnen oder verlieren. Meta-Apps (Facebook und Instagram) gehören zu den weltweit größten sozialen Plattformen und werden von Milliarden Nutzern auf der ganzen Welt verwendet. Für Meta ist die nahtlose Bereitstellung von Videos nicht nur eine Funktion, sondern das Herzstück der Nutzererfahrung. Kurzvideos, insbesondere im Facebook-Newsfeed und auf Instagram Reels, sind zu einem wichtigen Faktor für das Engagement geworden. Sie ermöglichen kreative Ausdrucksformen und schnellen Konsum von Inhalten und verbinden und unterhalten Menschen auf der ganzen Welt. 

In diesem Blogbeitrag erfahren Sie, wie Meta die Videowiedergabe für Milliarden von Nutzern durch die Bereitstellung einer echten Sofortwiedergabe revolutioniert hat.

Die Latenzlücke bei Shortform-Videos

Kurzvideos führen zu sehr schnellen Interaktionen, da Nutzer schnell durch ihre Feeds scrollen. Ein nahtloser Übergang zwischen Videos in einem sich ständig ändernden Feed stellt besondere Herausforderungen für die sofortige Wiedergabe dar. Daher benötigen wir Lösungen, die über das herkömmliche Festplatten-Caching und die standardmäßigen reaktiven Wiedergabestrategien hinausgehen.

Der weitere Weg mit Media3 PreloadManager

Um den veränderten Konsumgewohnheiten durch den Anstieg von Kurzvideos und den Einschränkungen der herkömmlichen Architektur für die Wiedergabe von Videos im Langformat Rechnung zu tragen, wurde in Jetpack Media3 der PreloadManager eingeführt. Mit dieser Komponente können Entwickler über das Datenträger-Caching hinausgehen und die Medien im Arbeitsspeicher bereithalten, bevor der Nutzer auf „Wiedergabe“ tippt. In dieser Blogreihe finden Sie technische Details zur Medienwiedergabe mit PreloadManager.

So hat Meta die sofortige Wiedergabe erreicht

Bestehende Komplexitäten

Bisher hat Meta für die Videoauslieferung eine Kombination aus Warmup (um die Player vorzubereiten) und Prefetch (um Inhalte auf der Festplatte im Cache zu speichern) verwendet. Diese Methoden trugen zwar zur Verbesserung der Netzwerkeffizienz bei, brachten aber auch erhebliche Herausforderungen mit sich. Für das Aufwärmen mussten mehrere Player-Instanzen sequenziell instanziiert werden, was viel Arbeitsspeicher beanspruchte und das Vorabladen auf nur wenige Videos beschränkte. Dieser hohe Ressourcenbedarf bedeutete, dass eine skalierbarere, robuste Lösung angewendet werden konnte, um die sofortige Wiedergabe zu ermöglichen, die in modernen, schnell scrollenden sozialen Feeds erwartet wird.

Media3 PreloadManager einbinden

Um eine wirklich sofortige Wiedergabe zu ermöglichen, hat das Media Foundation Client-Team von Meta den Jetpack Media3 PreloadManager in Facebook und Instagram integriert. Sie haben sich für den DefaultPreloadManager entschieden, um ihre Preloading- und Wiedergabesysteme zu vereinheitlichen. Für diese Integration musste die vorhandene Architektur von Meta umgestaltet werden, um eine effiziente gemeinsame Nutzung von Ressourcen zwischen den Instanzen von „PreloadManager“ und „ExoPlayer“ zu ermöglichen. Diese strategische Änderung bot einen wichtigen architektonischen Vorteil: Die Möglichkeit, das Vorladen von Aufgaben zu parallelisieren und viele Videos mit einer einzigen Player-Instanz zu verwalten. Dadurch wurde die Preloading-Kapazität erheblich gesteigert und die hohe Komplexität des Arbeitsspeichers, die mit dem vorherigen Ansatz verbunden war, konnte vermieden werden.

colinKho.png

Optimierung und Leistungsoptimierung

Das Team führte dann umfangreiche Tests und Iterationen durch, um die Leistung im vielfältigen globalen Geräte-Ökosystem von Meta zu optimieren. Anfangs führte aggressives Vorabladen manchmal zu Problemen, darunter eine erhöhte Arbeitsspeichernutzung und eine Verlangsamung der Scrollleistung. Um das Problem zu beheben, haben sie die Implementierung durch sorgfältige Speichermessungen optimiert, die Gerätefragmentierung berücksichtigt und das System an bestimmte UI-Muster angepasst.

Implementierung für bestimmte UI-Muster optimieren

Meta hat verschiedene Preloading-Strategien angewendet und das Verhalten an die spezifischen UI-Muster der einzelnen Apps angepasst:

  • Facebook-Newsfeed: In der Benutzeroberfläche wird das Video, das gerade in den Blick kommt, priorisiert. Der Manager lädt nur das aktuelle Video vor, damit es sofort startet, wenn der Nutzer das Scrollen pausiert. Durch die Beschränkung auf das Aktuelle werden Daten- und Arbeitsspeicherbedarf in einer Umgebung minimiert, in der Nutzer möglicherweise viele statische Beiträge zwischen Videos sehen. Derzeit ist das System so konzipiert, dass nur das angezeigte Video vorab geladen wird. Es kann aber so angepasst werden, dass auch zukünftige Videos vorab geladen werden. 
  • Instagram Reels: Hier werden ausschließlich Videos präsentiert und Nutzer wischen vertikal. Für diese Benutzeroberfläche hat das Team eine angrenzende Preload-Strategie implementiert. Der PreloadManager hält die Videos unmittelbar nach dem aktuellen Reel im Arbeitsspeicher bereit. Dieser bidirektionale Ansatz sorgt dafür, dass der Übergang sofort und reibungslos erfolgt, unabhängig davon, ob ein Nutzer nach oben oder unten wischt. Das Ergebnis war eine deutliche Verbesserung der Quality of Experience (QoE), einschließlich Verbesserungen bei der Wiedergabestartzeit und der Zeit bis zum ersten Frame für den Nutzer.

Skalierung für ein vielfältiges globales Geräte-Ökosystem

Um einen leistungsstarken Videostack auf Milliarden von Geräten zu skalieren, ist mehr als nur aggressives Vorladen erforderlich. Es ist Intelligenz erforderlich. Meta hatte anfangs Probleme mit Arbeitsspeicherdruck und Scroll-Verzögerungen, insbesondere bei Hardware im mittleren bis unteren Preissegment. Um dieses Problem zu beheben, haben sie ein System zur Erkennung von Gerätebelastungen auf Basis der Media3-Implementierung entwickelt. Die Apps überwachen jetzt I/O- und CPU-Signale in Echtzeit. Wenn ein Gerät stark ausgelastet ist, wird das Vorladen pausiert, um die Reaktionsfähigkeit der Benutzeroberfläche zu priorisieren.

Durch diese gerätebewusste Optimierung wird sichergestellt, dass der Vorteil der sofortigen Wiedergabe nicht auf Kosten der Systemstabilität geht. So können auch Nutzer mit älterer Hardware einen flüssigeren, unterbrechungsfreien Feed genießen.

mirabelHu.png

Architektonische Vorteile und Code-Integrität

Neben den nutzerorientierten Messwerten bot die Migration zu Media3 PreloadManager langfristige architektonische Vorteile. Für die Integration und Abstimmung waren zwar mehrere Iterationen erforderlich, um die Leistung auszugleichen, aber die resultierende Codebasis ist wartungsfreundlicher. Das Team stellte fest, dass sich die PreloadManager API problemlos in das bestehende Media3-Ökosystem integrieren ließ, was eine bessere gemeinsame Nutzung von Ressourcen ermöglichte. Für Meta war die Einführung von Media3 PreloadManager eine strategische Investition in die Zukunft des Videokonsums. 

Durch die Einführung von Preloading und das Hinzufügen von geräteintelligenten Gates konnten sie die gesamte Wiedergabezeit in ihren Apps steigern und das Engagement ihrer globalen Community insgesamt verbessern. 

Auswirkungen auf Instagram und Facebook

Die proaktive Architektur führte auf beiden Plattformen zu sofortigen und messbaren Verbesserungen. 

  • Bei Facebook wurden schnellere Wiedergabestarts, geringere Raten für Wiedergabeverzögerungen und weniger fehlerhafte Sitzungen (z. B. erneutes Zwischenspeichern, verzögerte Startzeit, geringere Qualität usw.) beobachtet,was insgesamt zu einer höheren Wiedergabezeit führte. 
  • Auf Instagram wurden Wiedergaben schneller gestartet und die Wiedergabezeit insgesamt stieg. Durch die Eliminierung der Join-Latenz (das Intervall zwischen der Nutzeraktion und der Anzeige des ersten Frames) wurden die Engagement-Messwerte direkt gesteigert. Durch die weniger Unterbrechungen aufgrund des geringeren Bufferns sahen sich die Nutzer mehr Inhalte an, was sich in den Interaktionsmesswerten zeigte.
beforeAfterPreload.gif

Wichtige Erkenntnisse aus dem Engineering

Da sich die Medienkonsumgewohnheiten weiterentwickeln, wird die Nachfrage nach sofortigen Erlebnissen weiter steigen. Durch die Implementierung eines proaktiven Speichermanagements und die Optimierung für Skalierbarkeit und Gerätevielfalt kann Ihre Anwendung diese Erwartungen effizient erfüllen.

  • Intelligentes Vorabladen priorisieren

Konzentrieren Sie sich darauf, eine zuverlässige Wiedergabe zu ermöglichen, indem Sie durch Preloading Ruckler und Ladezeiten minimieren. Anstelle von einfachem Festplatten-Caching wird durch das Vorladen auf Speicherebene dafür gesorgt, dass Inhalte sofort verfügbar sind, wenn ein Nutzer mit ihnen interagiert.

  • Implementierung an UI-Mustern ausrichten

Passen Sie das Vorabladen an die Benutzeroberfläche Ihrer App an. Verwenden Sie beispielsweise für gemischte Feeds wie Facebook den Fokus „Nur aktuell“, um Speicherplatz zu sparen, und für vertikale Umgebungen wie Instagram Reels die Strategie „Benachbartes Vorladen“.

preloadingStrategy.png
  • Media3 für langfristige Code-Integrität nutzen

Durch die Integration mit Media3-APIs anstelle einer benutzerdefinierten Caching-Lösung können Ressourcen besser zwischen dem Player und dem PreloadManager geteilt werden. So lassen sich mehrere Videos mit einer einzigen Player-Instanz verwalten. Das Ergebnis ist eine zukunftssichere Codebasis, die für Entwicklerteams nicht nur einfacher zu warten und zu optimieren ist, sondern auch von den neuesten Funktionsupdates profitiert.

  • Gerätebezogene Optimierungen implementieren

Erweitern Sie Ihre Marktabdeckung, indem Sie auf verschiedenen Geräten testen, einschließlich Modellen der Mittel- und Einstiegsklasse. Verwenden Sie Echtzeitsignale wie CPU, Arbeitsspeicher und E/A, um Funktionen und Ressourcennutzung dynamisch anzupassen.

Weitere Informationen

 Weitere Informationen 

Jetzt kennen Sie die Geheimnisse für die sofortige Wiedergabe. Probieren Sie es einfach aus.

Verfasst von:

Weiterlesen