李鑫

摘要：隨著在最近幾年當(dāng)中，我國的網(wǎng)絡(luò)信息技術(shù)不斷發(fā)展，我國也已經(jīng)進(jìn)入了web2.0時代，因此，傳統(tǒng)的網(wǎng)頁制作已經(jīng)逐漸走上歷史舞臺，web前端的開發(fā)就顯得尤為重要，基于此種情況在該文當(dāng)中，筆者結(jié)合自己的實際工作經(jīng)驗對web前端的開發(fā)技術(shù)進(jìn)行了必要的研究，同時總結(jié)了具體的優(yōu)化策略。

關(guān)鍵詞：Web前端；開發(fā)技術(shù)；優(yōu)化

中圖分類號：TP3 文獻(xiàn)標(biāo)識碼：A 文章編號：1009-3044（2017）05-0056-01

自從20世紀(jì)90年代開始，我國的信息技術(shù)開始了快速的發(fā)展，基于此種情況，信息技術(shù)被廣泛地運用在各行各業(yè)當(dāng)中，并促進(jìn)了社會的不斷發(fā)展，在這個過程當(dāng)中我國的技術(shù)也不斷被促進(jìn)，當(dāng)前階段我國已經(jīng)進(jìn)入了Web2.0時代。Web前端開發(fā)技術(shù)是一種基于網(wǎng)頁制作技術(shù)發(fā)展而來的一種全新的技術(shù)，同時也是一種極具時代特征的技術(shù)。Web前端開發(fā)技術(shù)與網(wǎng)頁制作技術(shù)之間也存在著較大的區(qū)別，網(wǎng)頁制作技術(shù)主要是為了顯示出一些靜態(tài)的東西，同時用戶也基本只會進(jìn)行一些網(wǎng)站的瀏覽，但是在Web2.0時代中，用戶對網(wǎng)頁的要求不斷被提高，基于此種情況傳統(tǒng)的網(wǎng)頁制作技術(shù)已經(jīng)逐漸無法滿足時代的需求，因此必須要進(jìn)行該機，基于此種情況，筆者進(jìn)行了一定的研究。

1 Web前端開發(fā)技術(shù)研究

Web前端開發(fā)的主要內(nèi)容包括以下三個方面：：HTML、CSS、JavaScript，這三種語言之間本身也存在著較大的差別，同時在代碼方面也具有不同的質(zhì)量要求，但是也存在著一定的聯(lián)系，在下文當(dāng)中筆者將對Web前端開發(fā)中較為常用的技術(shù)進(jìn)行必要的闡述。

1.1 HTML/XHTML

HTML5：超文本標(biāo)記語言（HTML5）在結(jié)構(gòu)當(dāng)中具有更加清晰的結(jié)構(gòu)，同時也將傳統(tǒng)網(wǎng)頁制作當(dāng)中一些與時代發(fā)展不符的標(biāo)記去除了，同時展示與內(nèi)容也被完全的分離開來，這種結(jié)構(gòu)被改進(jìn)了的語言所生成出來的網(wǎng)頁一般情況下都較為整潔，同時也便于管理，同時還可以在很大程度上提高客戶的用戶體驗，通過搜索引擎以及屏幕閱讀器可以實現(xiàn)有效的抓取，同時在移動設(shè)備當(dāng)中HTML5還具有更加強大的優(yōu)勢，因此更適合如 Web 操作系統(tǒng)一類的 RIA 應(yīng)用的前端開發(fā)。

1.2 層疊樣式表

在Web前端的開發(fā)過程當(dāng)中，層疊樣式表具有非常重要的作用，層疊樣式表主要是被用來控制網(wǎng)頁的樣式，同時層疊樣式表允許網(wǎng)頁的內(nèi)容以及相關(guān)的樣式信息可以被有效的分離開來，同時也具有更多的優(yōu)勢，如可以有效地提高網(wǎng)絡(luò)瀏覽的速度，同時對于網(wǎng)絡(luò)的維護(hù)也具有非常重要的意義。

1.3 JavaScript

JavaScript是Netscape公司的產(chǎn)品，開發(fā)目的是為了擴展Netscape Navigator的功能，是一種介于Java和HTML之間、能嵌入Web頁面中基于對象和事件驅(qū)動的解釋性的編程語言。JavaScript出現(xiàn)后，信息和用戶之間不再只是簡單地顯示與瀏覽的關(guān)系，更可以進(jìn)行實時、動態(tài)、可交式的表達(dá)。當(dāng)前流行的Ajax也是依賴于JavaScript而存在的。

2 Web優(yōu)化研究

