陳 鯡

（大慶油田信息技術(shù)公司北京分公司，北京 100043）

在當前信息環(huán)境之下，互聯(lián)網(wǎng)對于整個社會生產(chǎn)生活的影響都已經(jīng)到了不容忽視的地步，甚至于在某些特殊環(huán)境之下，相關(guān)活動的展開完全會對網(wǎng)絡(luò)產(chǎn)生依賴。而作為網(wǎng)頁呈現(xiàn)的主要依賴技術(shù)，Web前端開發(fā)擔負著網(wǎng)絡(luò)環(huán)境中信息展現(xiàn)的重要職責，并且其工作狀況，直接關(guān)系到互聯(lián)網(wǎng)用戶對于信息傳輸以及獲取服務(wù)的體驗，進一步影響到整個信息環(huán)境的價值實現(xiàn)乃至于社會環(huán)境中諸多經(jīng)濟行動的展開。因此Web前段技術(shù)的優(yōu)化，對于切實提升互聯(lián)網(wǎng)的使用體驗，有著毋庸置疑的積極意義。

1 Web前端技術(shù)體系以及工作分析

Web前端技術(shù)體系中，HTML、CSS、JavaScript成為三個支撐性質(zhì)的關(guān)鍵因素，三種語言分別承擔不同職能，并且執(zhí)行和遵守不同標準，同時又保持著密切的合作關(guān)系。

而想要面向Web前端技術(shù)的實現(xiàn)展開良好的優(yōu)化，首先需要切實對其工作過程中的每一個細節(jié)有所了解，在此基礎(chǔ)之上，才能獲取良好效果。

當前的網(wǎng)絡(luò)環(huán)境中廣泛采用B/S結(jié)構(gòu)，因此從客戶端的瀏覽器展開相應(yīng)的分析，無疑符合當前的網(wǎng)絡(luò)環(huán)境技術(shù)特征。在瀏覽器對服務(wù)器展開頁面請求的時候，首先由用戶在瀏覽器端輸入網(wǎng)址，來實現(xiàn)對于url的請求，而后通過DNS服務(wù)器對域名進行解析，獲取到該域名所對應(yīng)的頁面ip地址，該地址可以讓計算機直接實現(xiàn)訪問。在此基礎(chǔ)之上，位于客戶端的瀏覽器會面向?qū)?yīng)的服務(wù)器發(fā)送HTTP請求，而服務(wù)器端在接收到相應(yīng)的HTTP請求的時候，依據(jù)瀏覽器對應(yīng)的url請求來確定對應(yīng)的目標文件。該目標文件通常以一個頁面網(wǎng)絡(luò)地址的形式存在，諸如ASP、PHP或者JSP文件等。而Web服務(wù)器則在這個過程中負責依據(jù)相應(yīng)頁面文件的具體內(nèi)容以及url相關(guān)參數(shù)，來通過數(shù)據(jù)庫或者相關(guān)文件實現(xiàn)對于資源的調(diào)用，并且最終實現(xiàn)對于數(shù)據(jù)的組織和HTML頁面的生成。

在生成了HTML文件之后，服務(wù)器執(zhí)行來自于客戶端瀏覽器的HTTP請求，將生成的HTML文件發(fā)送給瀏覽器，而瀏覽器則負責接收來自于服務(wù)器的HTML文件。隨后，瀏覽器會針對HTML文件展開解析，并且進一步面向服務(wù)器請求其中的鏈接資源文件，諸如JavaScript、CSS、多媒體資源、內(nèi)嵌網(wǎng)頁等。服務(wù)器會接到瀏覽器對于資源文件的HTTP請求，并且將對應(yīng)的資源文件通過網(wǎng)絡(luò)發(fā)送給客戶端瀏覽器。瀏覽器在接到這些資源文件之后，進行整理并且依據(jù)規(guī)則呈現(xiàn)到頁面環(huán)境中，同時承擔對相應(yīng)資源的展現(xiàn)方式實現(xiàn)重新排版的職能。在這個過程中，瀏覽器會自上而下執(zhí)行HTML文檔，當遇到相應(yīng)的頁面腳本的時候，會對腳本進行分析，并解釋執(zhí)行相應(yīng)的腳本代碼。當執(zhí)行腳本時，將阻塞之后的鏈接文件的加載。

2 Web前端技術(shù)優(yōu)化工作重點分析

對于頁面的存在而言，其核心價值在于傳遞相應(yīng)的信息并且通過信息的呈現(xiàn)滿足信息消費者的相應(yīng)需求，在互聯(lián)網(wǎng)的整體環(huán)境之下，如果這個信息獲取和呈現(xiàn)的過程時間過長或者展開形式不佳，必然會影響到用戶的信息消費過程體驗。從信息提供的角度看，是沒有實現(xiàn)信息本身的價值，而從信息獲取的角度看，這種狀態(tài)則有可能影響到信息對稱環(huán)境的產(chǎn)生，嚴重的情況下甚至會影響到正常的社會行為。

