廖詩雨

摘要：新時期伴隨互聯(lián)網(wǎng)技術飛速發(fā)展，以Web為基礎的應用程序也得到新的發(fā)展，一系列智能手機、平板電腦終端設備豐富了人們的工作和生活。多種App的應用成為現(xiàn)代化社會主流。App程序開發(fā)在各行各業(yè)供不應求。在此背景下，HTML5的推出極大促進了App開發(fā)的發(fā)展。以下對HTML5簡單介紹，主要對基于HTML5的Web前端App開發(fā)作闡述，以此為以Web為支持的應用程序持續(xù)革新和發(fā)展提供參考建議。

關鍵詞：HTML5;Web;應用程序;互聯(lián)網(wǎng);程序開發(fā)

中圖分類號：TP311? ? ? 文獻標識碼：A

文章編號：1009-3044（2021）20-0067-02

進入21世紀，新的網(wǎng)絡技術進一步發(fā)展創(chuàng)新，人們在享受互聯(lián)網(wǎng)帶來的莫大便捷的同時，對網(wǎng)頁專業(yè)化開發(fā)也提出更多要求[1]。這在一定程度上促進了前端網(wǎng)頁開發(fā)技術進一步創(chuàng)新，以HTML5為支持的Web技術在多種信息終端設備中得到廣泛應用，時下更是和智能移動設備結合，借助HTML5技術的優(yōu)勢，更好促進Web前端開發(fā)技術在各個平臺中深度應用，也更好地研發(fā)及控制后期維護的成本投入，確保在線流量終端系統(tǒng)向智能化、系統(tǒng)化方向不斷發(fā)展。

1 關于HTML5技術

HTML5為環(huán)球信息網(wǎng)的核心解析語言，大眾上網(wǎng)過程中，會頻繁使用網(wǎng)頁訪問多種內(nèi)容，而Web就是由HTML技術創(chuàng)建支持的。HTML5是對原本HTML修改的技術，共修改了5次，稱為HTML5[2]。HTML5不僅包含傳統(tǒng)HTML技術，也結合更多專業(yè)的編輯腳本語言，實現(xiàn)功能及性能綜合優(yōu)化 [3]。此外，HTML5還具有多元化的功能，其可以為使用者提供優(yōu)質(zhì)運用體驗，使用戶訪問Web，無須安置相關插件，實現(xiàn)在網(wǎng)頁中實時觀看視頻、聽音樂等。同時，HTML5還具有穩(wěn)定的兼容特點，用戶操作愛奇藝、優(yōu)酷、QQ影音等Web程序時，可將外接設備和應用程序結合[4]。HTML5也支持多種應用終端實時切換，在切換過程中，不需要返回主界面操作，在各個App中實現(xiàn)自由轉換，提高用戶上網(wǎng)體驗。Web前端App開發(fā)過程中，要求設計編程人員可靈活應用HTML5，解析語法，便于整合多種設備設施使用標準要求，并以該技術支持，為編程研發(fā)人員提供多元的開源庫，提高App開發(fā)的效率、質(zhì)量。

2 Web前端App的開發(fā)現(xiàn)狀及發(fā)展

互聯(lián)網(wǎng)的發(fā)展為我們生活帶來莫大便利，但目前網(wǎng)絡企業(yè)無法實現(xiàn)對各項網(wǎng)絡設備的公平、全面成本投入、技術開發(fā)[5]。在Web平臺支持下，網(wǎng)絡用戶的各項上網(wǎng)需求基本都可滿足，且客戶端應用產(chǎn)品可為用戶提供更加個性化的App。但網(wǎng)絡企業(yè)受技術及設備資源分配不均影響，無法為用戶提供高度匹配的設備，無法滿足用戶多樣化需求，移動互聯(lián)網(wǎng)行業(yè)需探索如何開發(fā)更有效的移動應用平臺。

因移動操作系統(tǒng)都具備Web，故移動互聯(lián)網(wǎng)也將重心放在發(fā)展Web信息技術系統(tǒng)方面，以先進技術優(yōu)化網(wǎng)絡程序，提高用戶上網(wǎng)體驗[6]。例如，以iOS、Android系統(tǒng)支持的瀏覽器，其均需要Web平臺支持，故網(wǎng)絡企業(yè)雖對及開發(fā)成本有限制，但必須發(fā)揮Web應用對獲取信息的意義，讓此類信息技術應用程序可運用到不同移動操作系統(tǒng)，實現(xiàn)高效的技術發(fā)展。

3 HTML5技術性能優(yōu)化

3.1 腳本方面

將CSS合理應用在頭部，Java腳本則在尾部應用，可避免腳本處理對頁面加載造成影響，提高頁面加載效率。此外，為規(guī)避圖像中出現(xiàn)空SRC，可將已有頁面再次裝入，改變頁面加載整體速率[7]。

Web中對圖像高頻次的重置，必然會影響其自身運行性能?？杀M量避免重置圖片大小，避免圖像處理中應用DataURL技術。若DataURL圖像規(guī)避圖像壓縮算法，則需在文件渲染前就進行解碼，這樣一來，加載速率并不理想，需要耗費大量時間[8]。

3.2 載入方面

控制載入速率是提高HTML5技術性能之關鍵。可以對HTTP的請求頻次控制，適當控制緩存對服務器的要求，也將挖掘的資源緩存使用周期優(yōu)化，從而更好管控資源，提高Web顯示效率，也加強多語言腳本壓縮。結合運用首頁載入和適當快速畫面，提高用戶對畫面速率認知。在此基礎上，考慮到其對渲染運行的影響，若網(wǎng)絡用戶有需求，可將首次使用資源和時下未使用的資源充分結合，提高核心資源高度，對操作流程簡化。

例如，對游戲Web的加載，可采取添加載入支持，裝入資源及時顯示在頁面中。還可在頁面下方轉入下一頁面資源，提高頁面銜接效率，提高增進速度。其中，cookies會對Web的加載速度造成不利影響，對HTML5技術的優(yōu)化需要強化的cookies的控制。靜態(tài)資源域名不能使用cookies，否則影響Web加載速度，需要在服務器中規(guī)范設置，實施第三方資源異步載入，控制第三方資源對屏幕顯示的影響[9-10]。

3.3 CSS的優(yōu)化

寫入在HTML中的Style會耗費網(wǎng)頁加載大量時間，若涉及CSS表達，可從CSS渲染內(nèi)跳出，規(guī)避CSS表達式應用?？盏腃SS會導致CSS文件占據(jù)大量內(nèi)存，也影響CSS的渲染。因此，需將空CSS移除，科學使用display屬性，display屬性會影響頁面常規(guī)顯示，故需要加以優(yōu)化。

4 基于HTML5的Web前端App開發(fā)分析

4.1 Web前端Form表單分析

一般的HTML內(nèi)部Form表單需要將到表單元素放在Form的頭部、尾部位置才可滿足要求。而伴隨HTML不斷修改，HTML5的出現(xiàn)使Form表單可轉為聲明類型表單，解決原本Form的表單元素必須放置在指定區(qū)域的限制，打破原本技術局限性，開發(fā)人員關聯(lián)好表單id及放置區(qū)域，即可滿足使用要求，表單元素可以放置在網(wǎng)頁各個區(qū)域內(nèi)。此外，HTML5技術支持下，開發(fā)人員在Form表單對多種表單數(shù)字及管控類型調(diào)配，可優(yōu)化Java代碼編寫周期，使Form表單的創(chuàng)造速度及質(zhì)量得到新的提升。