ShareChat resolve problemas de instabilidade para aumentar a rolagem do feed em 60%

Introdução

A ShareChat é uma plataforma de mídia social líder na Índia que permite que os usuários compartilhem opiniões, documentem suas vidas e façam novos amigos no próprio idioma nativo. Outros recursos incluem salas de chat e mensagens privadas, permitindo que os usuários compartilhem vídeos, piadas, músicas e outros conteúdos sociais baseados em idioma. Com a missão de liderar a revolução na Internet da Índia, a ShareChat está mudando a forma como o próximo bilhão de usuários vai interagir na Internet.

O app em números

  • Mais de 100 milhões de downloads
  • Mais de 180 milhões de usuários ativos por mês
  • Mais de 32 milhões de criadores de conteúdo
  • 15 idiomas indianos diferentes
  • Cerca de 1,5 milhão de postagens criadas diariamente

O desafio

Como o ShareChat cresceu e foi adorado por milhares de pessoas diariamente, o app enfrentou um desafio em fornecer novos frames de forma consistente, levando a tempos de resposta ruins que dificultavam a experiência do usuário.

Como resultado, o app observou um aumento no número de frames perdidos ou atrasados (também conhecido como "instabilidade"). Corrigir esses problemas de instabilidade melhorando frames lentos e congelados foi fundamental para oferecer uma experiência perfeita a todos os usuários. Isso também desempenha um papel importante para que os usuários passem mais tempo no app, aumentando o engajamento e, por sua vez, melhorando a classificação do ShareChat na Play Store do Android.

Como foi o processo

A ShareChat trabalhou com a equipe de relações com desenvolvedores do Google para reduzir a instabilidade e gerar um impacto positivo nos negócios, melhorando os frames lentos e congelados (instabilidade) no app. Especificamente, eles trabalharam para melhorar os seguintes problemas:

  • Pool de RecyclerView compartilhado: por meio da criação de perfil, foi observado que a criação de diferentes detentores de visualização leva mais tempo e, para minimizar isso, um pool de RecyclerView compartilhado foi criado. Isso também ajudou a remover o custo de criação de detentores de visualizações para feeds semelhantes.

  • Passel de layout excessivo: por meio da criação de perfis, também foi observado que alguns proprietários de visualizações solicitaram requestLayouts adicionais. Para otimizar, o código foi atualizado para ter valor no tempo de criação, em vez de cada vinculação, economizando custos de requestLayout extras.

  • OverDraw: simplificou os layouts para reduzir as camadas e remover as cores definidas separadamente para cada uma das camadas.

  • Simplificação da hierarquia: inflação longa observada durante a criação de perfil e inspeção manual de várias telas. A hierarquia foi nivelada usando ConstraintLayout para resolver esse problema.

  • Inflação excessiva de visualizações: identificou um tempo longo de inflação para determinadas visualizações durante a criação de perfil. Essas visualizações foram convertidas em stubs de visualização.

  • Remoção de tarefas pesadas da linha de execução de IU: o uso de um criador de perfil permitia observar alguns locais em que tarefas pesadas estavam sendo realizadas na linha de execução principal, como criar SpannableStringBuilder com inclusão de tag e estilo de cada vinculação recyclerView, decodificação de BlurHash etc. Essas tarefas foram removidas da linha de execução de interface e movidas para uma linha de execução em segundo plano.

  • Migrar de Rx para Corroutine: o consumo de memória também levou a chamadas de GC frequentes e havia contagens muito altas de linhas de execução pela linha de execução mais de 100 RX. Muitos dos casos de uso foram movidos para a corrotina para corrigir esses problemas.

  • Adoção da Coil para carregamento de imagens: a Glide causava problemas ao carregar imagens, especificamente nos componentes criados com o Jetpack Compose. Também foi identificado que a barra de limite de renderização era alta ao carregar imagens em LazyColumn. Essas ocorrências levaram à adoção da Coil para carregamento de imagens.

  • Refatoração e limpeza de código antigo: a remoção de código e experimentos antigos ajudou a remover visualizações ocultas desnecessárias da interface e a reescrever algumas das telas de uma maneira melhor.

Resultados

Ao analisar as áreas de melhoria e identificar estratégias de otimização, o ShareChat conseguiu melhorar a experiência geral dos usuários e aumentar a taxa de engajamento e as notas na Play Store. Confira abaixo uma visão geral quantitativa dos resultados alcançados pelo ShareChat:

  • Redução de aproximadamente 45% em frames com "renderização lenta" na Play Store
  • Redução de aproximadamente 30% em frames "congelados" na Play Store.
  • As taxas de frames instáveis a cada 10 mil frames renderizados foram reduzidas de 10,72% para 3,98%.
  • A rolagem do feed aumentou em 60%
  • As avaliações gerais na Play Store aumentaram de ~4,0 para 4,3
  • 10% de aumento no consumo de postagens

"Na ShareChat, nosso objetivo é ser o melhor app de mídia social que encante nossos usuários.Isso também significa ser o melhor em termos de desempenho. Nossa colaboração com a equipe de relações com desenvolvedores do Google nos ajudou a identificar áreas de melhoria nos nossos dispositivos de baixo custo mais usados. Aprendemos as práticas recomendadas de desempenho e as ferramentas para identificar e corrigir frames congelados, instabilidades, overdraws e ANRs."

– Vihaan Verma, gerente de engenharia, equipe do Android, ShareChat