摘 要：21世紀(jì)以來(lái)，人們的生活已經(jīng)開(kāi)啟了互聯(lián)網(wǎng)時(shí)代，生活變得更加的豐富和便利。作為網(wǎng)絡(luò)維護(hù)和優(yōu)化的重要手段，Web前端開(kāi)發(fā)技術(shù)的出現(xiàn)對(duì)整個(gè)互聯(lián)網(wǎng)產(chǎn)業(yè)都產(chǎn)生了巨大的影響。本文對(duì)網(wǎng)站建設(shè)的Web前端開(kāi)發(fā)技術(shù)進(jìn)行了介紹，并結(jié)合其應(yīng)用背景和時(shí)代需要，對(duì)其未來(lái)優(yōu)化方向進(jìn)行探討。

關(guān)鍵詞：網(wǎng)站制作;Web前端開(kāi)發(fā);優(yōu)化

中圖分類號(hào)：TP393.09 文獻(xiàn)標(biāo)識(shí)碼：A DOI：10.3969/j.issn.1003-6970.2021.02.034

本文著錄格式：何煜琳.基于網(wǎng)站制作的Web前端開(kāi)發(fā)優(yōu)化[J].軟件，2021，42（02）：112-114

Optimization of Web Front end Development Based on Website Production

HE Yulin

（Bayin Guoleng Technology College， Korla Xinjiang 841000）

【Abstract】：Since the 21st century， people's life has opened the Internet era， life has become more rich and convenient. As an important means of network maintenance and optimization， the emergence of Web front-end development technology has a huge impact on the entire Internet industry. This paper introduces the web front-end development technology of website construction， and discusses its future optimization direction combined with its application background and the needs of the times.

【Key words】：Website production;Web front end development;optimization

0 引言

網(wǎng)站制作的內(nèi)容是比較廣泛的。從細(xì)微處來(lái)看，其主要包括圖像的處理、網(wǎng)頁(yè)布局和數(shù)據(jù)庫(kù)的建立。在當(dāng)前科學(xué)技術(shù)飛速發(fā)展的階段，互聯(lián)網(wǎng)所承接的信息源越來(lái)越寬泛和多樣化。為了滿足不同用戶對(duì)信息獲取的不同需求，網(wǎng)站的制作也體現(xiàn)出越來(lái)越豐富化的趨勢(shì)。當(dāng)前社會(huì)，隨著網(wǎng)絡(luò)與信息技術(shù)的快速發(fā)展，科技化、智能化等正以無(wú)法想象的速度影響與參與著人們的生活。人們的生活變得更加的自動(dòng)化、現(xiàn)代化?？傮w來(lái)說(shuō)，在網(wǎng)站建設(shè)方面，基于網(wǎng)站制作的Web前端開(kāi)發(fā)技術(shù)起著相當(dāng)重要的作用，它使網(wǎng)頁(yè)呈現(xiàn)方式不再同以往相同，只是由過(guò)去的靜止圖片及文字組合而成，先進(jìn)的網(wǎng)站建設(shè)，內(nèi)容和形式都更加多樣和復(fù)雜，除了讓用戶體驗(yàn)到更加新鮮精彩舒適的瀏覽觀感，更可以使網(wǎng)站建設(shè)很好地為廣大用戶服務(wù)，實(shí)現(xiàn)其建設(shè)的真正價(jià)值。

1 Web前端開(kāi)發(fā)技術(shù)闡釋

1.1 Web前端開(kāi)發(fā)技術(shù)基本含義概述

