比起非DOM交互，DOM操作需要更多內存和CPU時間。連續嘗試進行過多的DOM相關操作可能會導致瀏覽器變慢甚至崩潰。函數節流的設計思想就是讓某些代碼可以在間斷情況下連續重複執行，實現的方法是使用定時器對函數進行節流。
例如，在第一次調用函數時，創建一個定時器，在指定的時間間隔後執行代碼。當第二次調用時，清除前一次的定時器並設置另一個，實際上就是前一個定時器演示執行，將其替換成一個新的定時器。
var processor={
timeoutId:null,
//實際進行處理的方法
performProcessing:function{
//實際執行的方法
},
//初始處理調用的方法
process:function{
clearTimeout(this.timeoutId);
var that=this;
this.timeoutId=setTimeout(function{
that.performProcessing;
},100);
}
};
//嘗試開始執行
Processor.process;
簡化模式：
function throttle(method,context){
clearTimeout(mehtod.tId);
mehtod.tId=setTimeout(function{
method.call(context);
},100);
}
函數節流解決的問題是一些代碼（特別是事件）的無間斷執行，這個問題嚴重影響了瀏覽器的性能，可能會造成瀏覽器反應速度變慢或直接崩潰，如resize、mousemove、mouseover、mouseout等事件的無間斷執行。這時加入定時器功能，將事件進行「節流」，即在事件觸發的時候設定一個定時器來執行事件處理程序，可以在很大程度上減輕瀏覽器的負擔。類似應用如支付寶中的「導購場景」導航，以及當當網首頁左邊的導航欄等，這些都是為了解決mouseover和mouseout移動過快給瀏覽器處理帶來的負擔，特別是減輕涉及Ajax調用給服務器造成的極大負擔。例如：
oTrigger.onmouseover=function(e){//如果上一個定時器還沒有執行，則先清除定時器
oContainer.autoTimeoutId＆＆clearTimeout(oContainer.autoTimeoutId);
e=e||window.event;
var target=e.target||e.srcElement;
if((/li$/i).test(target.nodeName)){
oContainer.timeoutId=setTimeout(function{
addTweenForContainer(oContainer,oTrigger,target);
},300);
}
}