作者TonyQ (自立而後立人。)
看板Ajax
標題Re: [問題] 油猴腳本越來越肥了，求優化方案
時間Mon Jul 2 23:18:21 2012
※ 引述《ff760725 (信圓香，得永萌。)》之銘言：
: 我正在寫一個將某網頁遊戲許多圖片都替換掉的script
: 裡面有很多像是這種的內容
: //--------------------------------------------------------------------
: //www.erepublik.com/en/economy/advanced-buildings
: //--------------------------------------------------------------------
: if (document.location.toString().indexOf("/economy/advanced-buildings")!==-1)
: {
: $(".listing_holder > .list_group > .listing > .area_pic > img[src=
: 'http://www.erepublik.com/images/modules/myland/buildings
: /health_100.png']").attr('src','http://i.imgur.com/qVEfJ.png');
: $(".listing_holder > .list_group > .listing > .area_pic > img[src=
: 'http://www.erepublik.com/images/modules/myland/buildings
: /health_200.png']").attr('src','http://i.imgur.com/RLJEh.png');
: $(".listing_holder > .list_group > .listing > .area_pic > img[src=
: 'http://www.erepublik.com/images/modules/myland/buildings
: /health_300.png']").attr('src','http://i.imgur.com/TeWP9.png');
: $(".listing_holder > .list_group > .listing > .area_pic > img[src=
: 'http://www.erepublik.com/images/modules/myland/buildings
: /health_400.png']").attr('src','http://i.imgur.com/I3rRj.png');
: $(".listing_holder > .list_group > .listing > .area_pic > img[src=
: 'http://www.erepublik.com/images/modules/myland/buildings
: /health_500.png']").attr('src','http://i.imgur.com/pAbTR.png');
: $(".listing_holder > .list_group > .listing > .area_pic > img[src=
: 'http://www.erepublik.com/images/modules/myland/buildings
: /health_600.png']").attr('src','http://i.imgur.com/RGeQb.png');
: $(".listing_holder > .list_group > .listing > .area_pic > img[src=
: 'http://www.erepublik.com/images/modules/myland/buildings
: /special_50.png']").attr('src','http://i.imgur.com/W34wz.png');
: $(".listing_holder > .list_group > .listing > .area_pic > img[src=
: 'http://www.erepublik.com/images/modules/myland/buildings
: /special_100.png']").attr('src','http://i.imgur.com/DW37w.png');
: $(".listing_holder > .list_group > .listing > .area_pic > img[src=
: 'http://www.erepublik.com/images/modules/myland/buildings
: /special_200.png']").attr('src','http://i.imgur.com/V458I.png');
: };
: 但在不知不覺間隨著要替換的圖片越來越多，script也越來越肥
: 現在已經超過100kb了，而且在執行上也能感覺到有遲鈍的情形發生...
: 請問有優化方案嗎？
: 感謝 <(_ _)>
: 附上原script
: 雖然以上的最新一段還沒上傳到網上，但原理都是一樣的
: http://synex520free.kilu.de/0_plugin/Touhou.user.js
這種寫法又肥又沒效率，
如果只是要換掉特定網址的圖片，我會建議這樣寫
var replacedMap = {
"
http://www.erepublik.com/images/modules/myland/buildings/health_100.png":
'
http://i.imgur.com/qVEfJ.png' ,
"
http://www.erepublik.com/images/modules/myland/buildings/health_200.png":
'
http://i.imgur.com/RLJEh.png'
/* 以此類推 先建對照表 */
}
var images = document.images;
for(var i = 0,len = images.length ; i < len ;++i){
var replaced = replacedMap[images[i].src];
if ( replaced ){
images[i].src = replaced;
}
}
http://jsfiddle.net/WD88W/
如果說有特定 context 的話，還可以再快一點，
但是基本上改成這樣應該就可以比你原本的效率再快個兩倍了。
而且還根本都不需要用到 jQuery 。
--
Life's a struggle but beautiful.
--
※ 發信站: 批踢踢實業坊(ptt.cc)
◆ From: 114.25.96.203
※ 編輯: TonyQ 來自: 114.25.96.203 (07/02 23:18)
1F：→ TonyQ:然後你程式碼裡面 contains 那段也超慢得，可以一樣用建表 07/02 23:20
2F：→ TonyQ:法處理。 07/02 23:20
3F：→ ff760725:請問建表法是...？事實上我基本是程式盲，只是把現成的 07/02 23:30
4F：→ ff760725:拿來，用Chrome查元素之後填上去而已...可否請您開個頭， 07/02 23:31
5F：→ ff760725:後面重複複製貼上的工作我來就好了 XDD 07/02 23:31
6F：→ no1kk:對照表，{'圖A':'新A','圖B':'新B'.....}以此類推，其他不 07/03 00:25
7F：→ no1kk:用改 07/03 00:25