如果一個網(wǎng)站僅僅在網(wǎng)站的服務(wù)以及頁面設(shè)計具有非常好的質(zhì)量，這也并不能有效地提高網(wǎng)站的質(zhì)量，常常會出現(xiàn)頁面存在過長的延遲時間，用戶體驗較差等現(xiàn)象，因此，必須要對Web進(jìn)行必要的優(yōu)化，優(yōu)化的重要方式有以下幾個方面的內(nèi)容：

2.1 減少HTTP請求

在Web的優(yōu)化技術(shù)當(dāng)中，W減少HTTP請求具有非常重要的意義，在一個完整的HTTP請求當(dāng)中，完整的內(nèi)容主要包括以下幾個方面：DNS尋址、建立和服務(wù)器的連接、發(fā)送數(shù)據(jù)、等待服務(wù)器響應(yīng)、接收數(shù)據(jù)等復(fù)雜的過程，在這個過程當(dāng)中用戶可以深刻地感受到在這個過程當(dāng)中資源是需要一定的成本的，因為在每個HTTP請求當(dāng)中，都攜帶了大量的數(shù)據(jù)，同時每個數(shù)據(jù)都需要占用一定的網(wǎng)絡(luò)資源，但是不管是任何瀏覽器都不能無限制的發(fā)送請求，如果請求的數(shù)量較多，瀏覽器必須要分不同的批次進(jìn)行處理，這就會進(jìn)一步加速用戶的等待時間。當(dāng)前階段減少HTTP請求的方法主要有以下幾種方式：合并文件、CSS Sprites以及內(nèi)聯(lián)圖像等。

2.2 減壓縮文件的大小

可以將CSS以及JavaScript文件進(jìn)行壓縮處理，同時對其中的代碼進(jìn)行優(yōu)化，對于代碼的優(yōu)化主要包括減少內(nèi)聯(lián)樣式、去除html標(biāo)簽和CSS的代碼優(yōu)化。

2.3 將script放在底部

此舉措旨在防止script腳本的執(zhí)行阻塞頁面的下載，因而提高頁面組件的下載速度，減少頁面的加載時間，提高網(wǎng)站前端的性能。

2.4 避免重定向

在瀏覽網(wǎng)絡(luò)的過程當(dāng)中，如果頁面需要進(jìn)行重新定向，則必須要耗費一定的時間，導(dǎo)致重新定向的原因多種多樣，但是每次進(jìn)行重新定向時都會增加一次Web請求，因此，必須要盡量的避免重定向。

3 結(jié)束語

從最開始的網(wǎng)絡(luò)博客時代到現(xiàn)在的Web2.0時代，各種前端的開發(fā)以及應(yīng)用都不能脫離Web本身的，在最近幾年當(dāng)中Web技術(shù)得到了進(jìn)一步的快速發(fā)展，這對于Web應(yīng)用的交互性以及系統(tǒng)能力都具有非常重要的意義，因此對Web前端開發(fā)技術(shù)進(jìn)行研究具有非常重要的意義，基于此種情況，在本文當(dāng)中筆者對現(xiàn)階段的Web前端開發(fā)技術(shù)進(jìn)行了必要的研究，并總結(jié)了對應(yīng)的解決策略，希望能對現(xiàn)階段我國的信息技術(shù)的發(fā)展有所幫助。

參考文獻(xiàn)：

[1] 劉觀宇. 面向LAMP的Web前端代碼處理系統(tǒng)的設(shè)計與實現(xiàn)[D].北京： 中國科學(xué)院大學(xué)工程管理與信息技術(shù)學(xué)院， 2015.

[2] 高楠楠. 基于HTML5的WebGIS前端類庫設(shè)計與性能優(yōu)化實踐研究[D]. 上海：華東師范大學(xué)， 2014.

[3] 劉靖桐. 面向Web2.0的web應(yīng)用前端開發(fā)框架的設(shè)計與實現(xiàn)[D]. 北京：北京郵電大學(xué)， 2014.

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

[5] 曾祥坤. 發(fā)動機前端附件驅(qū)動系統(tǒng)旋轉(zhuǎn)振動特性實測與計算方法的研究[D].廣州： 華南理工大學(xué)， 2012.

[6] 郭本青. CMOS有源混頻器噪聲及射頻接收前端關(guān)鍵技術(shù)研究[D]. 成都：電子科技大學(xué)， 2011.

[7] 趙歡. 面向嵌入式計算平臺的自動語音識別關(guān)鍵技術(shù)研究[D]. 長沙：湖南大學(xué)， 2010.