Nel mondo dinamico dei social media, l'attenzione degli utenti si guadagna o si perde rapidamente. Le app di Meta (Facebook e Instagram) sono tra le piattaforme social più grandi del mondo e servono miliardi di utenti a livello globale. Per Meta, la riproduzione fluida dei video non è solo una funzionalità, ma il fulcro dell'esperienza utente. I video nel formato breve, in particolare il feed di Facebook e i Reel di Instagram, sono diventati un motore principale del coinvolgimento. Consentono l'espressione creativa e il consumo rapido di contenuti, mettendo in contatto e intrattenendo persone in tutto il mondo. 

Questo post del blog ti illustra il percorso di Meta per trasformare la riproduzione video per miliardi di utenti offrendo una vera riproduzione istantanea.

Il divario di latenza nei video nel formato breve

I video nel formato breve portano a interazioni molto rapide, poiché gli utenti scorrono rapidamente i feed. Offrire una transizione fluida tra i video in un feed in continua evoluzione introduce ostacoli unici per la riproduzione istantanea. Pertanto, abbiamo bisogno di soluzioni che vadano oltre la memorizzazione nella cache su disco tradizionale e le strategie di riproduzione reattiva standard.

Il percorso da seguire con Media3 PreloadManager

Per affrontare i cambiamenti nelle abitudini di consumo dovuti all'aumento dei contenuti nel formato breve e alle limitazioni dell'architettura di riproduzione nel formato lungo tradizionale, Jetpack Media3 ha introdotto PreloadManager. Questo componente consente agli sviluppatori di andare oltre la memorizzazione nella cache su disco, offrendo un controllo granulare e la personalizzazione per mantenere i contenuti multimediali pronti in memoria prima che l'utente prema il pulsante di riproduzione. Leggi questa serie di post del blog per comprendere i dettagli tecnici della riproduzione di contenuti multimediali con PreloadManager.

Come Meta ha ottenuto una vera riproduzione istantanea

Complessità esistenti

In precedenza, Meta utilizzava una combinazione di riscaldamento (per preparare i player) e precaricamento (per memorizzare nella cache i contenuti sul disco) per la distribuzione dei video. Sebbene questi metodi abbiano contribuito a migliorare l'efficienza della rete, hanno introdotto sfide significative. Il riscaldamento richiedeva l'istanza di più istanze del player in sequenza, che consumavano una quantità significativa di memoria e limitavano il precaricamento a pochi video. Questa elevata richiesta di risorse significava che era possibile applicare una soluzione più scalabile e robusta per offrire la riproduzione istantanea prevista nei feed social moderni a scorrimento rapido.

Integrazione di Media3 PreloadManager

Per ottenere una riproduzione veramente istantanea, il team di Media Foundation Client di Meta ha integrato Jetpack Media3 PreloadManager in Facebook e Instagram. Ha scelto DefaultPreloadManager per unificare i sistemi di precaricamento e riproduzione. Questa integrazione ha richiesto il refactoring dell'architettura esistente di Meta per consentire la condivisione efficiente delle risorse tra le istanze di PreloadManager ed ExoPlayer. Questo cambiamento strategico ha fornito un vantaggio architettonico fondamentale: la possibilità di parallelizzare le attività di precaricamento e gestire molti video utilizzando una singola istanza del player. Ciò ha aumentato notevolmente la capacità di precaricamento, eliminando al contempo le elevate complessità di memoria dell'approccio precedente.

Ottimizzazione e regolazione delle prestazioni

Il team ha quindi eseguito test e iterazioni approfonditi per ottimizzare le prestazioni nell'ecosistema di dispositivi globali diversificato di Meta. Il precaricamento iniziale aggressivo a volte causava problemi, tra cui un aumento della memoria utilizzata e rallentamenti delle prestazioni di scorrimento. Per risolvere il problema, ha ottimizzato l'implementazione utilizzando misurazioni accurate della memoria, tenendo conto della frammentazione dei dispositivi e adattando il sistema a pattern UI specifici.

Ottimizzazione dell'implementazione per pattern UI specifici

Meta ha applicato diverse strategie di precaricamento e ha adattato il comportamento in base ai pattern UI specifici di ogni app:

• Feed di Facebook: l'UI dà la priorità al video attualmente in visualizzazione. Il gestore precarica solo il video corrente per assicurarsi che inizi nel momento in cui l'utente mette in pausa lo scorrimento. Questo approccio "solo corrente" riduce al minimo i footprint di dati e memoria in un ambiente in cui gli utenti potrebbero vedere molti post statici tra i video. Sebbene il sistema sia attualmente progettato per precaricare solo il video in visualizzazione, può essere modificato per precaricare anche i video futuri. 
• Reel di Instagram: si tratta di un ambiente video puro in cui gli utenti scorrono verticalmente. Per questa UI, il team ha implementato una strategia di "precaricamento adiacente". PreloadManager mantiene i video immediatamente dopo il Reel corrente pronti in memoria. Questo approccio bidirezionale garantisce che, indipendentemente dal fatto che un utente scorra verso l'alto o verso il basso, la transizione rimanga istantanea e fluida. Il risultato è stato un miglioramento significativo della qualità dell'esperienza (QoE), inclusi miglioramenti nell'avvio della riproduzione e nel tempo al primo frame per l'utente.