從宏觀來(lái)說(shuō)，Web前端開(kāi)發(fā)技術(shù)主要包含三個(gè)關(guān)鍵性語(yǔ)言，分別是Java Script、HTML和CSS，這三種語(yǔ)言有著不同的作用與特點(diǎn)，執(zhí)行標(biāo)準(zhǔn)也并不完全一樣，但相互間又存在某種牽連性。其中HTML是超文本標(biāo)記語(yǔ)言，“超文本”表示用超鏈接的方法，將各種不同空間的文字信息組織在一起的網(wǎng)狀文本;Java則是一種操作簡(jiǎn)單但功能卻異常強(qiáng)悍的編程語(yǔ)言，吸納了大眾非常熟悉和了解的C++語(yǔ)言特征，同時(shí)對(duì)C++中一些理解困難的內(nèi)容做了摒棄處理;CSS則是用來(lái)表示HTML的計(jì)算機(jī)語(yǔ)言，它的功能是將元素變?yōu)閯?dòng)態(tài)。這三種語(yǔ)言在Web前端開(kāi)發(fā)技術(shù)中各司其職，但彼此相互間聯(lián)系緊密，是此項(xiàng)技術(shù)同等重要的三個(gè)組成部分?，F(xiàn)階段，最尋常的網(wǎng)絡(luò)環(huán)境是B/S結(jié)構(gòu)，結(jié)合當(dāng)前的網(wǎng)絡(luò)環(huán)境技術(shù)，對(duì)瀏覽器進(jìn)行分析研判。這種方法契合現(xiàn)代網(wǎng)絡(luò)技術(shù)的搜索需要。首先，使用瀏覽器時(shí)，使用者會(huì)先行輸入待瀏覽的網(wǎng)頁(yè)網(wǎng)址，輸入完成后，瀏覽器會(huì)向URL輸出請(qǐng)求信號(hào)，然后服務(wù)器會(huì)接收訊號(hào)，并詳細(xì)分析請(qǐng)求網(wǎng)址的域名，然后獲取網(wǎng)址的IP地址，這樣就完成了瀏覽任務(wù)的第一個(gè)重要步驟。這些操作完成后，使用瀏覽器的客戶端會(huì)向服務(wù)器終端發(fā)送HTTP，瀏覽器則會(huì)根據(jù)請(qǐng)求對(duì)HTTP進(jìn)行確認(rèn)，確認(rèn)之后的文件一般會(huì)呈現(xiàn)出網(wǎng)絡(luò)地址的形態(tài)。其中，Web服務(wù)器主要的應(yīng)用文件內(nèi)容和URL參數(shù)進(jìn)行相關(guān)數(shù)據(jù)處理并生成HTML文件。文件生成完成后，服務(wù)器會(huì)將HTML文件傳輸回瀏覽器。瀏覽器在接收文件后再一次對(duì)其進(jìn)行分析，并請(qǐng)求服務(wù)器將相關(guān)的資源文件進(jìn)行發(fā)送。服務(wù)器接受請(qǐng)求后，把目標(biāo)資源文件等傳輸?shù)綖g覽器，再由瀏覽器根據(jù)資源文件進(jìn)行相應(yīng)的數(shù)據(jù)整合，最終用戶就可以在瀏覽頁(yè)面上顯示出搜索內(nèi)容。

1.2 Web前端開(kāi)發(fā)技術(shù)的重點(diǎn)研究方向

從該技術(shù)的開(kāi)發(fā)過(guò)程來(lái)看，基于網(wǎng)站制作的Web前端開(kāi)發(fā)技術(shù)開(kāi)發(fā)之初，HTML和CSS就承擔(dān)了不同的功能。HTML技術(shù)的職能僅局限于幫助使用者訪問(wèn)網(wǎng)頁(yè)內(nèi)容，而CSS技術(shù)則將重點(diǎn)投放于網(wǎng)頁(yè)的架構(gòu)和頁(yè)面的美化。這項(xiàng)技術(shù)發(fā)展到現(xiàn)在，已經(jīng)開(kāi)始轉(zhuǎn)向網(wǎng)頁(yè)自動(dòng)跳轉(zhuǎn)及過(guò)渡到不同的內(nèi)容。另外，基于網(wǎng)站制作的Web前端開(kāi)發(fā)技術(shù)新增了“禁止網(wǎng)頁(yè)非法訪問(wèn)”技術(shù)，未來(lái)應(yīng)該會(huì)作為最基本功能運(yùn)用。與此同時(shí)，為消除非法人員企圖偽裝成普通用戶成功進(jìn)入通信網(wǎng)絡(luò)系統(tǒng)的問(wèn)題，基于網(wǎng)站制作的Web前端開(kāi)發(fā)技術(shù)特地增加了“防插入入侵權(quán)限”的功能開(kāi)發(fā)設(shè)計(jì)，對(duì)于加強(qiáng)建設(shè)身份認(rèn)證控制系統(tǒng)的功能，保障網(wǎng)站安全性起到了重要作用。另外，任何事物的發(fā)展過(guò)程中，都會(huì)呈現(xiàn)其多樣性和特殊性，很多事物都是利弊相互交替的，并無(wú)所謂的絕對(duì)好與不好。隨著Web技術(shù)的日漸強(qiáng)大，網(wǎng)絡(luò)病毒也呈現(xiàn)瘋狂態(tài)勢(shì)。為徹底將網(wǎng)絡(luò)病毒控制好，基于網(wǎng)站制作的Web前端開(kāi)發(fā)技術(shù)又開(kāi)發(fā)設(shè)計(jì)了安全密碼保護(hù)系統(tǒng)，希望可以為網(wǎng)絡(luò)安全保駕護(hù)航。另外，Web前端開(kāi)發(fā)技術(shù)對(duì)于適時(shí)阻止非法入侵行為，同時(shí)進(jìn)行技術(shù)創(chuàng)新，對(duì)網(wǎng)站中很多問(wèn)題可以提供行之有效的解決舉措，進(jìn)而實(shí)實(shí)在在地避免不穩(wěn)定因素的出現(xiàn)[1]。

