Web前端開發(fā)技術(shù)的優(yōu)化發(fā)展

張曉龍

摘要：近年來，優(yōu)化Web前端技術(shù)之所以變得越來越炙手可熱，是因?yàn)檫@項(xiàng)技術(shù)會(huì)極大地縮短應(yīng)用的頁面加載時(shí)間，而且響應(yīng)速度更加迅速，進(jìn)而使用戶的上網(wǎng)體驗(yàn)更加良好。優(yōu)化Web前端技術(shù)可帶來有兩點(diǎn)益處，第一點(diǎn)就是有效地降低將頁面請(qǐng)求數(shù);第二點(diǎn)就是有效地節(jié)省了服務(wù)器資源，因?yàn)轫撁嬲?qǐng)求數(shù)的降低同時(shí)會(huì)減少所占的寬帶。因此，優(yōu)化Web前端技術(shù)不僅可以提高互聯(lián)網(wǎng)企業(yè)的運(yùn)行效率，還可以提高互聯(lián)網(wǎng)用戶上網(wǎng)體驗(yàn)?；诖?，該文首先簡(jiǎn)要介紹了在Web前端技術(shù)體系中中主要的三個(gè)技術(shù)，隨后從五個(gè)方面介紹了優(yōu)化Web前端技術(shù)的措施，以此來供相關(guān)人士交流參考。

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

中圖分類號(hào)：TP311 文獻(xiàn)標(biāo)識(shí)碼：A

1背景

隨著科技的發(fā)展，在網(wǎng)頁制作中，Web前端開發(fā)技術(shù)被廣泛應(yīng)用，因此目前其已經(jīng)成了網(wǎng)頁制作中一項(xiàng)不可或缺的重要技術(shù)。網(wǎng)頁制作水平隨著技術(shù)的更新?lián)Q代而不斷提高，使得網(wǎng)頁從最開始的靜態(tài)內(nèi)容顯示漸漸過渡到目前動(dòng)態(tài)內(nèi)容顯示。在我國，早期對(duì)于Web前端開發(fā)的認(rèn)知主要在于“網(wǎng)頁制作”，即通過語言變成制作一些靜態(tài)功能，并將其放置于Web當(dāng)中供用戶使用。在當(dāng)時(shí)Web是用戶使用網(wǎng)絡(luò)的一個(gè)基本窗口，因此用戶在熟悉了這種靜態(tài)功能后，其網(wǎng)絡(luò)用戶瀏覽網(wǎng)頁的習(xí)慣也被培養(yǎng)了起來。目前我國已在技術(shù)的發(fā)展和變革中，步入了Web2.0的新時(shí)代，在這一新時(shí)期，網(wǎng)絡(luò)用戶的網(wǎng)頁瀏覽需求變得多元化，早期Web前端開發(fā)防滲方式已經(jīng)落后于當(dāng)下的用戶要求，說明有其優(yōu)化的必要，Web前端開發(fā)技術(shù)類型也需要變得越來越多樣化。目前，多元化的需求已成為Web前端技術(shù)發(fā)展的一個(gè)主要方向，因?yàn)橹挥凶龅郊夹g(shù)上的提升，才能夠提升用戶的體驗(yàn)效果，增加網(wǎng)頁的客流量。

2Web前端開發(fā)技術(shù)

2.1DOM

AJAX技術(shù)使用DOM作動(dòng)態(tài)顯示和交互，解決DOM技術(shù)在WEB前端開發(fā)中的重要性是不容置喙的，它能為語言無關(guān)及WEB端提供標(biāo)準(zhǔn)的API，把XML文檔抽象地轉(zhuǎn)化為由節(jié)點(diǎn)構(gòu)成的樹形數(shù)據(jù)結(jié)構(gòu)，以此來增強(qiáng)頁面交互性，進(jìn)而實(shí)現(xiàn)訪問頁面其他標(biāo)準(zhǔn)組件，實(shí)現(xiàn)異構(gòu)訪問，OMG是其設(shè)計(jì)對(duì)象，定義了表示和修改文檔所需對(duì)象間的關(guān)系。

2.2AJAX

