? ? 前端包括HTML、CSS、 Javascript、Image 、Flash等各種各樣的資源。前端優(yōu)化是復(fù)雜的，針對方方面面的資源都有不同的方式。那么，前端優(yōu)化的目的是什么?用戶角度而言，優(yōu)化能夠讓頁面加載得更快、對用戶的操作響應(yīng)得更及時(shí)，能夠給用戶提供更為友好的體驗(yàn)；從服務(wù)商角度而言，優(yōu)化能夠減少頁面請求數(shù)、或者減小請求所占帶寬，能夠節(jié)省可觀的資源。

? ? web前端網(wǎng)頁優(yōu)化工作

? ? 一、減少http請求。減少HTTP請求數(shù)的主要途徑包括：

? ? (1). 從設(shè)計(jì)實(shí)現(xiàn)層面簡化頁面，如果你的頁面像百度首頁一樣簡單，那么接下來的規(guī)則基本上都用不著了。保持頁面簡潔、減少資源的使用時(shí)最直接的。如果不是這樣，你的頁面需要華麗的皮膚，則繼續(xù)閱讀下面的內(nèi)容；

? ? (2). 合理設(shè)置 HTTP緩存，緩存的力量是強(qiáng)大的，恰當(dāng)?shù)木彺嬖O(shè)置可以大大的減少HTTP請求。

? ? 二、優(yōu)化代碼

? ? 讓代碼變得簡潔高效。代碼越多，頁面文件就越大，這樣不利于提高頁面的加載速度。所以在精簡代碼，減少不必要標(biāo)簽的同時(shí)也要善于合理利用標(biāo)簽。

? ? 三、js層面優(yōu)化

? ? 盡量減少DOM操作，DOM操作盡量做到批量更新，減少頁面回流和重繪；

? ? 避免內(nèi)存泄漏，及時(shí)清理已經(jīng)沒用的定時(shí)器、掛載的事件和其他引用；

? ? 合理使用事件委托，避免給大量子元素添加相同事件。

? ? 四、CSS優(yōu)化

? ? .CSS放在head里：使其盡早下載，因?yàn)閏hrome需要下載完所有的css后才渲染頁面；

? ? .避免選擇器層級太多，提高解析匹配速度；

? ? .對于css中可繼承的屬性，如font-size，盡量使用繼承，少一點(diǎn)設(shè)置。