1、近年來(lái)，智能移動(dòng)設(shè)備快速普及，移動(dòng)互聯(lián)網(wǎng)迅猛發(fā)展，根據(jù)我國(guó)最新的互聯(lián)網(wǎng)發(fā)展?fàn)顩r統(tǒng)計(jì)報(bào)告，截至2016年6月我國(guó)網(wǎng)民數(shù)量已經(jīng)達(dá)到7.10億，其中手機(jī)網(wǎng)民6.56億[1]。移動(dòng)互聯(lián)網(wǎng)時(shí)代早已經(jīng)開啟，成為了互聯(lián)網(wǎng)行業(yè)的新戰(zhàn)場(chǎng)。為了適應(yīng)快速發(fā)展的移動(dòng)端開發(fā)技術(shù)，基于HTML5技術(shù)的移動(dòng)端Web App應(yīng)運(yùn)而生。Web App是利用HTML5等新一代Web技術(shù)實(shí)現(xiàn)特定功能，并且運(yùn)行于網(wǎng)絡(luò)和瀏覽器的移動(dòng)端應(yīng)用程序。隨著設(shè)備性能的不斷提高，移動(dòng)端We

2、b App的用戶體驗(yàn)也漸漸逼近客戶端應(yīng)用。相對(duì)于已被人熟知的Android應(yīng)用和IOS應(yīng)用，移動(dòng)端Web App最大的優(yōu)勢(shì)就是不需要下載安裝即可使用，用戶通過(guò)掃一掃二維碼，或者通過(guò)推送的URL即可打開應(yīng)用，又無(wú)需安裝、更新或卸載。并且移動(dòng)端Web App開發(fā)過(guò)程高效，版本迭代迅速，具有支持跨平臺(tái)的內(nèi)在屬性。當(dāng)然與客戶端應(yīng)用比起來(lái)，移動(dòng)端Web App也存在穩(wěn)定性低，兼容性差等問(wèn)題。
　　本論文所述的移動(dòng)端Web App組件化開發(fā)，

3、是針對(duì)Web App開發(fā)而設(shè)計(jì)的一種快速開發(fā)模式。在大型軟件項(xiàng)目開發(fā)中，組件化開發(fā)能減少代碼變更代價(jià)，每次變更業(yè)務(wù)需求時(shí)甚至不需要修改代碼，僅僅是變更相關(guān)配置就可以實(shí)現(xiàn)新需求，可以大大提高開發(fā)效率，提高代碼重復(fù)利用率，降低維護(hù)成本。另外，移動(dòng)端設(shè)備的電量、內(nèi)存等資源十分有限，提高移動(dòng)端應(yīng)用性能的意義不言而喻。在移動(dòng)端業(yè)務(wù)需求越來(lái)越復(fù)雜的情況下，Web App性能優(yōu)化的意義也越來(lái)越重要。
　　作者讀研期間，在騰訊科技（深圳）有限公司

4、-社交網(wǎng)絡(luò)事業(yè)群-社交平臺(tái)部做過(guò)一年軟件開發(fā)實(shí)習(xí)生。作者的主要工作就是參與Qzone移動(dòng)端Web App基礎(chǔ)組件庫(kù)的構(gòu)建、維護(hù)，以及利用基礎(chǔ)組件庫(kù)快速開發(fā)手機(jī)版QQ空間客戶端內(nèi)嵌的各種Web App，并且對(duì)其進(jìn)行必要的性能優(yōu)化。本論文所述的Web App組件化開發(fā)及性能優(yōu)化課題，是來(lái)源于實(shí)習(xí)期間所做項(xiàng)目。
　　本論文首先介紹了移動(dòng)端Web App的發(fā)展背景與發(fā)展現(xiàn)狀，引入了Web App相關(guān)技術(shù)HTML5、CSS3、jQuery的

5、介紹。然后介紹了基礎(chǔ)組件庫(kù)和組件化開發(fā)模式，以Qzone業(yè)務(wù)為背景介紹了基礎(chǔ)組件庫(kù)的構(gòu)建過(guò)程，基礎(chǔ)組件庫(kù)主要包括滾屏組件、支付組件、抽獎(jiǎng)組件、獲獎(jiǎng)記錄組件、地址填寫組件和分享定制組件，并且以一個(gè)Web App的開發(fā)實(shí)例詳述了利用基礎(chǔ)組件庫(kù)進(jìn)行組件化開發(fā)過(guò)程。隨后從腳本加載優(yōu)化、CSS圖像拼合技術(shù)優(yōu)化、Gzip壓縮技術(shù)優(yōu)化三個(gè)方面探討了WebApp性能優(yōu)化的方案。最后，論文總結(jié)并展望了Web App組件化開發(fā)技術(shù)和性能優(yōu)化技術(shù)，以及Web