Beto Muniz
  • Share

Como funciona a Idle Detection API?

tech

👉 A Idle Detection API permite com que aplicações identifiquem interações do usuário como movimento do mouse, click, digitação no teclado entre outros.

⚡️ Esse recurso é útil por exemplo, na otimização de performance de uma aplicação, pois possibilita parar processos pesados temporariamente.

😋 Outros exemplos são soluções como "Usuário digitando" em chats, aplicações que ocultam/exibem a interface na ausência/presença do usuário, etc.

const idle = new IdleDetector()
// idle.userState
// Retorna se o usuário está `active` ou `idle`
// idle.screenState
// Retorna se o sistema está `locked` ou `unlocked`
idle.addEventListener('change', () => {
const { userState, screenState } = idle;
console.log(`${userState} - ${screenState}`);
});

✨ A Idle Detection API se parece com a Page Visibility API, mas a Idle Detection API identifica a presença do usuário mesmo sem foco na página.

🧪 E como ainda é um recurso novo, sendo o Chrome 86 o único já com suporte, recomenda-se o uso com um polyfill, como o idle.ts.

💧 Gostou desse drop? Compartilhe-o. 🤩

E para receber meus conteúdos assim que eu publicar, me segue lá no Telegram 😋

  • Share It!
Copyright Beto Muniz © 2010-2020. All rights reserved.