-
用戶之所以訪問我們的網(wǎng)站须揣，并不是為了看那些精心制作的壯麗圖景诀豁，華美流暢的
CSS動畫以及語義豐富的HTML標(biāo)記畔规，他們關(guān)心的是網(wǎng)站內(nèi)容能不能滿足其需求伏穆，也就是網(wǎng)站的功能是不是他們想要的拘泞！有些人喜歡嘗鮮，它們會使用
HTML5以及CSS3中的新屬性枕扫，但是不做瀏覽器適配陪腌，這樣的話就導(dǎo)致在有些瀏覽器中我們的界面看上去十分高大上，而且一些不支持新屬性的瀏覽器中看上去卻格格不入。所以我建議當(dāng)使用CSS3或者HTML5新屬性的時候诗鸭，首先去查看一下屬性在各瀏覽器的支持情況染簇，針對那些不支持新屬性的瀏覽器做出優(yōu)雅的替代方案。你可以在 HTML5 Readiness 查看新屬性在瀏覽器中的支持情況强岸。
漸進(jìn)增強(qiáng)是網(wǎng)頁前端開發(fā)的基礎(chǔ)锻弓，什么是漸進(jìn)增強(qiáng)呢？從基礎(chǔ)層面上說请唱，就是將 HTML, CSS, JavaScript 分成不同的三個層面弥咪， HTML 是結(jié)構(gòu)層过蹂， CSS 是表現(xiàn)層十绑， JavaScript 是行為層。我們讓上方的層依賴于下方的層酷勺，也就是 JavaScript 依賴 CSS, CSS 又依賴于 HTML本橙。和漸進(jìn)增強(qiáng)模型相似的，還有一個稱之為平穩(wěn)退化的開發(fā)模型脆诉，這兩種方式的主要區(qū)別在于甚亭，漸進(jìn)增強(qiáng)模型關(guān)注的重點(diǎn)是內(nèi)容，而平穩(wěn)退化模型關(guān)注的重點(diǎn)是瀏覽器击胜。
- 我們可以通過
Http請求去獲取我們需要的圖像或者CSS資源亏狰，默認(rèn)情況下，瀏覽器會成對的下載這些資源偶摔，由于帶寬的限制暇唾，你不可能一次就把所有的資源全部下載下來。通常來說辰斋，一次獲取兩個資源策州，可以將處理器的負(fù)載保持在合適的水平上，不至于影響到運(yùn)行在用戶電腦上的其它程序宫仗。但是JavaScript文件受到瀏覽器的特殊照顧够挂，只要用HTTP請求來獲取這種文件，那么其它資源的下載都要停止藕夫，這也是我們?yōu)槭裁磳?JS文件的引用放置到頁面末尾孽糖。
JavaScript 所做的大部分工作，就是在行為層中改善用戶體驗(yàn)毅贮，也就是拓展網(wǎng)站現(xiàn)有的功能對其錦上添花办悟。 但是，我們切不可亂用 JavaScript, 怎么檢測我們是否亂用呢嫩码？ 最好的辦法就是關(guān)閉瀏覽器的 JavaScript 功能誉尖，以用戶的角度看看網(wǎng)站是否還能正常工作。
還有一個值得注意的問題是铸题，由于瀏覽器渲染 CSS 的速度要比 JavaScript 快的多铡恕，所以在能用 CSS 替代 JavaScript 的情況下琢感，那就替代它。
- 在編寫應(yīng)用程序時探熔，最好能把所有的變量都集中在
JavaScript文件或函數(shù)頭部驹针，這樣的話，它們就能立即被緩存起來诀艰，供稍候使用柬甥。比如像下面這樣。
var first = 1,
second = 2,
third = 3;
匿名函數(shù)就是那種沒有名字的函數(shù)其垄，使用它的一個巨大優(yōu)勢就在于原本會落入到全局作用域的變量苛蒲，現(xiàn)在就全部局限在該匿名函數(shù)的內(nèi)部了。比如下面這個例子绿满，我們將 eat 和 sleep 全部放置到 Person 對象當(dāng)中臂外，顯得更加直觀。
(function() {
var Person = {
eat: function() {
console.log("I am eating!");
},
sleep: function() {
console.log("I am sleeping!");
}
}
Person.eat();
})();
當(dāng)然喇颁，在對象中嵌入函數(shù)和在對象中添加變量一樣漏健，也有相同的性能憂患。一個函數(shù)在對象中嵌套的越深橘霎，調(diào)用時所需的解析時間就越長蔫浆。
在使用函數(shù)的時候，如果在函數(shù)名后加上括號姐叁，則表示立刻調(diào)用瓦盛，如果不加括號，則表示不想立刻調(diào)用七蜘，比如在我們添加事件監(jiān)聽的時候谭溉，往往使用不加括號的形式。
JavaScript有兩種常見的開發(fā)模式橡卤，分別是 “函數(shù)與閉包模式” 和 “事件驅(qū)動模式”扮念。所謂函數(shù)與閉包模型就是將所有的內(nèi)容封裝城一個對象，并且在不暴露那個對象中其它函數(shù)和局部變量的情況下碧库，創(chuàng)造出一套可以在整個應(yīng)用程序中使用的公共API.而事件驅(qū)動模式更為直接柜与，就是直接設(shè)置好函數(shù)，在事件監(jiān)聽器中調(diào)用即可嵌灰。JQuery中有個ready()方法弄匕，它與原生的load事件有所不同。load事件會等到包括圖片在內(nèi)的所有資源都加載好了之后沽瞭，才被觸發(fā)迁匠。而ready()方法不會等到所有圖片都加載完了才去執(zhí)行回調(diào)代碼，而是只等DOM對象被構(gòu)建好之后就開始執(zhí)行，這樣用戶的體驗(yàn)就會更加平滑一些城丧。
