前言：針對一些會頻繁觸發的事件如scroll、resize，如果正常綁定事件處理函數的話，有可能在很短的時間內多次連續觸發事件，十分影響性能 節流： 節流：使得一定時間內只觸發一次函數。 它和防抖動最大的區別就是，節流函數不管事件觸發有多頻繁，都會保證在規定時間內一定會執行一次真正 ...

　　在項目開發過程中經常遇到在input的change事件中發起請求，將用戶最新輸入的字符作為data傳給后台，但是如果用戶的輸入頻率過高，或者用戶輸入的字符還未拼成一個完整的字詞，這時候發起請求會浪費網絡資源，使頁面卡頓。 　　這時候我們就用到了函數去抖（debounce）和函數節流 ...

在進行窗口的resize、scroll，輸入框內容校驗等操作時，如果事件處理函數調用的頻率無限制，會加重瀏覽器的負擔，導致用戶體驗非常糟糕。 此時我們可以采用debounce（防抖）和throttle（節流）的方式來減少調用頻率，同時又不影響實際效果。 函數防抖 函數防抖 ...

在進行窗口的resize、scroll，輸入框內容校驗等操作時，如果事件處理函數調用的頻率無限制，會加重瀏覽器的負擔，導致用戶體驗非常糟糕。此時我們可以采用debounce（防抖）和throttle（節流）的方式來減少調用頻率，同時又不影響實際效果。 函數防抖 函數防抖 ...

日常開發過程中，滾動事件做復雜計算頻繁調用回調函數很可能會造成頁面的卡頓，這時候我們更希望把多次計算合並成一次，只操作一個精確點，JS把這種方式稱為debounce（防抖）和throttle（節流） 函數防抖 當持續觸發事件時，一定時間段內沒有再觸發事件，事件處理函數才會執行一次，如果設定 ...

和資源加載，嚴重影響了網頁性能，甚至會造成瀏覽器崩潰。 　此時,我們可以采用 debounce（防抖） ...

防抖（debounce） 定義： 對於短時間內連續觸發的事件（上面的滾動事件），防抖的含義就是讓某個時間期限（如上面的1000毫秒）內，事件處理函數只執行一次。 實際運用：按鈕頻繁點擊，頁面resize。 立即執行版： 非立即執行版: 節流 ...

事件優化 防抖與節流 防抖： 所謂防抖，就是把觸發非常頻繁的事件合並成一次去執行。即在指定時間內只執行一次回調函數，如果在指定的時間內又觸發了該事件，則回調函數的執行時間會基於此刻重新開始計算。 指觸發事件后在n秒內只執行一次，若在n秒內再次觸發則重新計算 節流： 所謂節流 ...