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事件
- 兩種簡單分析和優化MySQL資料庫表的方法優化MySql資料庫
- iOS 啟動速度優化和安裝包優化簡單總結iOS優化
- Hive的壓縮儲存和簡單優化Hive優化
- 簡單事件事件
- 簡單優化容器服務優化
- nginx部署及簡單優化Nginx優化
- 最簡單的服務響應時長優化方法,沒有之一優化
- MySQL效能優化之簡單sql改寫MySql優化
- 一次簡單的分頁優化優化
- node事件迴圈和訊息佇列簡單分析事件佇列
- nodejs事件和事件迴圈簡介NodeJS事件
- 使用 CSS Scroll Snap 優化滾動,提升使用者體驗!CSS優化
- 優化Go程式的簡單技巧 - stephen.sh優化Go
- [譯]深度學習模型的簡單優化技巧深度學習模型優化
- JS 程式碼的簡單重構與優化JS優化
- python--事件event簡單用法Python事件
- 初始化ArrayList的簡單方法總結
- 使用策略模式和簡單工廠模式重寫支付模組(二)-優化$request模式優化
- EasyDependency:簡單優雅管理元件化的依賴配置元件化
- 關於UC瀏覽器相容scroll事件問題瀏覽器事件
- Protobuf簡單型別直接反序列化方法型別
- resize
- MySQL優化學習手札(四) 單表訪問方法MySql優化
- [重慶思莊每日技術分享]-asynch descriptor resize等待事件事件
- sql改寫優化:簡單規則重組實現SQL優化
- 最簡單的氣泡排序還能怎麼優化?排序優化
- "簡單"的jvm調優JVM
- “簡單”的jvm調優JVM
- 優化If else(簡化程式碼)優化
- Caffe簡單例程,影像處理,Netscope視覺化方法單例視覺化
- 一文簡述深度學習優化方法——梯度下降深度學習優化梯度
- 簡單的排序方法排序
- Android事件分發機制簡單理解Android事件
- 前端優化清單(一):之首屏優化前端優化
- std::reserve和std::resize的區別
- Numpy中reshape和resize的區別
- ngx-datatable元件table重新計算,手動觸發resize事件元件事件
- .NET 調整圖片尺寸(Resize)各種方法