Estudos de caso

O Instagram e o Facebook oferecem reprodução instantânea e aumentam o engajamento do usuário com o PreloadManager da Media3

Leitura de 4 minutos
Mayuri Khinvasara Khabya
Engenheira de relações com desenvolvedores

No mundo dinâmico das redes sociais, a atenção do usuário é conquistada ou perdida rapidamente. Os apps da Meta (Facebook e Instagram) estão entre as maiores plataformas sociais do mundo e atendem a bilhões de usuários em todo o mundo. Para a Meta, oferecer vídeos sem problemas não é apenas um recurso, mas sim o núcleo da experiência do usuário. Os vídeos mais curtos, principalmente no Feed de Notícias do Facebook e nos Reels do Instagram, se tornaram um dos principais fatores de engajamento. Eles permitem a expressão criativa e o consumo rápido de conteúdo, conectando e entretendo pessoas no mundo todo. 

Esta postagem do blog mostra como a Meta transformou a reprodução de vídeo para bilhões de pessoas ao oferecer uma reprodução instantânea de verdade.

A lacuna de latência em vídeos mais curtos

Os vídeos mais curtos levam a interações muito rápidas, já que os usuários rolam os feeds rapidamente. Oferecer uma transição perfeita entre vídeos em um feed em constante mudança apresenta desafios únicos para a reprodução instantânea. Por isso, precisamos de soluções que vão além do cache de disco tradicional e das estratégias de reprodução reativa padrão.

O caminho a seguir com o PreloadManager do Media3

Para lidar com as mudanças nos hábitos de consumo devido ao aumento do conteúdo curto e às limitações da arquitetura tradicional de reprodução de conteúdo longo, o Jetpack Media3 introduziu o PreloadManager. Esse componente permite que os desenvolvedores vão além do cache em disco, oferecendo controle granular e personalização para manter a mídia pronta na memória antes de o usuário clicar em "Reproduzir". Leia esta série de posts do blog para entender detalhes técnicos sobre a reprodução de mídia com o PreloadManager.

Como a Meta alcançou a reprodução instantânea

Complexidades atuais

Antes, a Meta usava uma combinação de aquecimento (para preparar os jogadores) e pré-busca (para armazenar conteúdo em cache no disco) para a exibição de vídeos. Embora esses métodos tenham ajudado a melhorar a eficiência da rede, eles trouxeram desafios significativos. O pré-aquecimento exigia a instanciação de várias instâncias de player sequencialmente, o que consumia muita memória e limitava o pré-carregamento a apenas alguns vídeos. Essa alta demanda de recursos significava que uma solução mais escalonável e robusta poderia ser aplicada para oferecer a reprodução instantânea esperada em feeds de redes sociais modernos e de rolagem rápida.

Como integrar o PreloadManager do Media3

Para alcançar uma reprodução realmente instantânea, a equipe do Media Foundation Client da Meta integrou o PreloadManager do Jetpack Media3 ao Facebook e ao Instagram. Eles escolheram o DefaultPreloadManager para unificar os sistemas de pré-carregamento e reprodução. Essa integração exigiu a refatoração da arquitetura atual da Meta para permitir o compartilhamento eficiente de recursos entre as instâncias do PreloadManager e do ExoPlayer. Essa mudança estratégica proporcionou uma vantagem arquitetônica fundamental: a capacidade de paralelizar tarefas de pré-carregamento e gerenciar muitos vídeos usando uma única instância de player. Isso aumentou muito a capacidade de pré-carregamento e eliminou as complexidades de memória da abordagem anterior.

colinKho.png

Otimização e ajuste de desempenho

Em seguida, a equipe realizou testes e iterações extensivos para otimizar a performance no ecossistema global diversificado de dispositivos da Meta. O pré-carregamento agressivo inicial às vezes causava problemas, incluindo aumento do uso da memória e lentidão no desempenho da rolagem. Para resolver isso, eles ajustaram a implementação usando medições de memória cuidadosas, considerando a fragmentação do dispositivo e adaptando o sistema a padrões específicos de interface.

Ajuste da implementação para padrões de interface específicos

A Meta aplicou diferentes estratégias de pré-carregamento e adaptou o comportamento para corresponder aos padrões específicos de UI de cada app:

  • Feed de notícias do Facebook: a interface prioriza o vídeo que está aparecendo no momento. O gerenciador pré-carrega apenas o vídeo atual para garantir que ele comece no momento em que o usuário pausar a rolagem. Esse foco "somente atual" minimiza os rastros de dados e memória em um ambiente em que os usuários podem ver muitas postagens estáticas entre os vídeos. Embora o sistema esteja projetado para pré-carregar apenas o vídeo em exibição, ele pode ser ajustado para pré-carregar também os próximos vídeos. 
  • Reels do Instagram: é um ambiente de vídeo puro em que os usuários deslizam na vertical. Para essa interface, a equipe implementou uma estratégia de pré-carregamento adjacente. O PreloadManager mantém os vídeos imediatamente após o Reel atual prontos na memória. Essa abordagem bidirecional garante que, independente de o usuário deslizar para cima ou para baixo, a transição permaneça instantânea e suave. O resultado foi uma melhoria drástica na qualidade da experiência (QoE, na sigla em inglês), incluindo melhorias no início da reprodução e no tempo até o primeiro frame para o usuário.