如何獲取用戶的滿意，是Web前端開(kāi)發(fā)技術(shù)應(yīng)該著重考慮的問(wèn)題。廣大用戶在網(wǎng)絡(luò)日常消遣中，主要集中在網(wǎng)絡(luò)游戲、網(wǎng)絡(luò)娛樂(lè)、網(wǎng)購(gòu)等幾個(gè)方面。而在網(wǎng)絡(luò)用戶的需求中，基礎(chǔ)功能是影響用戶滿意度的最首要功能。因此，網(wǎng)站的建設(shè)，保障最基礎(chǔ)的功能順暢運(yùn)行的同時(shí)，適當(dāng)創(chuàng)新是具有競(jìng)爭(zhēng)力的重要方面。針對(duì)用戶的需求來(lái)看，如何快速實(shí)現(xiàn)網(wǎng)頁(yè)訪問(wèn)及瀏覽的自動(dòng)化，以及如何實(shí)現(xiàn)信息檢索的快速化是長(zhǎng)遠(yuǎn)發(fā)展的方向。因此，首先要實(shí)現(xiàn)網(wǎng)頁(yè)的自動(dòng)化，這樣才能最大限度地減輕人工操作系統(tǒng)的復(fù)雜性，提升網(wǎng)站使用效率，與此同時(shí)，也能在這一條件下實(shí)現(xiàn)信息共享，最終為用戶帶來(lái)便捷體驗(yàn)。

1.3 Web前端開(kāi)發(fā)技術(shù)的發(fā)展前景

當(dāng)前，受眾使用率最廣泛的瀏覽器集中在百度、360、IE等，但這些瀏覽器都有一個(gè)共同的缺陷：兼容性不夠。這也就成了Web前端開(kāi)發(fā)首要要解決的問(wèn)題。Web前端開(kāi)發(fā)語(yǔ)言是目前公認(rèn)的可能影響兼容的因素，作為Web前端開(kāi)發(fā)技術(shù)中的重要語(yǔ)言，HTML、CSS、JavaScrip

擔(dān)任著極端重要的作用。另外，基于網(wǎng)站制作的Web前端開(kāi)發(fā)技術(shù)將為以后的科技進(jìn)步提供更多的可能性。Web前端開(kāi)發(fā)技術(shù)影響著網(wǎng)站的制作，使網(wǎng)站制作趨向于成熟。此外，結(jié)合其他網(wǎng)站開(kāi)發(fā)工具，Web前端開(kāi)發(fā)技術(shù)有利于完善網(wǎng)站制作。目前，Web前端開(kāi)發(fā)工具主要有CSS3和HTML5，隨著Web前端開(kāi)發(fā)技術(shù)的不斷壯大及完善，CSS3和HTML5開(kāi)發(fā)技術(shù)也會(huì)得到相應(yīng)的完備。Web前端開(kāi)發(fā)技術(shù)作為網(wǎng)站開(kāi)發(fā)的中堅(jiān)力量，勢(shì)必會(huì)作為主要實(shí)現(xiàn)技術(shù)應(yīng)用到未來(lái)網(wǎng)站制作中。因此，人才需求與技術(shù)需求也在Web前端開(kāi)發(fā)中占據(jù)越來(lái)越重要的地位。要注重當(dāng)下的Web前端開(kāi)發(fā)技術(shù)在網(wǎng)站制作上實(shí)現(xiàn)主要功能，以及使用者對(duì)于此項(xiàng)技術(shù)的要求。在將來(lái)的技術(shù)變革中，Web前端開(kāi)發(fā)技術(shù)將會(huì)面臨更多挑戰(zhàn)，因此要不斷完善技術(shù)支撐，滿足目標(biāo)客戶的需求。Web有怎么樣的發(fā)展前景，依賴于高端專業(yè)人才的培養(yǎng)以及Web技術(shù)的進(jìn)一步開(kāi)發(fā)[2]。

2 Web前端開(kāi)發(fā)技術(shù)如何進(jìn)行優(yōu)化的策略參考