基于這樣的考慮，有必要針對Web前端技術(shù)展開對應(yīng)的優(yōu)化，切實提升頁面對于信息呈現(xiàn)的綜合體驗，實現(xiàn)信息自身價值?？偨Y(jié)而言，有如下幾個主要的優(yōu)化方面，可以作為當前的優(yōu)化工作重點對待。

2.1 HTTP請求優(yōu)化

針對HTTP請求展開優(yōu)化，減少不必要的請求，是切實提升整個Web前段技術(shù)體系的首要職責與工作重點。一個完整的HTTP請求包括多個方面，諸如DNS尋址、建立瀏覽器與服務(wù)器之間的連接、雙方數(shù)據(jù)的發(fā)送、瀏覽器等到服務(wù)器展開數(shù)據(jù)的傳輸?shù)榷鄠€環(huán)節(jié)。而這些環(huán)境中的每一個，都必然會占用一定的時間，將多個細節(jié)時間進行累加，必然會形成用戶端的時間成本，同時也會消費掉整個數(shù)據(jù)通路商的帶寬資源。因此想要從時間上實現(xiàn)優(yōu)化，實現(xiàn)用戶體驗的提升，HTTP請求數(shù)量的控制必不可少。常規(guī)的做法包括將多個CSS文件或JavaScript文件合并成一個，確保其能夠在一次請求下加以實現(xiàn)；在圖片地圖的優(yōu)化方面，則應(yīng)當考慮在一個圖像上劃分不同區(qū)域映射不同的鏈接；而對于內(nèi)聯(lián)圖像，則應(yīng)當注意保持圖像與文本一同實現(xiàn)下載和顯示。

2.2 優(yōu)化文件規(guī)模

對于這一方面而言，其工作相對較為瑣碎，主要工作內(nèi)容包括針對JavaScript和CSS文件以及對應(yīng)的代碼展開優(yōu)化。優(yōu)化工作重點主要有針對不必要的html標簽進行剔除優(yōu)化，以及避免內(nèi)聯(lián)式樣式存在，此外，對于CSS代碼優(yōu)化同樣也是這一方面工作的重點內(nèi)容。

2.3 內(nèi)容優(yōu)化

對于這一方面的工作主要可以考慮從兩個角度出發(fā)，即將樣式表放在頂部同時將script放在底部。CSS本身具有覆蓋層疊的特征，因此瀏覽器通常會考慮在完全加載完成之后再展開渲染工作，因此如果想要實現(xiàn)Web優(yōu)化，則可以考慮從CSS本身的加載著手實現(xiàn)。而對于將script放在底部這一做法，則主要是防止script腳本的執(zhí)行阻塞頁面的下載，從而造成頁面組件下載速度不足，頁面加載時間過長等問題的發(fā)生。

2.4 減少DNS查詢次數(shù)

DNS是另一個造成等待的因素，通常一次DNS解析20-120毫秒時間，如果頻繁發(fā)出DNS解析請求，必然會導致信息傳輸體驗的降低。更為重要的在于，DNS的查詢本身是瀏覽器進一步工作的基礎(chǔ)，在完成查詢之前，瀏覽器不會下載該域名之下的任何相關(guān)內(nèi)容，因此控制DNS查詢請求的次數(shù)，對于Web前端優(yōu)化工作而言至關(guān)重要。

2.5 避免重定向

這同樣是造成等待時間過長的因素之一，其形成原因相對復雜，從根本上看，每一次重定向都會增加一次Web請求。對于這一方面，可以考慮在Web 站點子目錄的后面添加“/”，實現(xiàn)有效避免一次重定向的目標。

3 結(jié)論

Web前端開發(fā)技術(shù)的優(yōu)化水平，直接關(guān)系到用戶體驗，因此必須予以重視。針對這一問題，只有在實際工作中不斷深入學習相關(guān)領(lǐng)域經(jīng)驗和技術(shù)，并且多展開對于頁面展開狀態(tài)的觀察，有的放矢展開優(yōu)化，才能取得良好效果。

[1]曹劉陽.編寫高質(zhì)量代碼：Web前端開發(fā)修煉之道[M].北京：機械工業(yè)出版社，2010.

[2]鄧小善，龍艷軍.高訪問量網(wǎng)站性能監(jiān)測與優(yōu)化的設(shè)計與實現(xiàn)[J].現(xiàn)代計算機：專業(yè)版，2009（2）.

[3]李強，楊巋，吳天吉.基于Asp_net的網(wǎng)站開發(fā)前端技術(shù)優(yōu)化研究[J].軟件導刊，2013，12（5）.