====== Javascript Events limitieren / drosseln ======

Manche Events, wie z.B. ''resize'' oder ''scroll'' feuern zu häufig für die meisten normalen Anwendungen – vor allem wenn gleichzeitig eine HTML Manipulation am DOM passieren soll. Solche Events kosten dann viel Performance. Es ist meist nötig diese mit einem Timeout zu drosseln, damit das Javascript Event verzögert mit einem Delay ausgeführt wird – und nicht mehr so häufig.

<code javascript>
let   throttle_timer = null; /* Globale Variable für den Timer */
const throttle_delay = 200; /* Throttle Delay in ms */

window.addEventListener( 'scroll', function( event ) {
	/* Timer zruück setzen */
	if( throttle_timer ) { window.clearTimeout( throttle_timer ); }
	
	/* Starte Warten */
	throttle_timer = window.setTimeout(function() {
		/* Hier der eigentliche Event Code */
		console.log( "Firing!" );
	}, throttle_delay );
})
</code>

===== debounce() als Alternative =====

Ich bin über die Debounce Methode gestolpert: ''debounc( function, timeout );'' die scheinbar das gleiche macht:
  * [[https://www.educative.io/edpresso/how-to-use-the-debounce-function-in-javascript|educative.io » debounce()]] - Artikel über die Funktion