ajax優(yōu)化
1、緩存ajax：
a、異步并不等于及時(shí)
2、請(qǐng)求使用GET
a、- 當(dāng)使用XMLHttpRequest時(shí)，而URL長(zhǎng)度不到2K，可以使用GET請(qǐng)求數(shù)據(jù)，GET相比POST更快速。、
b、POST類型請(qǐng)求要發(fā)送兩個(gè)TCP數(shù)據(jù)包。
①先發(fā)送文件頭
②再發(fā)送數(shù)據(jù)。
d、GET
①類型請(qǐng)求只需要發(fā)送一個(gè)TCP數(shù)據(jù)包。
②取決于你的cookie數(shù)量。
cookie
1、減少cookie的大小
2、使用無cookie的域
①比如圖片CSS等靜態(tài)文件放在靜態(tài)資源服務(wù)器上并配置單獨(dú)域名，客戶端請(qǐng)求靜態(tài)文件的時(shí)候，減少COOKIE反復(fù)傳輸時(shí)對(duì)主域名的影響。
dom優(yōu)化
1、優(yōu)化節(jié)點(diǎn)修改。
使用cloneNode在外部更新節(jié)點(diǎn)然后再通過replace與原始節(jié)點(diǎn)互換。
var orig = document.getElementById('container');
var clone = orig.cloneNode(true);
var list = ['foo', 'bar', 'baz'];
var content;
for (var i = 0; i < list.length; i++) {
content = document.createTextNode(list[i]);
clone.appendChild(content);
}
orig.parentNode.replaceChild(clone, orig);
2、優(yōu)化節(jié)點(diǎn)添加
多個(gè)節(jié)點(diǎn)插入操作，即使在外面設(shè)置節(jié)點(diǎn)的元素和風(fēng)格再插入，由于多個(gè)節(jié)點(diǎn)還是會(huì)引發(fā)多次reflow。
a、優(yōu)化的方法是創(chuàng)建DocumentFragment，在其中插入節(jié)點(diǎn)后再添加到頁面。
如JQuery中所有的添加節(jié)點(diǎn)的操作如append，都是最終調(diào)用DocumentFragment來實(shí)現(xiàn)的，
createSafeFragment(document) {
var list = nodeNames.split("|"),
safeFrag = document.createDocumentFragment();
if (safeFrag.createElement) {
while (list.length) {
safeFrag.createElement(
list.pop();
);
};
};
return safeFrag;
};
3、優(yōu)化css樣式轉(zhuǎn)換
如果需要?jiǎng)討B(tài)更改CSS樣式，盡量采用觸發(fā)reflow次數(shù)較少的方式。
a、 如以下代碼逐條更改元素的幾何屬性，理論上會(huì)觸發(fā)多次reflow
element.style.fontWeight = 'bold' ;
element.style.marginLeft= '30px' ;
element.style.marginRight = '30px' ;
b、可以通過直接設(shè)置元素的className直接設(shè)置，只會(huì)觸發(fā)一次reflow
element.className = 'selectedAnchor' ;
4、減少dom元素?cái)?shù)量
a、 在console中執(zhí)行命令查看DOM元素?cái)?shù)量。
`document.getElementsByTagName( '*' ).length`
b、正常頁面的DOM元素?cái)?shù)量一般不應(yīng)該超過1000
c、DOM元素過多會(huì)使DOM元素查詢效率，樣式表匹配效率降低，是頁面性能最主要的瓶頸之一。
5、dom操作優(yōu)化
a、DOM操作性能問題主要有以下原因。
①、DOM元素過多導(dǎo)致元素定位緩慢。
②、大量的DOM接口調(diào)用。
：
JAVASCRIPT和DOM之間的交互需要通過函數(shù)API接口來完成，造成延時(shí)，尤其是在循環(huán)語句中。
③、DOM操作觸發(fā)頻繁的reflow(layout)和repaint。
④、layout發(fā)生在repaint之前，所以layout相對(duì)來說會(huì)造成更多性能損耗。
reflow(layout)就是計(jì)算頁面元素的幾何信息。
repaint就是繪制頁面元素。
⑤、對(duì)DOM進(jìn)行操作會(huì)導(dǎo)致瀏覽器執(zhí)行回流reflow。
b、解決方案
⑥、
⑦、
⑧、
⑨、
⑩、
