/
title: 7天培訓(xùn)課7
/
<style>
</style>
第七天:掌握APICloud應(yīng)用管理相關(guān)服務(wù)的配置使用和相關(guān)API,包括:應(yīng)用發(fā)布、版本管理、云修復(fù)、閃屏廣告等。理解APICloud APP優(yōu)化策略和編碼規(guī)范;了解APICloud多Widget管理機(jī)制和SuperWebview的使用
第七天課程源碼
教程更新:Github地址
主要內(nèi)容
--
- 應(yīng)用發(fā)布
1.1 云編譯
1.2 全包加密
1.3 其它安全配置
- 版本管理
2.1 在APICloud控制臺(tái)管理版本
2.2 Config文件相關(guān)配置
2.3 mam模塊使用
- 云修復(fù)
3.1 在APICloud控制臺(tái)進(jìn)行云修復(fù)(應(yīng)用內(nèi)熱更新)
3.2 Config文件相關(guān)配置
3.3 相關(guān)API使用
- 閃屏廣告
4.1 在APICloud控制臺(tái)使用閃屏廣告
4.2 Config文件相關(guān)配置
4.3 相關(guān)API使用
- 優(yōu)化策略
5.1 了解HTML5特性
5.2 窗口結(jié)構(gòu)
5.3 網(wǎng)頁(yè)加載速度
5.4 不實(shí)用重型框架
5.5 屏幕適配
5.6 數(shù)據(jù)加載
5.7 圖片處理
5.8 交互響應(yīng)速度
5.9 尊重系統(tǒng)特性
- 編碼規(guī)范
- Widget管理
7.1 多Widget架構(gòu)
7.2 主Widget
7.3 子Widget
7.4 相關(guān)API使用
- SuperWebview
8.1 SuperWebview介紹
8.2 SuperWebview特點(diǎn)
<div id="P1"></div>
1. APICloud應(yīng)用發(fā)布流程
--
1.1 云編譯
1.2 代碼全包加密
對(duì)網(wǎng)頁(yè)包中全包的html,css,javascript代碼進(jìn)行加密,加密后的網(wǎng)友代碼都是不可讀的,并且不能通過(guò)常用的格式化工具恢復(fù)。代碼在運(yùn)行前都是加密的,在運(yùn)行時(shí)進(jìn)行動(dòng)態(tài)解密。
在開(kāi)發(fā)過(guò)程中無(wú)需對(duì)代碼做任何特殊處理,在云編譯時(shí)選擇代碼加密即可。
加密后不改變代碼大小,不影響運(yùn)行效率。
定義了一個(gè)安全盒子,在盒子內(nèi)的代碼按照加密和解密進(jìn)行處理,其它代碼不受影響。
對(duì)保護(hù)的代碼進(jìn)行統(tǒng)一資源管理,加速資源加載,加速代碼運(yùn)行。
1.3 其它安全配置
Config文件中對(duì)access字段的配置
<access origin="local" />
<access origin="http://apicloud.com" />
推薦文檔:應(yīng)用配置說(shuō)明
<div id="P2"></div>
2. 版本管理
--
2.1 在APICloud控制臺(tái)管理版本
推薦文檔:本版管理使用說(shuō)明
2.2 Config文件相關(guān)配置
<preference name="autoUpdate" value="true" />
2.3 相關(guān)API使用
<div id="P3"></div>
3. 云修復(fù)
--
3.1 在APICloud控制臺(tái)進(jìn)行云修復(fù)(應(yīng)用內(nèi)熱更新)
推薦文檔:云修復(fù)使用說(shuō)明
3.2 Config文件相關(guān)配置
<preference name="autoUpdate" value="true" />
<preference name="smartUpdate" value="false" />
3.3 相關(guān)API使用
- smartupdatefinish事件
- api.rebootApp()方法
<div id="P4"></div>
4. 閃屏廣告
--
4.1 在APICloud控制臺(tái)使用閃屏廣告
推薦文檔:閃屏廣告使用說(shuō)明
4.2 Config文件相關(guān)配置
<preference name="autoUpdate" value="true" />
4.3 相關(guān)API使用
<div id="P5"></div>
5. 優(yōu)化策略
--
5.1 了解HTML5特性
- 去掉瀏覽器默認(rèn)樣式
- 可點(diǎn)擊區(qū)域使用div
- 使用語(yǔ)義化的標(biāo)簽
- 發(fā)揮HTML5和CSS3的新特性
5.2 窗口結(jié)構(gòu)
- Window + Frame 結(jié)構(gòu)
- Frame的高度計(jì)算
- 按需求優(yōu)先使用Layout
5.3 頁(yè)面加載速度
- HTML、CSS、JS代碼寫在同一個(gè)頁(yè)面中
- 公用的CSS、JS盡量少和小,不要隨意加載無(wú)用的CSS或JS文件
- 盡量減少過(guò)多的link或script標(biāo)簽
5.4 不用重型框架
- 避免使用jQuery或BootStrap等重型的框架
- 擺脫對(duì)$的依賴,培養(yǎng)自己動(dòng)手的習(xí)慣
- 使用Mobile First,功能獨(dú)立的框架
5.5 屏幕適配
- Viewport
- UI尺寸
- 量圖標(biāo)準(zhǔn)
- 布局方式(彈性響應(yīng)式+流式)
5.6 數(shù)據(jù)加載
- 掌握api.ajax所有參數(shù)配置作用,按需求配置使用
- 監(jiān)聽(tīng)網(wǎng)絡(luò)狀態(tài)
- 合理處理異常信息
- 下拉刷新和上拉加載
- JS模版
- 數(shù)據(jù)緩存
5.7 圖片處理
- 減少內(nèi)存占用
- 減少圖片縮放等耗性能的操作
- 在服務(wù)區(qū)端或使用第三方存儲(chǔ)服務(wù)來(lái)處理圖片
5.8 交互響應(yīng)速度
- click事件速度優(yōu)化
- 使用平臺(tái)擴(kuò)展手勢(shì)事件
- 使用api.parseTapmode進(jìn)行主動(dòng)tapmode處理
- 點(diǎn)擊區(qū)域和點(diǎn)擊交互效果
5.9 尊重系統(tǒng)特性
- 適時(shí)更新UI,理解窗體切換和界面渲染關(guān)系
- 無(wú)論是Android還是iOS系統(tǒng),在進(jìn)行窗體切換的時(shí)候,如果窗體本身正在進(jìn)行渲染(Window或Frame所加載的網(wǎng)頁(yè)沒(méi)有渲染完畢),則會(huì)影響窗體切換動(dòng)畫的流暢性,出現(xiàn)卡頓或丟幀的情況。
- 建議在打開(kāi)Window或Frame的時(shí)候,所加載的靜態(tài)網(wǎng)頁(yè)不能過(guò)大,內(nèi)容不要太多,能快速的渲染完畢,不影響窗體切換動(dòng)畫的執(zhí)行,在切換動(dòng)畫執(zhí)行完畢后再進(jìn)行動(dòng)態(tài)數(shù)據(jù)的加載和界面的刷新。
- 避免body級(jí)別的背景圖片,以原生的方式高效實(shí)現(xiàn)
- 如果需要給整個(gè)窗體設(shè)置背景圖片,不建議通過(guò)給body元素指定background的方式來(lái)實(shí)現(xiàn),建議在openWin或openFrame的時(shí)候通過(guò)指定bgColor參數(shù)來(lái)實(shí)現(xiàn)。
- 也可以通過(guò)在config.xml中配置windowBackground選項(xiàng)來(lái)設(shè)置全部窗體的背景圖片。
- 頁(yè)面之間使用pageParam傳完成輕量級(jí)參數(shù)傳遞,避免使用過(guò)大的參數(shù)
<div id="P6"></div>
6. 編碼規(guī)范
--
- 遵循APICloud Widget包結(jié)構(gòu)來(lái)組成應(yīng)用代碼
- Window、Frame及html文件命名規(guī)范
- 使用語(yǔ)義化的標(biāo)簽組織頁(yè)面結(jié)構(gòu),JS代碼中獲取的元素要明確指定id,非語(yǔ)義化標(biāo)簽樣式定義需要添加class
- 任何文件避免使用中文命名、不用包含大寫字母
- 避免使用?進(jìn)行參數(shù)傳遞,要使用pageParam
<div id="P7"></div>
7. Widget管理
--
7.1 多Widget架構(gòu)
- 通過(guò)ID對(duì)Widget進(jìn)行管理
- Widget在界面上表現(xiàn)為獨(dú)立的窗口容器,由多個(gè)窗口所組成
- 每一個(gè)Widget在代碼、資源、窗口上都完全獨(dú)立
- 同一時(shí)刻,應(yīng)用中只能有一個(gè)Widget在界面顯示
- 按作用分為主Widget和子Widget
- Widget之間可以相互調(diào)用
7.2 主Widget
- 加載機(jī)制:是應(yīng)用的入口Widget,應(yīng)用啟動(dòng)之后首先自動(dòng)加載運(yùn)行主Widget
- 生命周期:等于整個(gè)應(yīng)用的生命周期,關(guān)閉主Widget就會(huì)退出應(yīng)用
- 配置文件:作為應(yīng)用的配置文件,在云端編譯應(yīng)用的時(shí)候使用
- 代碼位置:編譯后存在于應(yīng)用的安裝包中,即ipa或apk包中
7.3 子Widget
- 加載機(jī)制:不會(huì)被應(yīng)用自動(dòng)加載運(yùn)行,需要被其他的Widget調(diào)用才能運(yùn)行
- 生命周期:從api.openWidget開(kāi)始,到api.closeWidget結(jié)束
- 配置文件:對(duì)引擎和云端設(shè)置的配置項(xiàng)無(wú)效,其他的配置項(xiàng)有效
- 代碼位置:可以存在于應(yīng)用的安裝包中,也可以存在于應(yīng)用沙箱中
7.4 相關(guān)API使用
- 打開(kāi)子Widget:api.openWidget
- 關(guān)閉子Widget:api.closeWidget
- 獲取參數(shù):api.wgtParam
子Widget搜索路徑:主widget包的wgt目錄、沙箱中的wgt目錄
推薦視頻:初級(jí)代碼篇第13講
<div id="P8"></div>
8. SuperWebview
--
8.1 SuperWebview介紹
SuperWebView是APICloud一款重要的端引擎產(chǎn)品,致力于解決系統(tǒng)WebView功能弱、體驗(yàn)差等問(wèn)題,加速H5與Native的融合。SuperWebView以SDK的方式提供,原生應(yīng)用嵌入SuperWebView替代系統(tǒng)WebView,即可在H5代碼中使用APICloud平臺(tái)的所有端API和云服務(wù)。
8.2 SuperWebview特點(diǎn)
- 以SDK的方式提供,嵌入到原生工程中使用;
- 為每個(gè)應(yīng)用動(dòng)態(tài)編譯生成專屬的SuperWebView;
- 可以調(diào)用平臺(tái)所有端API,通過(guò)應(yīng)用控制臺(tái)進(jìn)行配置;
- 可以使用平臺(tái)所有的云服務(wù),如版本管理、云修復(fù)、數(shù)據(jù)云等;
推薦文檔
SuperWebview開(kāi)發(fā)指南Android
SuperWebview開(kāi)發(fā)指南IOS
SuperWebView Android API Reference
SuperWebView iOS API Reference
推薦視頻
SuperWebview公開(kāi)課視頻
SuperWebview視頻 Android
SuperWebview視頻 iOS
更多建議: