資源描述:
《web新興前端框架與模式研究》由會員上傳分享,免費在線閱讀,更多相關內容在應用文檔-天天文庫。
1、Web新興前端框架與模式研究-電子商務論文Web新興前端框架與模式研究文/占東明洪家偉陳希楊徐禮飛辛鄢放摘要:隨著互聯網的進步,傳統(tǒng)的Web技術已經不能滿足于人們對交互體驗的更高要求,使用ReactJS,bootstrap,AngularJS,H5等新興技術成為未來前端開發(fā)的必然選擇;展示了近幾年興起的新興技術和工程化思想,分析其優(yōu)缺點;指出應用和應對這些技術是未來幾年前端發(fā)展的重要課題。關鍵詞:前端發(fā)展;前端模塊化;AngularJs;HTML5;Webpack;Backbonejs;Reactjs
2、引言近年來隨著前端領域的大跨步發(fā)展,前端領域的技術方向呈現出了百花齊放的盛況。許多前端學習者在面對如此多元化的技術方向時,不免感到疑惑和茫然。本文旨在探討近年來前端領域里一些框架和模式的應用方向及其特點。綜合考慮了客觀規(guī)律和主觀判斷的因素,以此為前端人員在技術決策提供科學、合理的分析。1、前端基石與催化劑1.1瀏覽器的躍進現在H5已經成為了一個符號,基本上所有具有絢麗界面或者交互的Web界面,無論是PC還是Mobile端,都被稱為基于H5。H5技術的發(fā)展以及帶來的一系列前端的變革,都離不開現代瀏覽器的
3、發(fā)展與以IE為典型代表的老的瀏覽器的消逝。1.2瀏覽器端的魔術:AJAXAJAX即“AsynchronousJavaScriptandXML”(異步的JavaScript與XML技術),指的是一套綜合了多項技術的瀏覽器端網頁開發(fā)技術,可以基于JavaScript的XmlHttpRequest的用于創(chuàng)建交互性更強的Web應用。AJAX是一種已有技術的mashup,多種技術組合在一起形成了其特色和優(yōu)勢,早在1998年就已經開始有人使用。Google在地圖和Gmail等產品中對這項技術的深入應用,以及AJA
4、X這個吸引眼球的名字的提出,使其正式站在了聚光燈下,開始吸引無數人的目光。我們知道Web應用中用戶提交表單時就向Web服務器發(fā)送一個請求,服務器接收并處理傳來的表單,并返回一個新的網頁。而前后兩個頁面中的往往大部分HTML代碼是一樣的,每次都返回整個頁面內容是一種帶寬資源的浪費。而AJAX應用僅向服務器發(fā)送并取回必須的數據,并在客戶端采用JavaScript處理來自服務器響應,更新頁面的局部信息。這樣不僅瀏覽器和服務器的數據交換大大減少,而且客戶端也可以更加快速地響應用戶操作。如果你用Gmail就應該
5、知道,Gmail從來都不刷新頁面,所有的請求都是通過AJAX獲取數據進行局部更新。AJAX的出現,以及諸如EXTJS、DOJO等一些前端開發(fā)框架的出現,也使得單頁應用(SinglePageApplication)在這個時候流行起來。1.3ECMAScript2015年是JavaScript誕生的20周年。同時又是ES6標準落地的一年。ES6是迄今為止ECMAScript標準最大的變革(如果不算上胎死腹中的ES4的話),帶來了一系列令開發(fā)者興奮的新特性。從目前es的進化速度來看,es后面應該會變成一個個
6、的feature發(fā)布而不是像以前那樣大版本號的方式,所以現在官方也在推薦ES+年份這種叫法而不是ES+版本。更讓人興奮的是,JavaScript慢慢不再局限于前端開發(fā)中,NodeJs的提出讓人們感受到了利用JavaScript進行全棧開發(fā)的能力,從此大大提高了開發(fā)的效率(至少不用多學習一門語言)。JavaScript在物聯網中的應用也曾經引起一些追捧與風潮,不過今年物聯網社區(qū)更加冷靜地看待著這個問題,但是并不影響各大廠商對于JavaScript的支持,可以參閱《JavaScriptBeyondtheW
7、ebin2015》這篇文章??梢灶A見JavaScript在其他領域將繼續(xù)大放異彩,畢竟ECMAScript6,7已經是如此的優(yōu)秀。2、模塊化和工程化2.1前端MVC:Angular/Backbone這種模式下,前后端的分工非常清晰,前后端的關鍵協(xié)作點是Ajax接口,規(guī)定好交互接口后,前后端工程師就可以根據約定,分頭開工,開發(fā)環(huán)境中通過Mock等方式進行測試,同時在特定時間節(jié)點進行前后端集成測試。但是,隨著業(yè)務功能的愈發(fā)復雜(看看現在的Gmail),這種模式本質上和JSP時代的Web開發(fā)并無本質區(qū)別,只
8、不過是將復雜的業(yè)務邏輯從JSP文件轉移到了JavaScript文件中而已?,F在,對于一個前端功能、交互復雜的SPA,JavaScript代碼很容易膨脹(超過10萬行)。很自然地,像服務端從JSP向MVC框架轉換的過程一樣,前端開發(fā)也出現了大量的MVC框架,比較典型的包括BackboneJS,AngularJS,EmberJS,KnockoutJS。總的來說,MV*框架的提出是為了解決前端開發(fā)的復雜度,提供一套規(guī)則組織代碼、分層(MVC),通過合理的組織和