在線學(xué)習(xí)平臺(tái)的前端設(shè)計(jì)優(yōu)化與實(shí)現(xiàn)
發(fā)布時(shí)間:2017-10-13 03:23
本文關(guān)鍵詞:在線學(xué)習(xí)平臺(tái)的前端設(shè)計(jì)優(yōu)化與實(shí)現(xiàn)
更多相關(guān)文章: Web前端 模塊化 組件開(kāi)發(fā) 性能優(yōu)化
【摘要】:隨著互聯(lián)網(wǎng)技術(shù)的發(fā)展,人們?cè)絹?lái)越習(xí)慣通過(guò)網(wǎng)絡(luò)獲取信息,在線學(xué)習(xí)平臺(tái)也因此應(yīng)運(yùn)而生。同時(shí),人們對(duì)于網(wǎng)站的易用性和交互體驗(yàn)的要求也越來(lái)越高,設(shè)計(jì)良好、性能優(yōu)良的網(wǎng)站可以提高用戶體驗(yàn),增加用戶留存率,而設(shè)計(jì)糟糕、性能緩慢的網(wǎng)站則會(huì)使用戶印象不佳,大量流失。因此對(duì)網(wǎng)站應(yīng)用的前端設(shè)計(jì)與優(yōu)化則顯得更加重要。本文論述的在線學(xué)習(xí)平臺(tái)上線于2012年底,隨著業(yè)務(wù)的發(fā)展、功能的增多、用戶量的增加,原有的前端架構(gòu)不堪重負(fù),不能適應(yīng)快速的發(fā)展,產(chǎn)生了大量性能問(wèn)題,影響了用戶體驗(yàn)。因此,本文從框架設(shè)計(jì)和性能優(yōu)化兩個(gè)方面入手,對(duì)原有的前端設(shè)計(jì)進(jìn)行了優(yōu)化。本文的工作主要包括:(1)提出了前端框架優(yōu)化和性能優(yōu)化的方案。在框架方面,主要從模塊化和組件化兩個(gè)角度進(jìn)行。整個(gè)框架采用分層模式,分為基礎(chǔ)功能庫(kù)、基礎(chǔ)組件、應(yīng)用級(jí)組件、模塊、子系統(tǒng)等層次。在前端的模塊內(nèi)部采用MVC模式,模塊之間通過(guò)調(diào)度器進(jìn)行注冊(cè)和消息通信。組件功能分離為展示結(jié)構(gòu)和功能邏輯的組件,用以降低組件之間的耦合和響應(yīng)變化。在性能優(yōu)化方面則結(jié)合了雅虎十四條進(jìn)行歸納和設(shè)計(jì)。(2)在優(yōu)化方案的基礎(chǔ)上,結(jié)合具體業(yè)務(wù)進(jìn)行了實(shí)現(xiàn)。從課程展示功能、消息通知功能、支付購(gòu)買功能、個(gè)人設(shè)置與登錄及學(xué)習(xí)中心等功能的相關(guān)頁(yè)面和組件入手,實(shí)現(xiàn)了前端的設(shè)計(jì)和優(yōu)化方案。本文的前端架構(gòu)在模塊化和組件化方向上的思想和設(shè)計(jì),有利于前端模塊化開(kāi)發(fā)和功能解耦,提高了前端的開(kāi)發(fā)效率和維護(hù)效率;在性能優(yōu)化上的實(shí)踐則為其他應(yīng)用的前端性能優(yōu)化提供了參考。
【關(guān)鍵詞】:Web前端 模塊化 組件開(kāi)發(fā) 性能優(yōu)化
【學(xué)位授予單位】:南京大學(xué)
【學(xué)位級(jí)別】:碩士
【學(xué)位授予年份】:2016
【分類號(hào)】:TP311.52
【目錄】:
- 摘要5-6
- Abstract6-13
- 第一章 引言13-19
- 1.1 選題背景及意義13-14
- 1.2 國(guó)內(nèi)外研究現(xiàn)狀14-17
- 1.3 論文研究?jī)?nèi)容17
- 1.4 論文組織結(jié)構(gòu)17-19
- 第二章 技術(shù)綜述19-30
- 2.1 前端模塊化設(shè)計(jì)思想與規(guī)范19-20
- 2.2 js,HTML與CSS相關(guān)技術(shù)20-26
- 2.2.1 CSS預(yù)編譯20-21
- 2.2.2 模板21-24
- 2.2.3 組件化24-25
- 2.2.4 AJAX-RPC25-26
- 2.3 瀏覽器引擎相關(guān)原理26-29
- 2.3.1 webkit渲染頁(yè)面原理26-28
- 2.3.2 回流與重繪28-29
- 2.4 本章小結(jié)29-30
- 第三章 需求分析與前端設(shè)計(jì)優(yōu)化方案30-57
- 3.1 平臺(tái)前端需求分析30-37
- 3.1.1 功能性需求30-36
- 3.1.2 非功能性需求36-37
- 3.2 前端框架設(shè)計(jì)優(yōu)化37-46
- 3.2.1 前端架構(gòu)層次設(shè)計(jì)37-39
- 3.2.2 前端基礎(chǔ)庫(kù)設(shè)計(jì)39-41
- 3.2.3 前端模塊化設(shè)計(jì)41-45
- 3.2.4 前端組件設(shè)計(jì)45-46
- 3.3 平臺(tái)業(yè)務(wù)功能的前端設(shè)計(jì)46-56
- 3.3.1 課程展示功能47-49
- 3.3.2 消息/通知功能49-51
- 3.3.3 支付/購(gòu)買功能51-53
- 3.3.4 個(gè)人設(shè)置與登錄53-55
- 3.3.5 學(xué)習(xí)中心55-56
- 3.4 本章小結(jié)56-57
- 第四章 在線學(xué)習(xí)平臺(tái)前端框架和性能優(yōu)化的實(shí)現(xiàn)57-77
- 4.1 系統(tǒng)部署57-58
- 4.2 前端框架設(shè)計(jì)的實(shí)現(xiàn)58-65
- 4.2.1 課程展示功能的實(shí)現(xiàn)58-60
- 4.2.2 消息/通知功能60-62
- 4.2.3 支付/購(gòu)買功能62-64
- 4.2.4 個(gè)人設(shè)置與登錄64
- 4.2.5 學(xué)習(xí)中心的實(shí)現(xiàn)64-65
- 4.3 性能優(yōu)化的實(shí)現(xiàn)65-72
- 4.3.1 對(duì)請(qǐng)求數(shù)量的優(yōu)化66-67
- 4.3.2 優(yōu)化請(qǐng)求帶寬67-68
- 4.3.3 緩存利用68-70
- 4.3.4 頁(yè)面結(jié)構(gòu)的優(yōu)化70-71
- 4.3.5 其他優(yōu)化71-72
- 4.4 系統(tǒng)使用案例72-75
- 4.5 統(tǒng)計(jì)分析75-76
- 4.6 本章小結(jié)76-77
- 第五章 總結(jié)與展望77-79
- 5.1 總結(jié)77
- 5.2 進(jìn)一步工作展望77-79
- 參考文獻(xiàn)79-81
- 致謝81-83
【參考文獻(xiàn)】
中國(guó)期刊全文數(shù)據(jù)庫(kù) 前9條
1 王運(yùn);;Web前端技術(shù)在開(kāi)放大學(xué)在線學(xué)習(xí)平臺(tái)中的應(yīng)用研究[J];電腦知識(shí)與技術(shù);2015年13期
2 姬一文;吳慶波;楊沙洲;;一種服務(wù)器端模板引擎的改進(jìn)與實(shí)現(xiàn)[J];計(jì)算機(jī)應(yīng)用研究;2011年03期
3 陳_,
本文編號(hào):1022553
本文鏈接:http://sikaile.net/kejilunwen/ruanjiangongchenglunwen/1022553.html
最近更新
教材專著