Article image
Valdir Alves
Valdir Alves06/06/2024 10:50
Compartilhe

Debounce em JavaScript

    O que é Debounce ? 

    🤔 Debouncing é uma técnica usada para garantir que uma função não seja chamada mais de uma vez a cada X milissegundos.

    Quando usar ?  

    🔄 Eventos que disparam múltiplas vezes rapidamente, como redimensionamento da janela, rolagem ou teclas pressionadas.

    Exemplo Prático  

    👨‍💻 Imagine um campo de busca que envia uma requisição a cada tecla pressionada. Sem debounce, isso causaria várias requisições desnecessárias.

    image

    Usando a Função

    image

    Explicação

    • 1️⃣ debounce recebe uma função e um tempo de espera.  
    • 2️⃣ Retorna uma nova função que redefine o timeout e chama a função original após o tempo de espera.  
    • 3️⃣ Aplica debounce ao evento de entrada do campo de texto.

    Benefícios

    ✔️ Melhora a performance  

    ✔️ Menos requisições desnecessárias  

    ✔️ Experiência do usuário mais suave  

    Tente Você Mesmo!  

    💡 Debounce é uma técnica simples, mas poderosa.

    Experimente adicionar debounce ao seu projeto e veja a diferença!

    Te Encontro no Linkedin.

    Compartilhe
    Comentários (1)
    Ronaldo Schmidt
    Ronaldo Schmidt - 06/06/2024 18:15

    Muito bom artigo.

    E por isso que javascript eh o meu favorito!

    Solucoes simples e direto ao ponto.

    Obrigado por compartilhar.