網(wǎng)絡(luò)技術(shù)的廣泛應(yīng)用，極大地豐富了人們的生活，并為人們的生活提供了便利和機(jī)遇。隨著科技的日益革新，人們?cè)谟?jì)算機(jī)網(wǎng)絡(luò)方面的需求也在時(shí)刻更新著。為了滿足不同人的需求，以及滿足同一個(gè)人不同階段的需求，就要使Web前端開(kāi)發(fā)技術(shù)的優(yōu)化保持與時(shí)俱進(jìn)的態(tài)勢(shì)。用戶的體驗(yàn)感受應(yīng)該作為Web前端開(kāi)發(fā)技術(shù)首要應(yīng)該考慮的因素，而在優(yōu)化時(shí)，要特別注重用戶的體驗(yàn)感，以提供給使用者更優(yōu)質(zhì)的服務(wù)作為實(shí)現(xiàn)目標(biāo)，專注技術(shù)的升級(jí)換代與革新，最后實(shí)現(xiàn)技術(shù)水平的逐步提高。

2.1 對(duì)網(wǎng)頁(yè)請(qǐng)求進(jìn)行優(yōu)化

Web技術(shù)通俗解釋，就是將用戶的請(qǐng)求以最終的網(wǎng)頁(yè)效果形式呈現(xiàn)在用戶的顯示器上。為提升用戶使用的滿意度，豐富用戶使用體驗(yàn)與感受，要對(duì)網(wǎng)頁(yè)瀏覽速度進(jìn)行實(shí)時(shí)的優(yōu)化更新，并將信息獲取時(shí)間控制在最短范圍內(nèi)，以此來(lái)滿足用戶對(duì)網(wǎng)頁(yè)瀏覽速度的需求。因此，為了更優(yōu)質(zhì)地將Web前端開(kāi)發(fā)技術(shù)運(yùn)用在網(wǎng)頁(yè)制作中，需要不斷優(yōu)化HTTP請(qǐng)求模式，并篩選請(qǐng)求的內(nèi)容，便于在Web前端開(kāi)發(fā)技術(shù)運(yùn)用中，提升網(wǎng)頁(yè)響應(yīng)速度。同時(shí)，基于HTTP請(qǐng)求的內(nèi)容趨于廣泛的特點(diǎn)，服務(wù)器承接文件、瀏覽器建立鏈接以及傳輸數(shù)據(jù)等各個(gè)方面，提升對(duì)程序處置時(shí)間的控制很有必要，同時(shí)也能為目標(biāo)用戶帶來(lái)優(yōu)質(zhì)的感受。

2.2 對(duì)網(wǎng)頁(yè)內(nèi)容進(jìn)行優(yōu)化

在基于Web前端開(kāi)發(fā)技術(shù)中，對(duì)網(wǎng)頁(yè)內(nèi)容的優(yōu)化占據(jù)著重要的位置。在實(shí)際的優(yōu)化操作過(guò)程中，因?yàn)閮?nèi)容優(yōu)化的獨(dú)特性，就要充分考慮Web技術(shù)所有方面的情況。通常，瀏覽器完成各種信息和數(shù)據(jù)的加載后，針對(duì)網(wǎng)頁(yè)的內(nèi)容，CSS會(huì)進(jìn)行一些藝術(shù)加工，以此來(lái)為用戶提供更加豐富的體驗(yàn)。另外，因?yàn)橛脩粼跒g覽頁(yè)面時(shí)，會(huì)有下載的相關(guān)需求，因此對(duì)于Web前端開(kāi)發(fā)技術(shù)的優(yōu)化，需要優(yōu)化CSS加載以及script，同時(shí)確保腳本對(duì)頁(yè)面產(chǎn)生積極影響，保證頁(yè)面下載效果，避免出現(xiàn)頁(yè)面緩沖時(shí)間過(guò)長(zhǎng)、加載失敗的情形出現(xiàn)?？傊?，網(wǎng)頁(yè)內(nèi)容的優(yōu)化設(shè)計(jì)是需要詳細(xì)考慮所有細(xì)節(jié)的。

2.3 對(duì)文件規(guī)模類型進(jìn)行優(yōu)化

