Web前端工程組件化的分析與改進(jìn)
本文關(guān)鍵詞:Web前端工程組件化的分析與改進(jìn),,由筆耕文化傳播整理發(fā)布。
【摘要】:前端作為web工程的一部分雖然很早就已經(jīng)存在,但局限于瀏覽器的性能以及網(wǎng)絡(luò)帶寬的限制一直沒(méi)有得到很好的重視和發(fā)展。隨著萬(wàn)維網(wǎng)的普及以及網(wǎng)速的不斷增加,網(wǎng)絡(luò)的傳播速度和帶寬早已經(jīng)不是阻礙互聯(lián)網(wǎng)開(kāi)發(fā)的重要因素。2010年對(duì)于整個(gè)web前端界來(lái)說(shuō)是重要的一年。隨著2010年HTML5的流行,再一次帶動(dòng)了瀏覽器的變革,各大瀏覽器開(kāi)發(fā)公司都開(kāi)始支持最新的W3C標(biāo)準(zhǔn),例如Google的chrome,微軟的IE9,蘋果的safari等。前端也早已經(jīng)不再只是簡(jiǎn)單的摳圖工作,轉(zhuǎn)而逐漸變成了與后端同樣復(fù)雜度的工程化工作。在2015年谷歌的I/O大會(huì)上,web組件的技術(shù)已經(jīng)開(kāi)始嶄露頭角,例如已經(jīng)實(shí)現(xiàn)的web GL技術(shù),以及google map和gmail都是基于組件。谷歌已經(jīng)確定組件化是未來(lái)前端開(kāi)發(fā)的趨勢(shì)。Web前端技術(shù)發(fā)展到現(xiàn)在,各種框架和類庫(kù)接連不斷的出現(xiàn),它們都用各自的方式實(shí)現(xiàn)了前端工程的組件化。但是問(wèn)題也隨之而來(lái)。目前前端模塊化和組件化的標(biāo)準(zhǔn)只是停留在初步階段,離正式發(fā)布還有一段距離。因此缺少了官方標(biāo)準(zhǔn)規(guī)范的結(jié)果就是,各大公司的主流框架都用自己的方式實(shí)現(xiàn)組件化。但是每個(gè)框架之間實(shí)現(xiàn)的方式不同,就導(dǎo)致框架之間的組件不能復(fù)用,也就失去了組件的意義。因此如何制定一個(gè)通用的組件化標(biāo)準(zhǔn)并將其應(yīng)用是整個(gè)前端工程發(fā)展的一個(gè)難題。本文從W3C的web component標(biāo)準(zhǔn)入手,分析了當(dāng)前web前端工程在組件化方向的發(fā)展情況,通過(guò)了解不同框架的源碼以及實(shí)現(xiàn)方式和性能,在對(duì)比了國(guó)內(nèi)外的主流框架和文章后,結(jié)合它們的優(yōu)點(diǎn),通過(guò)自己的見(jiàn)解實(shí)現(xiàn)了一種高性能,敏捷開(kāi)發(fā),易維護(hù)的開(kāi)發(fā)方案。這個(gè)方案封裝了web component標(biāo)準(zhǔn),但不是單純的封裝,而是將瀏覽器的兼容性以及虛擬DOM渲染的性能考慮在內(nèi),實(shí)現(xiàn)了一種瀏覽器兼容性更強(qiáng),書(shū)寫方式和代碼結(jié)構(gòu)更加標(biāo)準(zhǔn),數(shù)據(jù)綁定視圖和模型的前端框架。簡(jiǎn)單來(lái)說(shuō)它是一種實(shí)現(xiàn)聲明式組件開(kāi)發(fā)的前端庫(kù),讓開(kāi)發(fā)者能以標(biāo)簽形式使用組件,提升開(kāi)發(fā)效率。該庫(kù)以Web Components為標(biāo)準(zhǔn),解決各類瀏覽器兼容性問(wèn)題,尤其是移動(dòng)端瀏覽器。Custom Elements作為組件開(kāi)發(fā)、使用規(guī)則;部分提供Shadow Dom功能;用HTML Imports引入組件、聲明組件依賴關(guān)系;支持生命周期和數(shù)據(jù)動(dòng)態(tài)更新。同時(shí)提供類似于DOM操作的動(dòng)態(tài)接口,滿足實(shí)際中的復(fù)雜開(kāi)發(fā)情景需求。然后作為示例,通過(guò)該前端庫(kù)我們開(kāi)發(fā)出了一款基于組件的移動(dòng)端web app,該app由幾大組件組成,這些組件相互獨(dú)立,可以方便的遷移到其他項(xiàng)目中去;跀(shù)據(jù)驅(qū)動(dòng)的組件間通信不需要直接操作DOM,開(kāi)發(fā)者只需要將注意力放到數(shù)據(jù)上而不需要關(guān)心視圖問(wèn)題,大大減少了發(fā)生bug的幾率。
【關(guān)鍵詞】:Web前端 框架 組件化 模塊化
【學(xué)位授予單位】:吉林大學(xué)
【學(xué)位級(jí)別】:碩士
【學(xué)位授予年份】:2016
【分類號(hào)】:TP393.092;TP311.56
【目錄】:
- 摘要4-6
- Abstract6-10
- 第1章 緒論10-17
- 1.1 研究背景及意義10-11
- 1.2 國(guó)內(nèi)外研究現(xiàn)狀11-15
- 1.2.1 國(guó)外研究現(xiàn)狀11-13
- 1.2.2 國(guó)內(nèi)發(fā)展現(xiàn)狀13-15
- 1.3 本文主要內(nèi)容15
- 1.4 論文結(jié)構(gòu)15-17
- 第2章 web前端概述17-24
- 2.1 前端工程的發(fā)展17-20
- 2.1.1 前端工程初期17-18
- 2.1.2 web2.0 時(shí)期18-19
- 2.1.3 工程化前端時(shí)期19-20
- 2.2 前端主流框架20-23
- 2.2.1 Angular,React,Polymer20-22
- 2.2.2 主流框架組件化過(guò)程22-23
- 2.3 小結(jié)23-24
- 第3章 組件化標(biāo)準(zhǔn)詳細(xì)介紹24-33
- 3.1 web component標(biāo)準(zhǔn)24
- 3.2 Shadow DOM24-26
- 3.3 HTML imports26-29
- 3.3.1 依賴引入27-28
- 3.3.2 鏈接類型引入28-29
- 3.3.3 擴(kuò)展HTMLLinkElement接口29
- 3.3.4 載入引入29
- 3.4 Custom Elements29-33
- 3.4.1 自定義元素的生命周期30-31
- 3.4.2 創(chuàng)建和注冊(cè)管理機(jī)構(gòu)傳遞31
- 3.4.3 注冊(cè)自定義元素31-33
- 第4章 組件化分析及改進(jìn)33-42
- 4.1 組件化語(yǔ)義的優(yōu)缺點(diǎn)33
- 4.2 組件化依賴瀏覽器程度33-36
- 4.3 改進(jìn)web component36-42
- 4.3.1 改進(jìn)的組件化框架介紹36-38
- 4.3.2 改進(jìn)的組件化框架工作原理38-40
- 4.3.3 改進(jìn)的組件化框架編譯原理40-42
- 第5章 改進(jìn)組件化實(shí)現(xiàn)的web app42-50
- 5.1 總體設(shè)計(jì)42-44
- 5.2 項(xiàng)目實(shí)現(xiàn)44-48
- 5.2.1 代碼結(jié)構(gòu)44-45
- 5.2.2 項(xiàng)目分析45-47
- 5.2.3 具體實(shí)現(xiàn)47-48
- 5.3 總結(jié)與展望48-50
- 參考文獻(xiàn)50-51
- 致謝51
【相似文獻(xiàn)】
中國(guó)期刊全文數(shù)據(jù)庫(kù) 前10條
1 楊正武;;企業(yè)管理信息系統(tǒng)組件化信息資源分析與設(shè)計(jì)[J];商業(yè)時(shí)代;2009年23期
2 劉秋生,孫衛(wèi)紅;組件技術(shù)在軍事地理信息系統(tǒng)中的應(yīng)用[J];無(wú)線電通信技術(shù);2001年01期
3 馬天蔚;;以組件應(yīng)萬(wàn)需[J];每周電腦報(bào);2001年68期
4 張春城;薛恒新;楊建華;;企業(yè)信息化中的企業(yè)業(yè)務(wù)組件建模分析[J];中外科技信息;2003年10期
5 侯成義,司書(shū)賓,孫樹(shù)棟;基于組件的組件庫(kù)管理系統(tǒng)[J];計(jì)算機(jī)工程與應(yīng)用;2003年30期
6 段繼華,劉衛(wèi);組件化技術(shù)在程序設(shè)計(jì)中的應(yīng)用[J];無(wú)線電通信技術(shù);2003年01期
7 史磊;沈?yàn)槿?宋子善;;基于組件的空戰(zhàn)戰(zhàn)效評(píng)估仿真平臺(tái)研究[J];計(jì)算機(jī)工程;2006年05期
8 孫祥鵬;杜滟;;水利基建財(cái)務(wù)管理信息系統(tǒng)的組件化技術(shù)特點(diǎn)[J];人民珠江;2006年04期
9 楊正武;;動(dòng)態(tài)組件的依賴關(guān)系分析與研究[J];軟件導(dǎo)刊;2009年05期
10 楊正武;;行業(yè)組件框架下的企業(yè)管理信息系統(tǒng)創(chuàng)新思路[J];商業(yè)時(shí)代;2010年13期
中國(guó)重要會(huì)議論文全文數(shù)據(jù)庫(kù) 前7條
1 李興瑋;潘曉;曾迎生;;組件技術(shù)在制導(dǎo)武器系統(tǒng)仿真建模中的應(yīng)用研究[A];2007系統(tǒng)仿真技術(shù)及其應(yīng)用學(xué)術(shù)會(huì)議論文集[C];2007年
2 王浩;高蓓;惲江峰;嚴(yán)洪森;;基于組件的供應(yīng)管理系統(tǒng)的研究[A];面向21世紀(jì)的生產(chǎn)工程——2001年“面向21世紀(jì)的生產(chǎn)工程”學(xué)術(shù)會(huì)議暨企業(yè)生產(chǎn)工程與產(chǎn)品創(chuàng)新專題研討會(huì)論文集[C];2001年
3 李漢;李忠俊;;淺談基于組件的業(yè)務(wù)建模[A];2008'中國(guó)信息技術(shù)與應(yīng)用學(xué)術(shù)論壇論文集(二)[C];2008年
4 吳明;黃東;;.NET下ERP系統(tǒng)的組件化開(kāi)發(fā)[A];全國(guó)自動(dòng)化新技術(shù)學(xué)術(shù)交流會(huì)會(huì)議論文集(一)[C];2005年
5 謝方;岳增坤;;仿真通用計(jì)算引擎與組件動(dòng)態(tài)加載技術(shù)研究[A];中國(guó)造船工程學(xué)會(huì)電子技術(shù)學(xué)術(shù)委員會(huì)——2012年水下復(fù)雜戰(zhàn)場(chǎng)環(huán)境目標(biāo)識(shí)別與對(duì)抗及仿真技術(shù)學(xué)術(shù)交流論文集[C];2012年
6 曹衛(wèi)星;朱艷;戴廷波;潘潔;胡繼超;莊恒揚(yáng);;基于過(guò)程的組件化小麥生長(zhǎng)模擬系統(tǒng)[A];’2003中國(guó)作物學(xué)會(huì)學(xué)術(shù)年會(huì)文集[C];2003年
7 陳亮;崔仁濤;謝小敏;;基于軟總線的組件通信技術(shù)在用電現(xiàn)場(chǎng)管理系統(tǒng)中的應(yīng)用[A];2007中國(guó)電機(jī)工程學(xué)會(huì)電力系統(tǒng)自動(dòng)化專委會(huì)供用電管理自動(dòng)化學(xué)科組(分專委會(huì))二屆三次會(huì)議論文集[C];2007年
中國(guó)重要報(bào)紙全文數(shù)據(jù)庫(kù) 前10條
1 Tamim Saleh;組件化:銀行重構(gòu)新思維[N];金融時(shí)報(bào);2006年
2 林燕峰;簡(jiǎn)單是美 和諧是金[N];計(jì)算機(jī)世界;2000年
3 本報(bào)記者 龔杰;組件技術(shù)“加速”軟件應(yīng)用[N];計(jì)算機(jī)世界;2002年
4 ;金思維:組件化突破行業(yè)屏障[N];中國(guó)計(jì)算機(jī)報(bào);2003年
5 肖健 作者系上海博科資訊股份有限公司副總裁;中小企業(yè)管理別迷信舶來(lái)品[N];中國(guó)企業(yè)報(bào);2005年
6 何進(jìn)偉;管理軟件:面臨“三化”[N];中國(guó)計(jì)算機(jī)報(bào);2003年
7 本報(bào)記者 徐莉;SOA統(tǒng)領(lǐng)下一個(gè)十年[N];網(wǎng)絡(luò)世界;2004年
8 ;托普發(fā)布軟件組件化開(kāi)發(fā)平臺(tái)[N];人民郵電;2000年
9 鐘耳順;GIS朝組件化發(fā)展[N];中國(guó)計(jì)算機(jī)報(bào);2001年
10 ;國(guó)產(chǎn)組件化軟件平合與TopM++Builder[N];科技日?qǐng)?bào);2000年
中國(guó)博士學(xué)位論文全文數(shù)據(jù)庫(kù) 前5條
1 李松;組件化可重構(gòu)嵌入式數(shù)控系統(tǒng)實(shí)施關(guān)鍵技術(shù)研究[D];華南理工大學(xué);2015年
2 劉剛;并行離散事件仿真可視化組件建模技術(shù)研究[D];國(guó)防科學(xué)技術(shù)大學(xué);2011年
3 戴鴻君;基于異構(gòu)多核體系與組件化軟件的嵌入式系統(tǒng)研究[D];浙江大學(xué);2007年
4 李?yuàn)檴?空間信息分布式協(xié)同高性能計(jì)算框架的初步研究[D];中國(guó)地質(zhì)大學(xué)(北京);2009年
5 涂鈺青;基于IEC61499標(biāo)準(zhǔn)的組件化模型集成數(shù)控系統(tǒng)形式化建模與驗(yàn)證的研究[D];華南理工大學(xué);2011年
中國(guó)碩士學(xué)位論文全文數(shù)據(jù)庫(kù) 前10條
1 郭穎;組件化并行仿真引擎關(guān)鍵技術(shù)研究[D];北京理工大學(xué);2015年
2 牛立棟;基于.NET的SOA組件集成開(kāi)發(fā)框架的研究與實(shí)現(xiàn)[D];西安電子科技大學(xué);2015年
3 林曉佳;基于SOA的中間業(yè)務(wù)平臺(tái)設(shè)計(jì)與實(shí)現(xiàn)[D];華南理工大學(xué);2015年
4 張佳梁;面向定制化廣告的前端組件化框架設(shè)計(jì)與實(shí)現(xiàn)[D];南京大學(xué);2016年
5 戴翔宇;Web前端工程組件化的分析與改進(jìn)[D];吉林大學(xué);2016年
6 張麗;本體在組件描述和檢索中的應(yīng)用研究[D];哈爾濱工程大學(xué);2008年
7 陳沖;基于組件的水文集成建模環(huán)境的設(shè)計(jì)[D];蘭州大學(xué);2012年
8 李明;面向?qū)ο箝_(kāi)發(fā)方法中可重用組件技術(shù)的研究[D];大連海事大學(xué);2003年
9 陳光;基于推理算法無(wú)關(guān)性原則的組件管理系統(tǒng)[D];吉林大學(xué);2004年
10 宋海榮;組件技術(shù)的研究及在商標(biāo)審查系統(tǒng)中的應(yīng)用[D];北京郵電大學(xué);2013年
本文關(guān)鍵詞:Web前端工程組件化的分析與改進(jìn),由筆耕文化傳播整理發(fā)布。
本文編號(hào):322916
本文鏈接:http://sikaile.net/guanlilunwen/ydhl/322916.html