基于大數(shù)據(jù)背景下移動平臺的微應(yīng)用開發(fā)框架技術(shù)的研究

■段錦（楊凌職業(yè)技術(shù)學(xué)院 信息工程分院）

互聯(lián)網(wǎng)技術(shù)、智能移動終端技術(shù)的發(fā)展，移動微應(yīng)用也成為了移動應(yīng)用中的重要組成部分。為了能夠滿足移動微應(yīng)用的發(fā)展需要，企業(yè)要通過微應(yīng)用的框架開發(fā)技術(shù)進行深入研究。

一、研究內(nèi)容綜述

（一）研究情況

伴隨著移動技術(shù)的迅速發(fā)展，各國互聯(lián)網(wǎng)企業(yè)開始思考要如何才能夠有效地控制移動應(yīng)用的成本投入，構(gòu)建出一個完整、健全的生態(tài)鏈，在版本更新?lián)Q代下的背景下，深入發(fā)掘用戶的需要，提高用戶的使用體驗。按照當前國內(nèi)的情況來看，在2018 年初我國的移動應(yīng)用開發(fā)框架以及開發(fā)工具開始迅速發(fā)展，出現(xiàn)了大量功能全面的開發(fā)框架以及開發(fā)工具，為了適應(yīng)市場的發(fā)展需求，各大廠商把成本控制和滿足客戶需求作為企業(yè)生與發(fā)展的戰(zhàn)略目標，應(yīng)用開發(fā)框架化受到了社會各界的關(guān)注。

（二）主流框架

（1）Bootstrap 移動應(yīng)用開發(fā)框架。Bootstrap 是由html、css、java 為主體的框架，它是以jquery 的基礎(chǔ)上進行優(yōu)化和調(diào)整后所形成的前端開源框架。優(yōu)點是兼容性好，缺點是對于移動應(yīng)用動態(tài)加載的效果差。

（2）Amaze UI 移動應(yīng)用開發(fā)框架。該框架是以CSS3 技術(shù)為核心，利用js、web 組件為輔框架設(shè)計結(jié)構(gòu)，該框架的優(yōu)點是自由度高，支持用戶自定義字體與內(nèi)容，缺點是缺少動態(tài)加載技術(shù)。

（3）JQuerymobile 移動應(yīng)用開發(fā)框架

該框架是以jQuery 與用戶界面結(jié)合的基礎(chǔ)上開發(fā)出的框架，該框架具有自定義主題、支持高端設(shè)備使用的優(yōu)點，但該框架在顯示及分辨率方面存在適配問題，且不支持動態(tài)加載技術(shù)。

二、存在的問題

為了能夠滿足當前移動應(yīng)用市場發(fā)展的需求，除了要節(jié)省移動端資源之外，還要采取一些科學(xué)、有效的方式來解決不同移動終端屏幕大小無法自適應(yīng)的問題。按照實際情況來看，雖然bootstrap以及jQueryMobile 等主流框架有著獨特的優(yōu)點，但是在實踐中這兩種框架只能解決某個移動應(yīng)用的場景，具有明顯的局限性。

（一） web 框架動態(tài)加載技術(shù)

由于移動網(wǎng)絡(luò)環(huán)境下的終端內(nèi)存、流量以及電池容量有限，因此要運用動態(tài)加載的方式把程序文化碎片化，再按照用戶需要進行延遲加載來提高用戶的使用體驗。在樣式設(shè)計方面程序開發(fā)人員只要在代碼塊的頭部引入所需的插件，或者加入相應(yīng)的樣式代碼就可以了。除此之外，開發(fā)人員雖然可利用后端接口就能夠進行數(shù)據(jù)讀取和顯示，但是不同服務(wù)器需要設(shè)置不同的要求，導(dǎo)致動態(tài)加載成為一個亟待解決難題。

（二）模塊化構(gòu)建技術(shù)

移動應(yīng)用的開發(fā)過程中，前端人員可以利用模塊化的方式把顯示頁面分為不同的功能模塊，不但可以提高移動端頁面顯示速度，定位調(diào)試過程中存在的問題，而且還可以避免不同模塊間出現(xiàn)相互沖突的情況，這對于提升前端人員的編碼率具有重要的影響。但由于不同模塊的調(diào)用以及區(qū)分難度大，在模塊構(gòu)建中就要對模塊的功能和信息內(nèi)容進行嚴格的規(guī)定；除此之外，前端人員在模塊設(shè)計時要對模塊的類型如何定義也成了開發(fā)中的難點。

（三）多分辨率、多尺寸移動終端界面適配技術(shù)