Escalonamento para um ecossistema global diversificado de dispositivos

Para escalonar uma pilha de vídeo de alto desempenho em bilhões de dispositivos, é necessário mais do que apenas pré-carregamento agressivo. É preciso inteligência. A Meta enfrentou desafios iniciais com pressão de memória e lentidão de rolagem, principalmente em hardware de médio a baixo custo. Para resolver isso, eles criaram um sistema de detecção de estresse do dispositivo (link em inglês) com base na implementação da Media3. Agora, os apps monitoram sinais de E/S e CPU em tempo real. Se um dispositivo estiver sob carga pesada, o pré-carregamento será pausado para priorizar a capacidade de resposta da interface.

Essa otimização compatível com dispositivos garante que o benefício da reprodução instantânea não prejudique a estabilidade do sistema, permitindo que até mesmo usuários de hardware mais antigo tenham um feed mais suave e ininterrupto.

mirabelHu.png

Benefícios arquitetônicos e integridade do código

Além das métricas voltadas ao usuário, a migração para o Media3 PreloadManager ofereceu benefícios arquitetônicos de longo prazo. Embora o processo de integração e ajuste tenha exigido várias iterações para equilibrar a performance, a base de código resultante é mais fácil de manter. A equipe descobriu que a API PreloadManager se integrava bem ao ecossistema Media3, permitindo um melhor compartilhamento de recursos. Para a Meta, a adoção do Media3 PreloadManager foi um investimento estratégico no futuro do consumo de vídeo. 

Ao adotar o pré-carregamento e adicionar portões inteligentes para dispositivos, eles aumentaram o tempo total de exibição nos apps e melhoraram o engajamento geral da comunidade global. 

Impacto resultante no Instagram e no Facebook

A arquitetura proativa trouxe melhorias imediatas e mensuráveis nas duas plataformas. 

  • O Facebook teve inícios de reprodução mais rápidos, diminuição das taxas de interrupção da reprodução e redução de sessões ruins (como armazenamento em buffer, tempo de início atrasado, qualidade inferior etc.), o que resultou em um tempo de exibição maior.
  • O Instagram teve inícios de reprodução mais rápidos e um aumento no tempo total de exibição. A eliminação da latência de junção (o intervalo entre a ação do usuário e a exibição do primeiro frame) aumentou diretamente as métricas de engajamento. As menos interrupções devido ao buffer reduzido significam que os usuários assistiram mais conteúdo, o que foi mostrado nas métricas de engajamento.
beforeAfterPreload.gif

Principais aprendizados de engenharia em escala

À medida que os hábitos de consumo de mídia evoluem, a demanda por experiências instantâneas continua crescendo. A implementação do gerenciamento proativo de memória e a otimização para escalonamento e diversidade de dispositivos garantem que seu aplicativo atenda a essas expectativas de maneira eficiente.

  • Priorizar o pré-carregamento inteligente

Concentre-se em oferecer uma experiência confiável minimizando travamentos e tempos de carregamento com o pré-carregamento. Em vez de um simples cache de disco, o uso do pré-carregamento no nível da memória garante que o conteúdo esteja pronto no momento em que um usuário interage com ele.

  • Alinhe sua implementação com padrões de UI

Personalize o comportamento de pré-carregamento de acordo com a interface dos seus apps. Por exemplo, use um foco "somente atual" para feeds mistos, como o Facebook, para economizar memória, e uma estratégia de "pré-carregamento adjacente" para ambientes verticais, como os Reels do Instagram.

preloadingStrategy.png
  • Aproveite a Media3 para ter um código saudável a longo prazo

A integração com as APIs Media3 em vez de uma solução de cache personalizada permite um melhor compartilhamento de recursos entre o player e o PreloadManager, permitindo que você gerencie vários vídeos com uma única instância do player. Isso resulta em uma base de código à prova de futuro que é mais fácil para as equipes de engenharia manter e otimizar ao longo do tempo, além de se beneficiar das atualizações de recursos mais recentes.

  • Implementar otimizações compatíveis com dispositivos

Amplie seu alcance de mercado testando em vários dispositivos, incluindo modelos de médio a baixo custo. Use indicadores em tempo real, como CPU, memória e E/S, para adaptar recursos e uso de recursos de forma dinâmica.

Saiba mais

Para começar e saber mais, acesse  

Agora você conhece os segredos da reprodução instantânea. Teste agora!

Escrito por:

Continuar lendo