優(yōu)化文件類型可以說(shuō)是網(wǎng)頁(yè)優(yōu)化的關(guān)鍵內(nèi)容，當(dāng)用戶在訪問(wèn)網(wǎng)頁(yè)時(shí)，上傳到網(wǎng)頁(yè)的文件和下載的文件在格式上存在差異。因此，在下載文件的環(huán)節(jié)里，錯(cuò)誤和亂碼是非常容易出現(xiàn)的故障。為了更好地應(yīng)對(duì)這一現(xiàn)象，就需要規(guī)定文件類型，同時(shí)優(yōu)化網(wǎng)頁(yè)代碼，用來(lái)保證優(yōu)化Web技術(shù)可以順暢有效。與其他任務(wù)相比，這項(xiàng)工作更要緊也更加復(fù)雜。在對(duì)文件的類型進(jìn)行優(yōu)化處理時(shí)，首先要對(duì)JavaScript或CSS文件進(jìn)行優(yōu)化，之后再對(duì)其他代碼進(jìn)一步優(yōu)化。除此之外，程序員還可以適當(dāng)?shù)卣{(diào)整代碼，例如，通過(guò)改變文件存儲(chǔ)空間的大小來(lái)實(shí)現(xiàn)優(yōu)化網(wǎng)頁(yè)代碼的目的[3]。

2.4 對(duì)DNS查詢次數(shù)進(jìn)行優(yōu)化

用戶使用網(wǎng)頁(yè)搜索時(shí)，DNS首先要對(duì)搜索內(nèi)容進(jìn)行解析。因此，DNS是讓時(shí)間成本提升的另外一個(gè)因素。優(yōu)化Web技術(shù)代表著一定會(huì)優(yōu)化DNS，即優(yōu)化DNS的查詢次數(shù)。通常情況下，DNS解析一次需要使用20-120ms。但是，若瀏覽器反復(fù)出現(xiàn)DNS解析情況，相當(dāng)于解析請(qǐng)求過(guò)于頻繁，這樣勢(shì)必會(huì)增加計(jì)算機(jī)系統(tǒng)的壓力，降低解析效率，致使信息傳輸速度降低，就會(huì)出現(xiàn)網(wǎng)頁(yè)加載慢、運(yùn)行不流暢等情況。另外，在瀏覽器中，DNS作為基本內(nèi)容，如果請(qǐng)求沒(méi)有完成，當(dāng)前域名中的內(nèi)容不會(huì)被下載所限制，重視優(yōu)化DNS的查詢次數(shù)，是提高Web前端開(kāi)發(fā)技術(shù)整體水平的重要手段。

2.5 對(duì)cookie信息進(jìn)行優(yōu)化

cookie信息是產(chǎn)生于硬盤上的，若要求與域名相關(guān)就需要HTTP的請(qǐng)求。就像網(wǎng)速的快與慢一樣。使用者瀏覽的信息越多，網(wǎng)速就會(huì)越慢。cookie信息同樣如此，如果cookie信息內(nèi)容明顯增加，卡頓時(shí)間就會(huì)延長(zhǎng)，請(qǐng)求也會(huì)逐步增大。因此，（1）要清除或禁用多余的cookie。（2）要將cookie信息體量降到最小，以此來(lái)提升網(wǎng)頁(yè)的運(yùn)行速度。（3）要為cookie設(shè)置一個(gè)過(guò)期時(shí)間，這樣關(guān)閉瀏覽器時(shí)cookie會(huì)把信息儲(chǔ)存在硬盤上。（4）訪問(wèn)中，大多數(shù)情況下cookie是用不到的，所以可以運(yùn)用不同的方式，減少對(duì)它的使用，以此來(lái)提升速度。

3 結(jié)語(yǔ)

現(xiàn)今的網(wǎng)絡(luò)環(huán)境下，網(wǎng)絡(luò)制作前提下的Web前端開(kāi)發(fā)技術(shù)還有許多不足，這些不足和缺陷是多方面的。并且每個(gè)方面的問(wèn)題都不一樣，因此要多方面都做到相應(yīng)優(yōu)化。目前，我們知道，網(wǎng)絡(luò)制作的水平有了很大程度的提升，但是我們不應(yīng)該滿足于最終效果的呈現(xiàn)。想達(dá)到滿足現(xiàn)代社會(huì)的需求，就必須把握好Web前端開(kāi)發(fā)所體現(xiàn)出來(lái)的需要。當(dāng)然，這不是一蹴而就的，這個(gè)過(guò)程中，需要有相關(guān)技術(shù)人員的技能支持，需要國(guó)家的高度重視，才能使這項(xiàng)技術(shù)的革新和進(jìn)一步完美優(yōu)化推動(dòng)社會(huì)的發(fā)展。

參考文獻(xiàn)

[1] 曹艷琴.基于網(wǎng)站制作的web前端開(kāi)發(fā)技術(shù)與優(yōu)化策略[J].電腦知識(shí)與技術(shù)，2020（23）：59-60+67.

[2] 莊新妍.基于網(wǎng)站制作的web前端開(kāi)發(fā)技術(shù)與優(yōu)化[J].信息技術(shù)與信息化，2020（7）：17-19.

[3] 許躍穎.網(wǎng)站制作web前端開(kāi)發(fā)技術(shù)與優(yōu)化措施[J].電子技術(shù)與軟件工程，2020（7）：31-32.