resize和scroll事件優化簡單方法
關於這兩個事件這裡就不多介紹了,具體可以參閱以下相關文章:
1.resize事件可以參閱javascript resize 事件一章節。
2.scroll事件可以參閱javascript scroll 事件一章節。
當調整瀏覽器視窗的時候,會觸發resize事件,這個時候就會重新計算頁面中所有元素的尺寸,這個可視一個非常消耗效能的操作,如果遇到低版本的瀏覽器或者特別差的機器可能會導致卡死的現象,scroll也是同樣的道理,下面就介紹一下如何優化這兩個事件。
程式碼如下:
[JavaScript] 純文字檢視 複製程式碼var resizeTimer=null; $(window).on('resize',function(){ if(resizeTimer){ clearTimeout(resizeTimer) } resizeTimer=setTimeout(function(){ console.log("window resize"); }, 400); });
上面程式碼的思路就是設定每隔400毫秒去執行一次事件處理函式中的相關程式碼,在預設條件下可能是極短的時間間隔區執行一次函式的程式碼,程式碼比較簡單這裡就不多介紹了,如有任何問題可以跟帖留言。
相關文章
- JavaScript resize 事件JavaScript事件
- jQuery resize事件jQuery事件
- JavaScript scroll 事件JavaScript事件
- jQuery scroll事件jQuery事件
- 兩種簡單分析和優化MySQL資料庫表的方法優化MySql資料庫
- react 簡單優化React優化
- 簡單常用的幾項程式碼優化方法優化
- iOS 啟動速度優化和安裝包優化簡單總結iOS優化
- Hive的壓縮儲存和簡單優化Hive優化
- 簡單優化容器服務優化
- nginx部署及簡單優化Nginx優化
- msyql 簡單的sql優化SQL優化
- greenplum 簡單sql優化案例SQL優化
- 簡單事件事件
- Oracle resize DBF報錯"ORA-03297"簡單介紹Oracle
- log file sync等待事件的成因及優化方法事件優化
- 高效能滾動 scroll 及頁面渲染優化優化
- MySQL幾個簡單SQL的優化MySql優化
- 10種簡單的Java效能優化Java優化
- 簡單說兩句 Like 的優化優化
- 簡單說說PHP優化那些事PHP優化
- java效能優化方案9——優化自定義hasCode()方法和equals()方法Java優化
- 前端高效能滾動 scroll 及頁面渲染優化前端優化
- MySQL效能優化之簡單sql改寫MySql優化
- 一次簡單的分頁優化優化
- 調需式優化的簡單實踐優化
- python解數獨的簡單優化Python優化
- javascript程式碼效能優化簡單介紹JavaScript優化
- 建立XMLHttpRequest物件效能優化簡單介紹XMLHTTP物件優化
- 34條簡單的SQL優化準則SQL優化
- 一次簡單的程式碼優化優化
- MongoDB 效能優化五個簡單步驟MongoDB優化
- 最簡單的服務響應時長優化方法,沒有之一優化
- 優化儲存過程的2種方法(DBMS_PROFILER和10046事件)優化儲存過程事件
- vue2.0自定義指令,用touch事件替換scroll事件Vue事件
- 雙擊和單擊事件衝突解決方法事件
- 使用 CSS Scroll Snap 優化滾動,提升使用者體驗!CSS優化
- node事件迴圈和訊息佇列簡單分析事件佇列