The latest articles on Forem by Victor Góis Pacheco (@victorgois). https://forem.com/victorgois https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F310414%2F3ed15d28-c047-4bc1-a17b-263c74aae922.jpeg https://forem.com/victorgois en Victor Góis Pacheco Fri, 01 Mar 2024 02:03:03 +0000 https://forem.com/victorgois/sobre-as-mudancas-dos-core-web-vitals-21g2 https://forem.com/victorgois/sobre-as-mudancas-dos-core-web-vitals-21g2 <p>Recentemente, o Google anunciou que irá modificar suas métricas de indicadores de qualidade de páginas web. A empresa anunciou que em maio deste ano, suas métricas do Core Web Vitals, ferramenta que, desde 2020, ajuda desenvolvedores a avaliar e medir a qualidade de experiência do usuário, irão ser alteradas.</p> <h2> O que são as Core Web Vitals? </h2> <p>As Core Web Vitals são um conjunto de métricas que o Google utiliza para avaliar a experiência do usuário em sites da web. Elas são compostas por três métricas principais:</p> <p><strong>LCP</strong> (Largest Contentful Paint): Mede o tempo que leva para o maior elemento visível na tela ser carregado. Uma boa pontuação de LCP indica que o conteúdo principal da página é carregado rapidamente.</p> <p><strong>FID</strong> (First Input Delay): Avalia a capacidade de resposta de uma página, medindo o tempo entre a primeira interação do usuário (como clicar em um botão) e a resposta do navegador. Uma baixa pontuação de FID é essencial para garantir uma experiência interativa e ágil.</p> <p><strong>CLS</strong> (Cumulative Layout Shift): Esta métrica quantifica a estabilidade visual da página, avaliando a quantidade de mudanças inesperadas de layout que ocorrem durante o carregamento. Um baixo valor de CLS indica que os elementos da página não se movem de maneira inesperada, proporcionando uma experiência de usuário mais consistente.</p> <h2> Mudança da FID para a INP </h2> <p>Recentemente, o Google anunciou que estará substituindo a métrica FID pela INP, ou Input Timing, como parte das Core Web Vitals. Enquanto a FID se concentra na primeira interação do usuário com a página, a INP vai além, fornecendo uma visão mais abrangente do tempo de resposta da página em relação a todas as interações do usuário, não apenas a primeira.</p> <p>A INP é composta por duas métricas:</p> <ol> <li><p><strong>TBT</strong> (Total Blocking Time): Mede o tempo total durante o qual a página está bloqueada e não responde às interações do usuário. Isso inclui não apenas a primeira interação, mas todas as interações subsequentes até que a página esteja completamente interativa.</p></li> <li><p><strong>TTI</strong> (Time to Interactive): Indica o tempo necessário para que a página se torne totalmente interativa e responsiva para o usuário. Isso inclui o tempo até que todos os scripts sejam carregados e executados, permitindo que o usuário interaja livremente com a página.</p></li> </ol> <h2> Implicações para Desenvolvedores Frontend </h2> <p>A mudança da FID para a INP tem implicações significativas para os desenvolvedores frontend. Enquanto a FID fornecia uma visão limitada da responsividade da página, a INP oferece uma perspectiva mais completa, considerando todas as interações do usuário. Isso significa que os desenvolvedores agora precisarão se concentrar não apenas em otimizar a primeira interação, mas também em garantir que a página seja responsiva e interativa ao longo de toda a sessão do usuário.</p> <p>Para alcançar pontuações elevadas nas Core Web Vitals, os desenvolvedores frontend precisarão adotar práticas de desenvolvimento que minimizem o tempo de bloqueio total (TBT) e otimizem o tempo até a interatividade (TTI). Isso pode envolver técnicas como carregamento assíncrono de recursos, otimização de scripts e priorização de recursos críticos para o usuário.</p> <p>Além disso, a transição para a INP destaca a importância de uma abordagem holística para a otimização de desempenho da web. Os desenvolvedores não devem apenas se concentrar em métricas individuais, mas sim em garantir uma experiência do usuário fluida e responsiva em todas as interações com a página.</p> <p>Em resumo, a substituição da FID pela INP como parte das Core Web Vitals representa uma evolução significativa na forma como o desempenho da web é medido e otimizado. Para os desenvolvedores frontend, isso significa uma mudança de foco para garantir não apenas uma primeira interação rápida, mas uma experiência contínua e responsiva para os usuários ao longo de toda a sessão. </p> webdev ux frontend