The browser's Dom computing processing is very CPU-intensive, occupy memory, which is very unfriendly to our development, such as the onresize event of IE browser can be counted thousands of times when the user slightly drag the window, even higher frequency directly let the browser crash ...
All the students in the handwritten carousel are aware of the existence of a throttle valve, so is the function throttle (reference elevation):
var processor = {
Timeoutid:null,
The method of actual processing
Performprocessing:function () {
Code that is actually executed
},
Methods for initializing processing calls
Process:function () {
Cleartimeout (This.timeoutid);
var that=this;
This.timeoutid=settimeout (function () {
That.performprocessing ();
},100);
}
};
The basic idea is that a function that executes continuously is forced to execute every 100 milliseconds
The following is simplified using the throttle () function, which automatically sets and clears the timer:
Function Throttle (Method,context) {
Cleartimeout (Method,tid);
Method.tid=settimeout (function () {
Method.call (context);
},100);
}
How to use it? It's so simple and rude.
function MyFunction () {
Your idea
}
Window.onresize = function () {
Throttle (myFunction);
};
You do not know the function of throttling, improve your LJS performance!