CSS：
JS：
瀏覽器渲染頁面都是自上而下的渲染，當(dāng)在<body>里遇到<link>或是<style>時(shí)候會(huì)阻塞渲染頁面，而且也有可能會(huì)造成頁面重繪，就好像格子鋪里，東西都按順序擺好了，但是老板說，這個(gè)東西得這樣、那樣擺，又得挨個(gè)重新擺了。除此之外，加在<head>里是為了可以順序加載所需的樣式。
很多人包括我在內(nèi)，當(dāng)學(xué)習(xí)到CSS表達(dá)式時(shí)候，都說避免或不要用它，所以都偷懶的不用看了，包括JS里的eval一樣……
后來有一次項(xiàng)目我就偏偏用了一次，結(jié)果。。。它成為了最后查出來的BUG。。。（IE6下影響了頁面樣式）
其實(shí)CSS表達(dá)式最主要的弊端是它影響性能，要知道CSS是具有時(shí)效性的，也就是說，當(dāng)你修改一下樣式，它會(huì)馬上生效，
而改變窗口大小，滾動(dòng)頁面甚至移動(dòng)鼠標(biāo)都會(huì)觸發(fā)表達(dá)式進(jìn)行頻繁的求值，會(huì)嚴(yán)重影響，所以要盡量避免。
我們都知道使用外部文件會(huì)增加HTTP請(qǐng)求，但是由于緩存的關(guān)系，當(dāng)用戶再次訪問時(shí)，或者訪問其它頁面里相同的文件時(shí)候，頁面會(huì)明顯提升響應(yīng)速度，而且，還有一點(diǎn)好處就是外部JSS、CSS可以減少頁面內(nèi)的文檔大小。
這個(gè)不用說了……你說為什么？
先來看看兩者區(qū)別：
區(qū)別1：老祖宗的差別。@import完全是CSS提供的一種方式，link是XHTML標(biāo)簽，除了加載CSS外，還可以定義RSS等其他事務(wù)；@import屬于CSS范疇，只能加載CSS。
區(qū)別2：加載順序的差別。link引用CSS時(shí)，在頁面載入時(shí)同時(shí)加載；@import需要頁面網(wǎng)頁完全載入以后加載。
區(qū)別3：兼容性的差別。link是XHTML標(biāo)簽，無兼容問題；@import是在CSS2.1提出的，低版本的瀏覽器不支持。
區(qū)別4：使用dom控制樣式時(shí)的差別。link支持使用Javascript控制DOM去改變樣式；而@import不支持。
兩者比較，@import明顯弱爆了……
IE獨(dú)有屬性AlphaImageLoader用于修正7.0以下版本中顯示PNG圖片的半透明效果。這個(gè)濾鏡的問題在于瀏覽器加載圖片時(shí)它會(huì)終止內(nèi)容的呈現(xiàn)并且凍結(jié)瀏覽器。在每一個(gè)元素（不僅僅是圖片）它都會(huì)運(yùn)算一次，增加了內(nèi)存開支，因此它的問題是多方面的。
完全避免使用AlphaImageLoader的最好方法就是使用PNG8格式來代替，這種格式能在IE中很好地工作。如果你確實(shí)需要使用AlphaImageLoader，請(qǐng)使用下劃線_filter又使之對(duì)IE7以上版本的用戶無效。
腳本的問題就是當(dāng)瀏覽器渲染時(shí)候遇到<script>，就會(huì)跑去下載，然后執(zhí)行里面的JS，這期間頁面就會(huì)阻塞，等待完事了再繼續(xù)向下執(zhí)行。所以，為了先將頁面最快的呈現(xiàn)給用戶，JS應(yīng)放在</body>的上面。
訪問：在《高性能JavaScript》中這么比喻：“把DOM看成一個(gè)島嶼，把JS看成另一個(gè)島嶼，兩者之間以一座收費(fèi)橋連接”。
操作：修改和訪問DOM元素會(huì)造成頁面的Repaint和Reflow，也就是重繪和回流。
所以問題顯而易見。
解決方案：緩存已經(jīng)訪問過的有關(guān)元素
更新完節(jié)點(diǎn)之后再將它們一次性添加到文檔樹中
事件委托，也就是利用事件冒泡的機(jī)制，把事件綁定到元素對(duì)象的父元素上。
例如：一個(gè)多行的表格，含有經(jīng)過提示行效果，并且表格會(huì)隨著分頁經(jīng)行變化。
分析：鑒于上面的第7條，我們不能犧牲性能去為每個(gè)變化的行元素綁定事件。
解決方案：把事件綁定到table的父元素上，根據(jù)e.target(e.secElement)的節(jié)點(diǎn)類型判斷來進(jìn)行操作
新聞熱點(diǎn)
疑難解答
圖片精選
