› 看板 Ajax 關於我們 聯絡資訊
作者emn178 (小殘)
看板Ajax
標題Re: [問題] 大量事件綁定
時間Sat Jun 8 07:32:00 2013
大量註冊事件的確會慢, 例如你的網頁有幾千幾萬個<a>, 你逐一找出並註冊事件可能會花上一段時間, 然而, 如果你要做的事件其實都是同一個動作, 你可以在上層元素註冊事件, 例如<body>, 並判斷事件觸發者是不是<a>, 再執行該動作即可 這個處理方法的條件是, 事件傳遞都會經過同樣的上層元素, 以及事件內容都相同 ※ 引述《gn00742754 (西門貓)》之銘言： : 我有一個頁面， : 要處理非常多的邏輯， : 剛開始載入非常慢， : 我本來以為或許是很多邏輯運算沒寫好， : 導致載入速度緩慢， : 後來稍微測試一下， : 在整個網頁操作的時候速度還算正常， : 只有剛開始載入非常緩慢， : 我發現到主要時間都花在註冊事件上（delegate、on）， : 請問有什麼方法可以改進嗎？ : 目前有想到一個作法是使用setTimeout， : 慢慢地註冊事件， : 還是說會有更好的解法？ -- ※ 發信站: 批踢踢實業坊(ptt.cc) ◆ From: 180.218.155.23
→ mrbigmouth:就算有幾千幾萬個a 除非你用迴圈每個a都弄綁一個全新 06/08 10:44
→ mrbigmouth:的function....不然吃的資源還是可以忽略吧 06/08 10:45
→ mrbigmouth:另外原po已經說他使用delegate、on了 06/08 10:45
→ mrbigmouth:"以逐一找出綁上事件"這動作來看 "逐一找出"較佔資源 06/08 10:46
推 mrbigmouth:http://jsfiddle.net/mrbigmouth/d9j3H/ 06/08 10:55
→ mrbigmouth:給一萬個a綁click事件 在我的瀏覽器上只跑0.3秒 06/08 10:55
推 mrbigmouth:如果先把一萬個a找出來再綁事件...只花0.05秒左右 06/08 10:59
→ mrbigmouth:總而言之 單純"綁事件"這個動作 不會是效能瓶頸 06/08 10:59
→ mrbigmouth:http://jsfiddle.net/mrbigmouth/d9j3H/5/ 給錯網址XD 06/08 11:03
→ emn178:在PC上面的確是不會很慢,在行動裝置上才有感覺 06/08 14:00
→ emn178:你的例子在我的電腦上執行時間約1秒,其實還是花不少時間 06/08 14:04
推 mrbigmouth:請看console計的時間 前面要先製造一萬個a啊.... 06/08 15:51
→ emn178:console加起來1秒 沒錯啊 單位不是ms? 06/08 17:25
推 mrbigmouth:這就奇怪了 瀏覽器是? 怎麼會差這麼多XDDD 06/08 18:25
→ TonyQ:應該這麼說吧，如果這件事情慢，一定還有別的比他更慢.. 06/08 18:25
→ TonyQ:我以前都是再跟幾萬個 widget 打交道的 XD 06/08 18:27
→ emn178:我之前在android遇過速度很慢,改進後快千倍以上 06/08 20:53