服務(wù)器數(shù)據(jù)解析與頁面數(shù)據(jù)獲取問題，創(chuàng)建動(dòng)態(tài)網(wǎng)頁，能有效減少后臺(tái)與服務(wù)器間的數(shù)據(jù)交互量，從而實(shí)現(xiàn)網(wǎng)頁異步更新。因此，AJAX是一種能有效減少信息請(qǐng)求量，從而提升網(wǎng)絡(luò)速度、使網(wǎng)絡(luò)運(yùn)行更穩(wěn)定的技術(shù)。

2.3CSS（疊層樣式表）

CSS是能用來表示HTML和XML等文件樣式的計(jì)算機(jī)語言，支持大部分字體字號(hào)樣式，在Web前端開發(fā)中，能精準(zhǔn)控制網(wǎng)頁排版對(duì)象，從而提高顯示效果，優(yōu)化寫法。除此之外，由于CSS代碼精簡(jiǎn)，所以網(wǎng)頁布局調(diào)整修改和重構(gòu)難度小，能有效提高開發(fā)效率和訪問速度，優(yōu)化SEO。

3優(yōu)化Web前端技術(shù)的措施

3.1優(yōu)化HTML頁面

通常而言，HTML頁面可以反映出一個(gè)瀏覽器的典型特點(diǎn)，它不僅能夠維持和保障網(wǎng)頁的基本性能，還能夠在這個(gè)基礎(chǔ)上讓用戶在視覺上的體驗(yàn)達(dá)到最佳。在優(yōu)化HTML頁面的時(shí)候，需要多方面多維度地考慮問題，不僅要確保單一頁面呈現(xiàn)的內(nèi)容是高質(zhì)量的，同時(shí)也要保證所有頁面內(nèi)容的完整性和高度統(tǒng)一。除此之外，還要確保頁面的設(shè)計(jì)和內(nèi)容是合理的和有吸引力的，避免出現(xiàn)因內(nèi)容索然無味而導(dǎo)致用戶流失的現(xiàn)象。

3.2縮減文件大小

技術(shù)問題和硬件設(shè)施只是影響互聯(lián)網(wǎng)加載速度的一個(gè)方面。文件的大小在一定程度上也會(huì)影響互聯(lián)網(wǎng)的加載速度，并且兩者之間呈現(xiàn)正相關(guān)的關(guān)系。所以，若是在短時(shí)間內(nèi)不考慮更換寬帶的前提下，加快網(wǎng)速就只能通過縮減文件的大小這一條道路了。在實(shí)際的操作上，這種方法就是對(duì)現(xiàn)有的代碼進(jìn)行簡(jiǎn)單的刪減和進(jìn)一步的整合。但值得注意的是，在這個(gè)過程中一定要盡可能地保護(hù)核心工程，不使其遭受意外破壞，否則文件往往會(huì)因?yàn)橐恍┎徽_的操作而無法打開。目前被大眾廣泛接受的方法有兩種，其本質(zhì)都是壓縮代碼，一是通過Javascript應(yīng)用程序，二是通過CSS文件，并且技術(shù)人員也可以在這個(gè)過程中根據(jù)具體的情況來刪除一些多余冗雜的代碼，從而真正達(dá)到縮減文件的目的。

3.3縮減HTTP請(qǐng)求

一個(gè)完整的HTTP請(qǐng)求包括多個(gè)環(huán)節(jié)，如DNS尋址、發(fā)送雙方的數(shù)據(jù)、建立瀏覽器和服務(wù)器間的連接并傳輸數(shù)據(jù)、等待服務(wù)器響應(yīng)等。而造成HTTP請(qǐng)求眾多的原因，最根本的是由于程序設(shè)計(jì)人員的經(jīng)驗(yàn)不足，但是這些設(shè)計(jì)人員卻在設(shè)計(jì)網(wǎng)頁時(shí)，刻意添加一些煩瑣冗雜的操作來追求華麗的視覺效果。因此，由于沒有足夠的技術(shù)和能力來簡(jiǎn)化這些步驟，網(wǎng)站不得不承受更大的負(fù)荷和壓力，有時(shí)候，網(wǎng)站頁面上總是會(huì)彈出一些垃圾窗口和垃圾廣告，從而直接導(dǎo)致了網(wǎng)頁加載通道被擠占，加載速度被延緩，最終造成用戶的體驗(yàn)效果被大大降低了。若要杜絕此類情況再三出現(xiàn)，就必須讓程序員接受培訓(xùn)，強(qiáng)化其技能，讓其在正式投入工作之前多進(jìn)行實(shí)訓(xùn)，積累實(shí)戰(zhàn)經(jīng)驗(yàn)，并轉(zhuǎn)變其追求華麗而不切實(shí)際的效果的想法，盡量要求其在設(shè)計(jì)過程中精簡(jiǎn)步驟，確保最后做出的網(wǎng)頁效果是簡(jiǎn)單流暢的，且用戶操作起來更加便捷。

