asynceawaitpermitem que você escreva código baseado em promessa como se fosse síncrono, mas sem bloquear a linha de execução principal.- Os eventos de ponteiro oferecem uma maneira unificada de processar todos os eventos de entrada.
- Os sites adicionados à tela inicial recebem automaticamente a permissão de armazenamento persistente.
E tem muito mais.
Meu nome é Pete LePage. Confira as novidades para desenvolvedores no Chrome 55.
Eventos de ponteiro
Apontar para coisas na Web era simples. Você tinha um mouse, movia-o para lá e para cá, às vezes pressionava botões, e pronto. Mas isso não funciona muito bem aqui.
Os eventos de toque são bons, mas para oferecer suporte a toque e mouse, você precisa oferecer suporte a dois modelos de evento:
elem.addEventListener('mousemove', mouseMoveEvent);
elem.addEventListener('touchmove', touchMoveEvent);
O Chrome agora permite o processamento unificado de entrada enviando PointerEvents:
elem.addEventListener('pointermove', pointerMoveEvent);
Os eventos do ponteiro unificam o modelo de entrada do ponteiro para o navegador, reunindo toque, canetas e mouses em um único conjunto de eventos. Elas têm suporte no IE11, Edge, Chrome, Opera e suporte parcial no Firefox.
Confira O caminho a seguir para mais detalhes.
async e await
O JavaScript assíncrono pode ser difícil de entender. Considere esta função com todos os callbacks "maravilhosos":
function logFetch(url) {
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function (e) {
if (xhr.readyState === 4) {
if (xhr.status === 200) {
console.log(xhr.responseText);
} else {
console.error('xhr failed', xhr.statusText);
}
}
};
xhr.onerror = function (e) {
console.error(xhr.statusText);
};
xhr.open('GET', url);
xhr.send();
}
Reescrever com promises ajuda a evitar o problema de aninhamento:
function logFetch(url) {
return fetch(url)
.then(response => response.text())
.then(text => {
console.log(text);
}).catch(err => {
console.error('fetch failed', err);
});
}
No entanto, o código baseado em promessas ainda pode ser difícil de ler quando há cadeias longas de dependências assíncronas.
O Chrome agora oferece suporte às palavras-chave async e await do JavaScript, permitindo
que você escreva JavaScript baseado em promessas que pode ser tão estruturado e
legível quanto o código síncrono.
Em vez disso, nossa função assíncrona pode ser simplificada para:
async function logFetch(url) {
try {
const response = await fetch(url);
console.log(await response.text());
}
catch (err) {
console.log('fetch failed', err);
}
}
Jake tem um ótimo post: Funções assíncronas: simplificando promessas com todos os detalhes.
Armazenamento permanente
O teste de origem de armazenamento persistente acabou. Agora você pode marcar o armazenamento da Web como persistente, impedindo que o Chrome limpe automaticamente o armazenamento do seu site.
if (navigator.storage && navigator.storage.persist) {
navigator.storage.persist().then(granted => {
if (granted)
alert("Storage will not be cleared except by explicit user action");
else
alert("Storage may be cleared by the UA under storage pressure.");
});
}
Além disso, sites com alto engajamento, adicionados à tela inicial ou com notificações push ativadas recebem automaticamente a permissão de persistência.
Confira a postagem Persistent Storage de Chris Wilson para saber mais detalhes e como solicitar armazenamento persistente para seu site.
CSS Automatic Hyphenation
A quebra automática de palavras do CSS, um dos recursos de layout mais solicitados do Chrome, agora tem suporte para Android e Mac.
API Web Share
Por fim, agora é mais fácil invocar recursos de compartilhamento nativo com a nova API Web Share, disponível como um teste de origem. Paul (Mr. Web Intents) Kinlan tem todos os detalhes na postagem Navigator Share.
Encerramento
Estas são apenas algumas das mudanças no Chrome 55 para desenvolvedores.
Se você quiser ficar por dentro das novidades do Chrome e saber o que está por vir, assine e confira os vídeos do Chrome Dev Summit para saber mais sobre algumas das coisas incríveis em que a equipe do Chrome está trabalhando.
Meu nome é Pete LePage, e assim que o Chrome 56 for lançado, estarei aqui para contar as novidades do Chrome.