/
title: 7天培訓課7
/
<style>
</style>
第七天:掌握APICloud應用管理相關服務的配置使用和相關API,包括:應用發(fā)布、版本管理、云修復、閃屏廣告等。理解APICloud APP優(yōu)化策略和編碼規(guī)范;了解APICloud多Widget管理機制和SuperWebview的使用
第七天課程源碼
教程更新:Github地址
主要內(nèi)容
--
- 應用發(fā)布
1.1 云編譯
1.2 全包加密
1.3 其它安全配置
- 版本管理
2.1 在APICloud控制臺管理版本
2.2 Config文件相關配置
2.3 mam模塊使用
- 云修復
3.1 在APICloud控制臺進行云修復(應用內(nèi)熱更新)
3.2 Config文件相關配置
3.3 相關API使用
- 閃屏廣告
4.1 在APICloud控制臺使用閃屏廣告
4.2 Config文件相關配置
4.3 相關API使用
- 優(yōu)化策略
5.1 了解HTML5特性
5.2 窗口結(jié)構(gòu)
5.3 網(wǎng)頁加載速度
5.4 不實用重型框架
5.5 屏幕適配
5.6 數(shù)據(jù)加載
5.7 圖片處理
5.8 交互響應速度
5.9 尊重系統(tǒng)特性
- 編碼規(guī)范
- Widget管理
7.1 多Widget架構(gòu)
7.2 主Widget
7.3 子Widget
7.4 相關API使用
- SuperWebview
8.1 SuperWebview介紹
8.2 SuperWebview特點
<div id="P1"></div>
1. APICloud應用發(fā)布流程
--
1.1 云編譯

1.2 代碼全包加密
對網(wǎng)頁包中全包的html,css,javascript代碼進行加密,加密后的網(wǎng)友代碼都是不可讀的,并且不能通過常用的格式化工具恢復。代碼在運行前都是加密的,在運行時進行動態(tài)解密。
在開發(fā)過程中無需對代碼做任何特殊處理,在云編譯時選擇代碼加密即可。
加密后不改變代碼大小,不影響運行效率。
定義了一個安全盒子,在盒子內(nèi)的代碼按照加密和解密進行處理,其它代碼不受影響。
對保護的代碼進行統(tǒng)一資源管理,加速資源加載,加速代碼運行。
1.3 其它安全配置
Config文件中對access字段的配置
<access origin="local" />
<access origin="http://apicloud.com" />
推薦文檔:應用配置說明
<div id="P2"></div>
2. 版本管理
--
2.1 在APICloud控制臺管理版本
推薦文檔:本版管理使用說明
2.2 Config文件相關配置
<preference name="autoUpdate" value="true" />
2.3 相關API使用
<div id="P3"></div>
3. 云修復
--