3.4縮短DNS的查詢時(shí)間

我們通過實(shí)際調(diào)查得出，DNS的查詢時(shí)間一般比較長(zhǎng)，有時(shí)候還會(huì)遇到長(zhǎng)時(shí)間的加載卻依然無法順利進(jìn)入網(wǎng)站的情況，有些用戶在長(zhǎng)時(shí)間等待后會(huì)選擇放棄進(jìn)入網(wǎng)頁，并且不會(huì)再進(jìn)行第二次體驗(yàn)。由于這種情況會(huì)浪費(fèi)很多用戶的寶貴時(shí)間，并導(dǎo)致用戶的體驗(yàn)效果不佳，最終會(huì)影響網(wǎng)頁的整體訪問量，阻礙網(wǎng)站的進(jìn)一步發(fā)展。因此，就必須盡快找到相應(yīng)的解決方法，使其能夠減短DNS的查詢時(shí)間，使用戶獲得更快更好的上網(wǎng)體驗(yàn)。

3.5優(yōu)化頁面設(shè)計(jì)

網(wǎng)站的網(wǎng)頁設(shè)計(jì)在一定程度上是決定客流量的關(guān)鍵因素，好的設(shè)計(jì)頁面往往更能抓住客戶的眼球，吸引其進(jìn)行點(diǎn)擊和瀏覽。但是，當(dāng)前絕大多數(shù)網(wǎng)站的網(wǎng)頁設(shè)計(jì)都不如人意，毋庸置疑，設(shè)計(jì)人員缺乏創(chuàng)新是重要因素之一，因?yàn)橛行┰O(shè)計(jì)人員依然保持著傳統(tǒng)的想法和陳舊的理念，在設(shè)計(jì)時(shí)只考慮到視覺效果，但是華而不實(shí)的設(shè)計(jì)卻在一定程度上降低了用戶的體驗(yàn)感，因?yàn)榫W(wǎng)站設(shè)計(jì)不僅要追求效果還要追求實(shí)用性。所以，在招募設(shè)計(jì)人員時(shí)也要注意其是否有創(chuàng)造力和扎實(shí)的技術(shù)，同時(shí)設(shè)計(jì)人員在網(wǎng)頁設(shè)計(jì)時(shí)也要根據(jù)用戶的心理和需求，投其所好，加入一些吸引人的元素，但與此同時(shí)，也要注重網(wǎng)站的實(shí)用性，始終將客戶放在主體地位，置身于客戶的角度，根據(jù)其實(shí)際需求來進(jìn)行網(wǎng)頁設(shè)計(jì)。最簡(jiǎn)單易行的方法就是做到簡(jiǎn)單、精致，讓客戶能快速找到自己需要的內(nèi)容，從而獲得良好的使用體驗(yàn)。

4結(jié)束語

信息技術(shù)在變革中不斷向前快速發(fā)展，數(shù)字化時(shí)代基本已經(jīng)在全國范圍內(nèi)普及開來，計(jì)算機(jī)網(wǎng)絡(luò)技術(shù)在潛移默化中融人了人們的生活，并在一定程度上改變了人們傳統(tǒng)的生活方式，并給人們的工作帶來了許多便利，從而逐漸成為人類社會(huì)生活中必不可少的一個(gè)重要部分。Web前端開發(fā)技術(shù)的優(yōu)化，直接帶來的一個(gè)可視的結(jié)果就是提高了人們的工作效率和用戶體驗(yàn)效果，在一定程度上杜絕了資源不匹配導(dǎo)致的浪費(fèi)，實(shí)現(xiàn)了資源的有效利用。因此，我們必須堅(jiān)持走優(yōu)化Web前端開發(fā)技術(shù)的道路，只有技術(shù)被優(yōu)化到成熟后，計(jì)算機(jī)網(wǎng)絡(luò)技術(shù)才能更好地服務(wù)人類。