La différence Entre la limitation et une fonction anti-rebond

Personnellement, j'ai trouvé antirebond plus difficile à comprendre que gaz.

Que les deux fonctions vous aider à retarder et de réduire le taux de certains d'exécution. En supposant que vous appelez décorées fonctions retourné par la commande gaz/anti-rebond à plusieurs reprises...

• Gaz: la fonction d'origine d'être appelé au plus une fois par période spécifiée.
• Antirebond: la fonction d'origine à être appelée après l'appelant s'arrête appelant décoré de la fonction après une période spécifiée.

J'ai trouvé la dernière partie de l'anti-rebond crucial de comprendre le but c'est d'essayer d'atteindre. J'ai aussi trouvé une ancienne version de la mise en œuvre de _.anti-rebond aide à la compréhension (avec l'aimable autorisation de https://davidwalsh.name/function-debounce).

//Returns a function, that, as long as it continues to be invoked, will not
//be triggered. The function will be called after it stops being called for
//N milliseconds. If `immediate` is passed, trigger the function on the
//leading edge, instead of the trailing.
_.debounce = function(func, wait, immediate) {
  var timeout;
  return function() {
    var context = this, args = arguments;
    var later = function() {
        timeout = null;
        if (!immediate) func.apply(context, args);
    };
    var callNow = immediate && !timeout;
    clearTimeout(timeout);
    timeout = setTimeout(later, wait);
    if (callNow) func.apply(context, args);
  };
};

Un farfelu métaphore, mais peut-être pourrait aussi aider.

Vous avez un ami nommé Bavard qui aime à parler avec vous via la messagerie instantanée. En supposant que quand elle parle, elle envoie un nouveau message à chaque 5 secondes, tandis que votre IM icône de l'application est de rebondir vers le haut et vers le bas, vous pouvez prendre le...

• Naïf approche: vérifier chaque message tant qu'il arrive. Lorsque votre icône de l'application des rebonds, vérifier. Ce n'est pas le moyen le plus efficace, mais vous êtes toujours à jour.
• Gaz approche: vous contrôlez une fois toutes les 5 minutes (quand il y a des nouveaux). Quand un nouveau message arrive, si vous avez vérifié à tout moment dans les 5 dernières minutes, l'ignorer. Vous économisez votre temps avec cette approche, tout en restant dans la boucle.
• Antirebond approche: vous savez Bavard, elle se décompose toute une histoire en morceaux, les envoie dans un message après l'autre. Vous attendez jusqu'à ce Bavard finitions de l'histoire: si elle cesse d'envoyer des messages pendant 5 minutes, on pourrait supposer qu'elle ait fini, maintenant à vous de vérifier tous les.

Limitation applique un nombre maximum de fois qu'une fonction peut être appelée au fil du temps. Comme dans "l'exécution de cette fonction au plus une fois toutes les 100 millisecondes."

Anti-rebond applique qu'une fonction ne soit appelée à nouveau jusqu'à ce qu'une certaine quantité de temps s'est écoulé sans qu'il soit appelé. Comme dans "l'exécution de cette fonction que si les 100 millisecondes ont passé sans qu'il soit appelé."

ref

En d'autres termes:

Anti-rebond permettra d'éviter une fonction à partir de l'exécution tout il est encore appelé fréquemment. Un sans rebond de la fonction s'exécute uniquement après il a été déterminé qu'il n'est plus appelé, à quel point il sera exécuté exactement une fois. Des exemples pratiques de l'anti-rebond:

• La sauvegarde automatique ou de la validation du contenu d'un champ texte, si l'utilisateur "arrêté de taper": l'opération ne sera effectué qu'une fois, APRÈS qu'il a été établi que l'utilisateur n'est plus à taper (et non plus " en appuyant sur les touches).

• Journalisation où les utilisateurs reposer la souris: l'utilisateur n'est plus bouger la souris, de sorte que la (dernière) peut être connecté.

Limitation sera tout simplement éviter une fonction à partir de l'exécution si elle a exécuté récemment, indépendamment de la fréquence d'appel. Des exemples pratiques de limitation:

• Implémentations de v-sync sont basées sur la limitation: l'écran ne pouvant être utilisée si 16ms écoulé depuis le dernier écran de tirage. Peu importe combien de fois de rafraîchissement de l'écran fonctionnalité est appelée, elle ne fonctionnera qu'au plus une fois tous les 16ms.

C'est simple.

Ils ne le exactement la même chose (limitation du débit), sauf si gaz est appelé, il va mettre le feu à votre enveloppé périodique de la fonction, et antirebond ne sera pas. Anti-rebond juste (tente de) appeler votre fonction une fois à la fin.

Exemple: Si vous êtes le défilement, la manette des gaz lentement appeler votre fonction pendant que vous faites défiler (toutes les X millisecondes). Anti-rebond va attendre jusqu'à après que vous avez terminé de défilement pour appeler votre fonction.

la lodash Bibliothèque suggère l'article suivant https://css-tricks.com/debouncing-throttling-explained-examples/ dont détaillé expliquer la différence entre Debounce et Throttle et leur origine

Une vraie vie de l'analogie qui personnellement m'aide à me souvenir:

• anti-rebond = une conversation. vous attendez que l'autre personne à fini de parler avant de vous répondre.
• papillon = une batterie peu. vous ne jouez des notes sur un simple 4/4 tambour bits.

Cas d'utilisation pour antirebond:

• De frappe. Vous voulez faire quelque chose après que l'utilisateur a cessé de taper. Donc attente 1sec après la dernière frappe de sens. Chaque pression sur les touches redémarrage de l'attente.
• Animation. Vous voulez réduire de retour d'un élément après que l'utilisateur a cessé de planer sur elle. N'utilisant pas d'anti-rebond pourrait causer un bloc erratique de l'animation en tant que résultat du curseur involontairement de déplacement entre le "chaud" et "froid" des zones.

Cas d'utilisation pour gaz:

• De défilement. Vous souhaitez réagir à défilement, mais de limiter la quantité de calculs effectués, afin de faire quelque chose tous les 100ms est suffisant pour éviter les risques de retard.
• De déplacement de la souris. Même que le défilement, mais pour déplacement de la souris.
• Appels d'API Vous voulez mettre le feu à un appel d'API sur certains événements de l'UI, mais souhaitez limiter le nombre d'appels de l'API de ne pas surcharger votre serveur.