3.1 在APICloud控制臺進行云修復(應用內(nèi)熱更新)
推薦文檔:云修復使用說明
3.2 Config文件相關配置
<preference name="autoUpdate" value="true" />
<preference name="smartUpdate" value="false" />
3.3 相關API使用
- smartupdatefinish事件
- api.rebootApp()方法
<div id="P4"></div>
4. 閃屏廣告
--
4.1 在APICloud控制臺使用閃屏廣告
推薦文檔:閃屏廣告使用說明
4.2 Config文件相關配置
<preference name="autoUpdate" value="true" />
4.3 相關API使用
<div id="P5"></div>
5. 優(yōu)化策略
--
5.1 了解HTML5特性
- 去掉瀏覽器默認樣式
- 可點擊區(qū)域使用div
- 使用語義化的標簽
- 發(fā)揮HTML5和CSS3的新特性
5.2 窗口結(jié)構(gòu)
- Window + Frame 結(jié)構(gòu)
- Frame的高度計算
- 按需求優(yōu)先使用Layout
5.3 頁面加載速度
- HTML、CSS、JS代碼寫在同一個頁面中
- 公用的CSS、JS盡量少和小,不要隨意加載無用的CSS或JS文件
- 盡量減少過多的link或script標簽
5.4 不用重型框架
- 避免使用jQuery或BootStrap等重型的框架
- 擺脫對$的依賴,培養(yǎng)自己動手的習慣
- 使用Mobile First,功能獨立的框架
5.5 屏幕適配
- Viewport
- UI尺寸
- 量圖標準
- 布局方式(彈性響應式+流式)
5.6 數(shù)據(jù)加載
- 掌握api.ajax所有參數(shù)配置作用,按需求配置使用
- 監(jiān)聽網(wǎng)絡狀態(tài)
- 合理處理異常信息
- 下拉刷新和上拉加載
- JS模版
- 數(shù)據(jù)緩存
5.7 圖片處理
- 減少內(nèi)存占用
- 減少圖片縮放等耗性能的操作
- 在服務區(qū)端或使用第三方存儲服務來處理圖片
5.8 交互響應速度
- click事件速度優(yōu)化
- 使用平臺擴展手勢事件
- 使用api.parseTapmode進行主動tapmode處理
- 點擊區(qū)域和點擊交互效果
5.9 尊重系統(tǒng)特性
- 適時更新UI,理解窗體切換和界面渲染關系
- 無論是Android還是iOS系統(tǒng),在進行窗體切換的時候,如果窗體本身正在進行渲染(Window或Frame所加載的網(wǎng)頁沒有渲染完畢),則會影響窗體切換動畫的流暢性,出現(xiàn)卡頓或丟幀的情況。
- 建議在打開Window或Frame的時候,所加載的靜態(tài)網(wǎng)頁不能過大,內(nèi)容不要太多,能快速的渲染完畢,不影響窗體切換動畫的執(zhí)行,在切換動畫執(zhí)行完畢后再進行動態(tài)數(shù)據(jù)的加載和界面的刷新。
- 避免body級別的背景圖片,以原生的方式高效實現(xiàn)
- 如果需要給整個窗體設置背景圖片,不建議通過給body元素指定background的方式來實現(xiàn),建議在openWin或openFrame的時候通過指定bgColor參數(shù)來實現(xiàn)。
- 也可以通過在config.xml中配置windowBackground選項來設置全部窗體的背景圖片。
- 頁面之間使用pageParam傳完成輕量級參數(shù)傳遞,避免使用過大的參數(shù)
<div id="P6"></div>
6. 編碼規(guī)范
--
- 遵循APICloud Widget包結(jié)構(gòu)來組成應用代碼
- Window、Frame及html文件命名規(guī)范
- 使用語義化的標簽組織頁面結(jié)構(gòu),JS代碼中獲取的元素要明確指定id,非語義化標簽樣式定義需要添加class
- 任何文件避免使用中文命名、不用包含大寫字母
- 避免使用?進行參數(shù)傳遞,要使用pageParam
<div id="P7"></div>
7. Widget管理
--
7.1 多Widget架構(gòu)

- 通過ID對Widget進行管理
- Widget在界面上表現(xiàn)為獨立的窗口容器,由多個窗口所組成
- 每一個Widget在代碼、資源、窗口上都完全獨立
- 同一時刻,應用中只能有一個Widget在界面顯示
- 按作用分為主Widget和子Widget
- Widget之間可以相互調(diào)用
7.2 主Widget
- 加載機制:是應用的入口Widget,應用啟動之后首先自動加載運行主Widget
- 生命周期:等于整個應用的生命周期,關閉主Widget就會退出應用
- 配置文件:作為應用的配置文件,在云端編譯應用的時候使用
- 代碼位置:編譯后存在于應用的安裝包中,即ipa或apk包中
7.3 子Widget
- 加載機制:不會被應用自動加載運行,需要被其他的Widget調(diào)用才能運行
- 生命周期:從api.openWidget開始,到api.closeWidget結(jié)束
- 配置文件:對引擎和云端設置的配置項無效,其他的配置項有效
- 代碼位置:可以存在于應用的安裝包中,也可以存在于應用沙箱中
7.4 相關API使用
- 打開子Widget:api.openWidget
- 關閉子Widget:api.closeWidget
- 獲取參數(shù):api.wgtParam
子Widget搜索路徑:主widget包的wgt目錄、沙箱中的wgt目錄
推薦視頻:初級代碼篇第13講
<div id="P8"></div>
8. SuperWebview
--
8.1 SuperWebview介紹
SuperWebView是APICloud一款重要的端引擎產(chǎn)品,致力于解決系統(tǒng)WebView功能弱、體驗差等問題,加速H5與Native的融合。SuperWebView以SDK的方式提供,原生應用嵌入SuperWebView替代系統(tǒng)WebView,即可在H5代碼中使用APICloud平臺的所有端API和云服務。
8.2 SuperWebview特點
- 以SDK的方式提供,嵌入到原生工程中使用;
- 為每個應用動態(tài)編譯生成專屬的SuperWebView;
- 可以調(diào)用平臺所有端API,通過應用控制臺進行配置;
- 可以使用平臺所有的云服務,如版本管理、云修復、數(shù)據(jù)云等;
推薦文檔
SuperWebview開發(fā)指南Android
SuperWebview開發(fā)指南IOS
SuperWebView Android API Reference
SuperWebView iOS API Reference
推薦視頻
SuperWebview公開課視頻
SuperWebview視頻 Android
SuperWebview視頻 iOS
更多建議: