免费观看又色又爽又黄的小说免费_美女福利视频国产片_亚洲欧美精品_美国一级大黄大色毛片

H5應用優化

2016-11-21    分類: 網站建設

目前我們運行的H5應用直接是在項目下的server目錄中,這稱為開發版本,沒有進行優化。 在生產環境下,一般會將開發版本進行優化,生成發布版本后上線,可提升H5應用性能。
用webcc編譯H5應用
[任務]
使用webcc工具,編譯項目下的server目錄,生成發布版本目錄"output_web"。
作為一個WEB應用,發布時最常見的需求是JS/CSS/HTML文件合并和壓縮(minify)。 H5應用自身用的index.js/index.css文件可以內嵌到主文件index.html中,常用的邏輯頁面(包括html/css文件)也可以內嵌到index.html中來。
筋斗云通過名為webcc的工具進行應用優化,也稱為編譯。 接下來詳細介紹可參考官方文檔"webcc"。
我們先看怎么運行它。 webcc是php工具,必須先安裝php環境(版本5.4或更高); 在Windows系統上,建議安裝git,它自帶的git-bash環境模擬了簡單的linux/unix環境,如果已安裝mingw或cygwin也可以。

webcc一般要求源代碼使用git管理,通過git命令查詢源文件列表及版本差異,實現增量編譯、自動化發布等功能。 如果你已用git管理項目,則在項目目錄中打開git-bash(或其它linux shell環境),運行命令:

上面server是待編譯的開發版本目錄,里面有所有開發的內容。運行后生成發布版本目錄"output_web"。
如果項目未使用git管理,則要求指定源文件列表,在運行webcc之前

必須先設置環境變量WEBCC_LS_CMD,例如:

注意:上面命令會將目錄下所有文件都編譯并發布,應確保清除目錄下無用的文件。 如果你使用的是svn管理項目,則需要把".svn"目錄過濾掉以免生成到       發布目錄:

<

或者使用svn命令精確列表哪些文件要發布:

至于編譯生成的發布目錄和源目錄有哪些不同,下面將講述。
webcc配置解讀

在示例應用的server目錄下,有一個webcc.conf.php的配置文件,里面定義了優化策略,一般無需修改:

第一條規則是server目錄下(不包括子目錄)的所有html文件,即所有H5應用,執行HASH規則,對于html文件,會處理其中的webcc標記。

在示例應用中,我們在index.html中查找webcc,可以看到有這些標記:

先看外部庫、內部庫,它們分別被放置在標記WEBCC_BEGIN MERGE=xxx / WEBCC_END之中。 這意味著其中的css, js文件會被合并到一起,壓縮后生成一個文件xxx.js或xxx.css。
外部庫表示第三方庫,如果應用中用到了其它庫,且文件大小并不大,可以放置到這一塊中,以便多個庫合并成一個文件優化下載。 內部庫是筋斗云框架自身及你的項目內所有H5應用的通用部分(app.js, app.css)。
應用專用就是當前H5應用用到的js/css。使用的webcc標記與前面比,沒有指定"MERGE=xxx",只指定了"MERGE",這表示合并其中內容到當前文件,即把index.css/index.js內嵌到index.html文件中。

最后一塊是內嵌邏輯頁,用"WEBCC_USE_THIS"標記和"mergePage"命令指定了一些邏輯頁,這些頁面一般是最常用的頁面,這個html及其引用的js文件將被直接內嵌到index.html中。 框架在加載邏輯頁時,如果發現已內置于主html中則優先使用內置頁,否則就觸發缺頁中斷從而遠程加載。

創新互聯網絡十年從事網站建設、成都微信開發、APP開發等業務,為眾多企業搭建了自己公眾號,簡單方便用戶管理。我們以科學規范的流程,勤奮專注的態度,為客戶提供全方位的設計服務。專注ui設計,以設計驅動企業價值的持續增長,實現您的商業目標!

網站標題:H5應用優化
鏈接URL:http://m.newbst.com/news29/70029.html

成都網站建設公司_創新互聯,為您提供標簽優化、App設計、響應式網站營銷型網站建設微信公眾號網站營銷

廣告

聲明:本網站發布的內容(圖片、視頻和文字)以用戶投稿、用戶轉載內容為主,如果涉及侵權請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網站立場,如需處理請聯系客服。電話:028-86922220;郵箱:631063699@qq.com。內容未經允許不得轉載,或轉載時需注明來源: 創新互聯

微信小程序開發