Novidades no Chrome 60

Pete LePage

  • A API Paint Timing permite medir o tempo até a first paint e o tempo até a First Contentful Paint com o AP Paint Timings.
  • O font-display permite controlar como as fontes são renderizadas antes do download.
  • O WebAssembly chegou
  • E tem muito mais.

Quer a lista completa de alterações? Confira a lista de alterações do repositório de origem do Chromium

Meu nome é Pete LePage. Vamos nos aprofundar e conhecer as novidades para desenvolvedores no Chrome 60.

API PaintTimings

Quando um usuário navega em uma página da Web, ele procura um feedback visual para tranquilizar o usuário de que tudo está funcionando. Com a nova API Paint Timing, agora podemos medir isso.

A API expõe duas métricas:

  • Time to first paint: marca o momento em que o navegador começa a renderizar algo, a primeira parte do conteúdo na tela.
  • Time to First Contentful Paint: marca o momento em que o navegador renderiza a primeira parte do conteúdo do DOM, do texto, de uma imagem etc.

Confira Como aproveitar as métricas de desempenho que mais afetam a experiência do usuário para saber como acompanhar essas métricas e usá-las para melhorar sua experiência.

Propriedade CSS font-display

Com o Web Fonts você pode incorporar uma tipografia rica. No entanto, se o usuário ainda não tiver a família tipográfica, será necessário fazer o download dela, o que pode fazer seu site parecer lento.

Felizmente, a maioria dos navegadores usa um substituto se o download da fonte demorar muito para ser concluído. A nova propriedade font-display permite controlar como uma fonte para download é renderizada antes de ser totalmente carregada.

  • O auto usa a estratégia de exibição de fonte usada pelo user agent.
  • block oferece ao tipo de fonte um curto período de bloqueio e um período de troca infinito.
  • swap dá ao tipo de fonte um período de bloqueio de zero segundo e um período de troca infinito.
  • fallback oferece ao tipo de fonte um período de bloqueio extremamente pequeno e um período de troca curto.
  • optional oferece ao tipo de fonte um período de bloqueio extremamente pequeno e um período de troca de zero segundo.

Ela é compatível com o Chrome 60 e com o Opera e está em desenvolvimento no Firefox. Confira Como controlar o desempenho da fonte com font-display para saber mais.

WebAssembly

O Web Assembly, ou Wasm, oferece uma nova maneira de executar código, escrita em linguagens como C e C++ na Web, quase na velocidade nativa.

Ele oferece a velocidade necessária para criar um editor de vídeo no navegador ou executar um jogo do Unity com um frame rate alto usando APIs de plataforma da Web baseadas em padrões.

Encontre mais informações em webassembly.org (em inglês), incluindo demonstrações, documentos e como começar.

E muito mais

  • A nova API Web orçamento permite que os sites com a permissão de notificação push enviem um número limitado de mensagens push que acionam trabalhos em segundo plano, como sincronizar dados ou dispensar notificações, sem a necessidade de mostrar uma notificação visível ao usuário.
  • O PushSubscription.expirationTime agora está disponível, notificando os sites quando e se uma assinatura vai expirar.
  • As propriedades de restauração e propagação de objetos agora são compatíveis, o que simplifica a mesclagem e clone superficial de objetos e a implementação de vários padrões de objetos imutáveis.

Observação: a API Payment Request foi enviada para o Chrome 61.

Estas são apenas algumas das mudanças do Chrome 60 para desenvolvedores.

Depois, inscreva-se no nosso canal do YouTube para receber uma notificação por e-mail sempre que lançarmos um novo vídeo.

Meu nome é Pete LePage, e assim que o Chrome 61 for lançado, estarei aqui para contar as novidades do Chrome!