Scalabilità per un ecosistema di dispositivi globali diversificato

La scalabilità di uno stack video ad alte prestazioni su miliardi di dispositivi richiede più di un semplice precaricamento aggressivo: richiede intelligenza. Meta ha dovuto affrontare sfide iniziali con la pressione della memoria e il ritardo di scorrimento, in particolare sull'hardware di fascia medio-bassa. Per risolvere il problema, ha creato un sistema di rilevamento dello stress del dispositivo basato sull'implementazione di Media3. Ora le app monitorano i segnali di I/O e CPU in tempo reale. Se un dispositivo è sottoposto a un carico elevato, il precaricamento viene messo in pausa per dare la priorità alla reattività dell'UI.

Questa ottimizzazione basata sul dispositivo garantisce che il vantaggio della riproduzione istantanea non vada a scapito della stabilità del sistema, consentendo anche agli utenti con hardware meno recente di usufruire di un feed più fluido e senza interruzioni.

Vantaggi architettonici e integrità del codice

Oltre alle metriche rivolte agli utenti, la migrazione a Media3 PreloadManager ha offerto vantaggi architettonici a lungo termine. Sebbene il processo di integrazione e ottimizzazione abbia richiesto più iterazioni per bilanciare le prestazioni, la codebase risultante è più gestibile. Il team ha scoperto che l'API PreloadManager si integrava perfettamente con l'ecosistema Media3 esistente, consentendo una migliore condivisione delle risorse. Per Meta, l'adozione di Media3 PreloadManager è stato un investimento strategico nel futuro del consumo di video. 

Adottando il precaricamento e aggiungendo gate intelligenti per i dispositivi, ha aumentato con successo il tempo di visualizzazione totale sulle sue app e migliorato il coinvolgimento complessivo della sua community globale. 

Impatto risultante su Instagram e Facebook

L'architettura proattiva ha portato a miglioramenti immediati e misurabili su entrambe le piattaforme. 

• Facebook ha registrato avvii di riproduzione più rapidi, una riduzione dei tassi di blocco della riproduzione e una riduzione delle sessioni non valide (come il rebuffer, il tempo di avvio ritardato, la qualità inferiore e così via), il che ha comportato un aumento del tempo di visualizzazione complessivo. 
• Instagram ha registrato avvii di riproduzione più rapidi e un aumento del tempo di visualizzazione totale. L'eliminazione della latenza di join (l'intervallo tra l'azione dell'utente e la visualizzazione del primo frame) ha aumentato direttamente le metriche di coinvolgimento. Le minori interruzioni dovute alla riduzione del buffering hanno fatto sì che gli utenti guardassero più contenuti, come dimostrano le metriche di coinvolgimento.

Principali insegnamenti di ingegneria su larga scala

Con l'evolversi delle abitudini di consumo dei contenuti multimediali, la domanda di esperienze istantanee continuerà a crescere. L'implementazione della gestione proattiva della memoria e l'ottimizzazione per la scalabilità e la diversità dei dispositivi garantiscono che l'applicazione possa soddisfare queste aspettative in modo efficiente.

• Dai la priorità al precaricamento intelligente

Concentrati sull'offerta di un'esperienza affidabile riducendo al minimo i blocchi e i tempi di caricamento tramite il precaricamento. Anziché una semplice memorizzazione nella cache su disco, l'utilizzo del precaricamento a livello di memoria garantisce che i contenuti siano pronti nel momento in cui un utente interagisce con essi.

• Allinea l'implementazione ai pattern UI

Personalizza il comportamento di precaricamento in base all'UI delle tue app. Ad esempio, utilizza un approccio "solo corrente" per i feed misti come Facebook per risparmiare memoria e una strategia di "precaricamento adiacente" per gli ambienti verticali come i Reel di Instagram.

• Utilizza Media3 per l'integrità del codice a lungo termine

L'integrazione con le API Media3 anziché con una soluzione di memorizzazione nella cache personalizzata consente una migliore condivisione delle risorse tra il player e PreloadManager, consentendoti di gestire più video con una singola istanza del player. Il risultato è una codebase a prova di futuro che è più facile da mantenere e ottimizzare nel tempo per i team di ingegneria, ma anche da sfruttare gli ultimi aggiornamenti delle funzionalità.

• Implementa ottimizzazioni basate sul dispositivo

Amplia la tua portata di mercato eseguendo test su vari dispositivi, inclusi i modelli di fascia medio-bassa. Utilizza segnali in tempo reale come CPU, memoria e I/O per adattare dinamicamente le funzionalità e l'utilizzo delle risorse.

Scopri di più

Per iniziare e scoprire di più, visita 

• Esplora la documentazione di Media3 PreloadManager.
• Leggi la serie di post del blog per dettagli tecnici e di implementazione avanzati.
  • Parte 1: Introduzione al precaricamento con Media3
  • Parte 2: Approfondimento su PreloadManager di Media3
• Dai un'occhiata all'app di esempio per vedere il precaricamento in azione.

Ora conosci i segreti della riproduzione istantanea. Provali subito.