O objetivo do Chrome User Experience Report é ajudar a comunidade da Web a entender a distribuição e a evolução do desempenho real do usuário. Até o momento, nosso foco tem sido as métricas de exibição e carregamento de página, como a Primeira exibição de conteúdo (FCP) e a Onload (OL), que nos ajudaram a entender o desempenho visual dos sites para os usuários. A partir da versão de junho de 2018, estamos testando uma nova métrica centrada no usuário com foco na interatividade das páginas da Web: Latência na primeira entrada (FID, na sigla em inglês). Com essa nova métrica, poderemos entender melhor como os sites são responsivos à entrada do usuário.
Recentemente, o FID foi disponibilizado no Chrome como um teste de origem, o que significa que os sites podem testar esse novo recurso da plataforma da Web. Da mesma forma, a FID vai estar disponível no Chrome UX Report como uma métrica experimental, ou seja, durante o teste de origem, em um namespace "experimental" separado.
Como a FID é medida
O que exatamente é FID? Veja como isso é definido na postagem do blog sobre Latência na primeira entrada:
A latência na primeira entrada (FID, na sigla em inglês) mede o tempo entre o momento em que um usuário interage com o site pela primeira vez (ou seja, quando clica em um link, toca em um botão ou usa um controle personalizado com tecnologia JavaScript) até o momento em que o navegador consegue responder a essa interação.
É como medir o tempo entre o toque da campainha de alguém e o atendimento à porta. Se demorar muito, pode haver vários motivos. Por exemplo, talvez a pessoa esteja longe da porta ou não consiga se mover rapidamente. Da mesma forma, as páginas da Web podem estar ocupadas fazendo outro trabalho ou o dispositivo do usuário pode estar lento.
Explorar a FID no Chrome UX Report
Com um mês de dados da FID de milhões de origens, já existe uma infinidade de insights interessantes a serem descobertos. Vamos conferir algumas consultas que demonstram como extrair esses insights do Chrome UX Report no BigQuery.
Vamos começar consultando a porcentagem de experiências rápidas de FID em developers.google.com. Podemos definir uma experiência rápida como aquela em que o FID é menor que 100 ms. De acordo com as recomendações RAIL, se o atraso for de 100 ms ou mais, o tempo de espera será instantâneo para o usuário.
SELECT
ROUND(SUM(IF(fid.start < 100, fid.density, 0)), 4) AS fast_fid
FROM
`chrome-ux-report.all.201806`,
UNNEST(experimental.first_input_delay.histogram.bin) AS fid
WHERE
origin = 'https://developers.google.com'
Os resultados mostram que 95% das experiências de FID nessa origem são percebidas como instantaneamente. Parece muito bom, mas como se compara a todas as origens no conjunto de dados?
SELECT
ROUND(SUM(IF(fid.start < 100, fid.density, 0)) / SUM(fid.density), 4) AS fast_fid
FROM
`chrome-ux-report.all.201806`,
UNNEST(experimental.first_input_delay.histogram.bin) AS fid
Os resultados dessa consulta mostram que 84% das experiências de FID são menores que 100 ms. Portanto, o developers.google.com está acima da média.
Em seguida, vamos tentar dividir esses dados para ver se há uma diferença entre a porcentagem de FID rápida em computadores e dispositivos móveis. Uma hipótese é que os dispositivos móveis têm valores de FID mais lentos, possivelmente devido ao hardware mais lento em comparação com os computadores desktop. Se a CPU for menos potente, ela poderá ficar mais ocupada por mais tempo e resultar em experiências de FID mais lentas.
SELECT
form_factor.name AS form_factor,
ROUND(SUM(IF(fid.start < 100, fid.density, 0)) / SUM(fid.density), 4) AS fast_fid
FROM
`chrome-ux-report.all.201806`,
UNNEST(experimental.first_input_delay.histogram.bin) AS fid
GROUP BY
form_factor
| form_factor | fast_fid |
|---|---|
| computador | 96.02% |
| phone | 79.90% |
| tablet | 76.48% |
Os resultados corroboram nossa hipótese. O computador tem uma densidade cumulativa maior de experiências rápidas de FID do que os formatos de smartphones e tablets. Entender por que essas diferenças existem (por exemplo, desempenho da CPU) exigiria testes A/B fora do escopo do relatório de UX do Chrome.
Agora que aprendemos a identificar se uma origem tem experiências rápidas de FID, vamos analisar algumas origens que têm um desempenho muito bom.
Exemplo 1: http://secretlycanadian.com
Essa origem tem 98% das experiências de FID abaixo de 100 ms. Como isso acontece? Analisando como ela é integrada ao WebPageTest, vemos que é uma página do WordPress com bastante imagens, mas com 168 KB de JavaScript, que é executado em cerca de 500 ms na máquina do laboratório. Não se trata de uma grande quantidade de JavaScript, de acordo com o HTTP Archive, que coloca essa página no 28o percentil.
A barra rosa de 2,7 a 3,0 segundos é a fase Analisar HTML. Durante esse tempo, a página não é interativa e aparece visualmente incompleta. Consulte "3.0s" na miniatura acima. Depois disso, todas as tarefas longas que precisarem ser processadas são divididas para garantir que a linha de execução principal permaneça inativa. As linhas rosas na linha 11 demonstram como o trabalho em JavaScript é distribuído em bursts rápidos.
Exemplo 2: https://www.wtfast.com
Esta origem tem 96% de experiências de FID instantâneas. Ele carrega 267 KB de JavaScript (38o percentil no HTTP Archive) e o processa por 900 ms na máquina do laboratório. A tira de filme mostra que a página leva cerca de cinco segundos para pintar o plano de fundo e mais dois segundos para pintar o conteúdo.
O mais interessante sobre os resultados é que nada interativo fica visível enquanto a linha de execução principal fica ocupada entre 3 e 5 segundos. Na verdade, é a lentidão da FCP dessa página que melhora o FID. Esse é um bom exemplo da importância de usar muitas métricas para representar a experiência do usuário.
Começar a explorar
Saiba mais sobre a FID no episódio desta semana de O estado da Web:
Com a FID disponível no Chrome UX Report, é possível estabelecer uma linha de base de experiências de interatividade. Usando esse valor de referência, podemos observar a mudança em versões futuras ou comparar origens individuais. Se você quiser começar a coletar FID nas medições de campo do seu site, inscreva-se no teste de origem acessando bit.ly/event-timing-ot e selecione o recurso "Horário do evento". E, é claro, comece a explorar o conjunto de dados para ter insights interessantes sobre o estado da interatividade na Web. Essa ainda é uma métrica experimental. Por isso, envie seu feedback e compartilhe sua análise no grupo de discussão do Chrome UX Report ou em @ChromeUXReport no Twitter.