相關(guān)關(guān)鍵詞
關(guān)于我們
最新文章
- 拉動懸浮于頂部的JS控制代碼
- 在JavaScript中構(gòu)建ArrayList示例代碼
- js使用for循環(huán)及if語句判斷多個一樣的name
- JavaScript中判斷原生函數(shù)檢查function是否是原生代碼
- jQuery CSS()方法改變現(xiàn)有的CSS樣式表
- JavaScript中判斷原生函數(shù)檢查function是否是原生代碼
- jQuery動畫高級用法(上)——詳解animation中的.queue()函數(shù)
- python小技巧之批量抓取美女圖片
- JS中offsetTop、clientTop、scrollTop、offsetTop各屬性介紹
- JS獲取瀏覽器窗口大小 獲取屏幕,瀏覽器,網(wǎng)頁高度寬度
轉(zhuǎn):網(wǎng)站優(yōu)化之Ajax優(yōu)化及相關(guān)工具
web2.0大量的ajax的使用,提高了ui交互的效率,但是過度的濫用會帶來不少的問題。
ajax使用注意事項:
1 盡量避免使用同步ajax調(diào)用。在一些登錄的場合常常使用同步調(diào)用服務(wù)器的登錄接口。
同步調(diào)用,需要將頁面上的所有元素給鎖定住,代價高昂。
2 ajax調(diào)用時多使用超時設(shè)置,目前許多ajax框架如jquery都會提供超時參數(shù)的設(shè)置。
利用超時,可以很好的完善ui的交互,同時避免對服務(wù)器造成壓力。
3 針對業(yè)務(wù)特性開啟ajax緩存。不需要重新拉取的東東,盡量的緩存起來。
4 發(fā)送請求前對發(fā)送的數(shù)據(jù)進行pre驗證,一方面可以做到對用戶友好,另一方面避免太多的異常。
不小心的異常數(shù)據(jù)會導(dǎo)致服務(wù)器down掉。
5 對于服務(wù)器返回的數(shù)據(jù)也要仔細處理,不要相信其數(shù)據(jù)一定是格式化和驗證好的。譬如對于json的數(shù)據(jù),需要先判斷相應(yīng)的key是否存在,再進行操作,
否則會出現(xiàn)undifined的情況。
ajax請求處理一般的ui交互流程是這樣的:
1 當(dāng)發(fā)起ajax請求時,更新ui,譬如出現(xiàn)一個高亮的tip,提示用戶操作開始進行
2 鎖住需要更新的ui部份,同時提醒用戶會什么會鎖住,譬如將原div隱藏,加載一個正在加載的gif圖標(biāo)
3 數(shù)據(jù)成功返回后,更新ui,解除對ui的鎖定
4 如果服務(wù)器返回失敗,提示用戶友好的失敗信息
ajax使用中一些提示:
1 由于瀏覽器的同時向一個域名發(fā)起請求的并發(fā)數(shù)是有限制的,如ie默認的是2個,如果同時發(fā)起的ajax太多的話,是會被阻塞的。
2 返回的數(shù)據(jù)類型選擇json而不是xml,一方面json數(shù)據(jù)格式會更小一些,另一方面接送封裝成為一個js對象,操作起來性能會更好一些
3 盡量緩存能夠緩存的內(nèi)容,避免重復(fù)的發(fā)起請求
1)使用全局對象
2) flash的本地存儲
3)google gears
4) ie的userData
網(wǎng)站優(yōu)化過程常用的工具:
1 firebug和yslow,ff下常用的兩個工具了
2 httpwatch和fiddler,對于網(wǎng)絡(luò)時間的檢測也不錯
3 Task manager
4 js內(nèi)存泄漏檢測工具
5 觀看優(yōu)化的工具:
1)AjaxView
2)JsLex
3)YUI profiler