處于移動端的終端設(shè)備在bootstrap 框架的基礎(chǔ)上，利用視窗屬性以及窗口比例設(shè)置的方式，解決了不同手機型號分辨率不同、顯示尺寸不同的問題，降低了代碼冗余。但目前的手機型號與顯示屏規(guī)格過多，在進行前端設(shè)計時無法滿足所有手機的顯示需求，這就是該框架需要解決的問題。

三、框架設(shè)計優(yōu)化策略

（一） Web 框架動態(tài)加載技術(shù)

所謂的動態(tài)加載技術(shù)就是按照顧相互間的關(guān)系把執(zhí)行文檔通過遞歸的方式構(gòu)建腳本的一系列過程，它是運用模塊代碼的方式構(gòu)建腳本以達到動態(tài)加載的效果。利用函數(shù)分段回調(diào)和執(zhí)行遞歸腳本按照由上而下的順序有序地加載腳本文件，再運用動態(tài)加載的文件把調(diào)函數(shù)截取，運用邏輯判斷的方式來達到分段加載的效果。通過這種方式不但有效地控制了網(wǎng)絡(luò)請求的次數(shù)，而且還可以提高用戶的使用體驗。

（二）Web 框架動態(tài)加載技術(shù)，模塊化構(gòu)建技術(shù)

想實現(xiàn)模塊化的目標，就需要做好事先的配置工作，利用適時加載以及主模塊、子模塊的調(diào)用后再通過模塊調(diào)用的技術(shù)。業(yè)務(wù)邏輯模塊在開發(fā)過程中，前端開發(fā)人員要先定義出不同功能的模式以滿足調(diào)用時的需要，并且還要確保每個功能模塊不能夠產(chǎn)生沖突。在模塊化構(gòu)建中的每一個插件都要置于模型的底層，在進行別名配置的時候只需要把對應(yīng)內(nèi)容進行補充。至于其他頁面在引用的過程中盡量采用直接獲取的方式，但是要保障定義別名要具有唯一性。

（三）多分辨率、多尺寸移動終端界面適配技術(shù)

通過對多分辨率以及多尺寸移動終端界面適配技術(shù)的研究，能夠把處于移動端的瀏覽器進行智能調(diào)整，運用等比顯示的方法自適應(yīng)手機屏幕的大小，進行顯示內(nèi)容的等比加載。在進行框架開發(fā)的所有代碼里只要把視窗的界面大小、長、寬等必要屬性設(shè)置完整后，就能夠適用于當前市面上的所有型號的移動終端，并且代碼可以被反復(fù)利用。在框架設(shè)計的過程中通常是采用通用的形式，來適應(yīng)不同的系統(tǒng)功能；把配置文件中的加載順序進行重新設(shè)置以此來提高控制的質(zhì)量和效果。除此之外，在窗口彈出、界面數(shù)據(jù)加載以及等待顯示等效果上也要運用統(tǒng)一展示的方式來進行設(shè)計，以此來提升廣大用戶的體驗滿意度。

Sea.js 是一種簡單、自然的代碼組織形式，而且Sea.js 還具備了以下特點：（1）擁有整潔、簡單的模塊定義標準：Sea.js 是嚴格按照CMD 進行規(guī)范化執(zhí)行，也可以運用Node.js 的方式來進行代碼書寫；（2）自然、直觀的代碼組織結(jié)構(gòu)：利用高效的自動加載能力以及簡單的配置可以讓程序員的編碼體驗變得更好；（3）Sea.js 中還包含著各種功能的插件，對于程序開發(fā)、調(diào)試或者內(nèi)部優(yōu)化方面都有著不俗的表面，同時也擁有多元化的擴展插槽支持基本的外設(shè)功能。

（四）移動端公用組件封裝

把擴展原生庫和自定義對象相結(jié)合，為前端的開發(fā)人員快速調(diào)用提供支持。對各種插件的研究（例如時間插件、彈窗插件、多元化圖形插件、漸變插件以及省市區(qū)選擇插件），再對這些功能性插件設(shè)置相應(yīng)的使用規(guī)范，并運用接口封裝、調(diào)用的方式來保障在不同的使用環(huán)境里可以直接、迅速地把需要的插件進行即時動態(tài)調(diào)用。

四、結(jié)語

綜上所述，想要提高移動平臺中的微應(yīng)用開發(fā)框架技術(shù)水平，除了要深入研究當前主流的移動微應(yīng)用框架之外，還要通過Web 框架動態(tài)加載技術(shù)，模塊化構(gòu)建技術(shù)以及移動端公用組件封裝等方式，這樣才能在減少研發(fā)成本的同時提高移動應(yīng)用的功能性和擴展性。