APICloud 七天培訓(xùn)課 第七天

2019-09-11 10:39 更新

/ 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)容

--

  1. 應(yīng)用發(fā)布

1.1 云編譯

1.2 全包加密

1.3 其它安全配置

  1. 版本管理

2.1 在APICloud控制臺(tái)管理版本

2.2 Config文件相關(guān)配置

2.3 mam模塊使用

  1. 云修復(fù)

3.1 在APICloud控制臺(tái)進(jìn)行云修復(fù)(應(yīng)用內(nèi)熱更新)

3.2 Config文件相關(guān)配置

3.3 相關(guān)API使用

  1. 閃屏廣告

4.1 在APICloud控制臺(tái)使用閃屏廣告

4.2 Config文件相關(guān)配置

4.3 相關(guān)API使用

  1. 優(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)特性

  1. 編碼規(guī)范

  1. Widget管理

7.1 多Widget架構(gòu)

7.2 主Widget

7.3 子Widget

7.4 相關(guān)API使用

  1. SuperWebview

8.1 SuperWebview介紹

8.2 SuperWebview特點(diǎn)

<div id="P1"></div>

1. APICloud應(yīng)用發(fā)布流程

--

1.1 云編譯

應(yīng)用發(fā)布流程

1.2 代碼全包加密

  • 網(wǎng)頁(yè)全包加密

對(duì)網(wǎng)頁(yè)包中全包的html,css,javascript代碼進(jìn)行加密,加密后的網(wǎng)友代碼都是不可讀的,并且不能通過(guò)常用的格式化工具恢復(fù)。代碼在運(yùn)行前都是加密的,在運(yùn)行時(shí)進(jìn)行動(dòng)態(tài)解密。

  • 一鍵加密、運(yùn)行時(shí)解密

在開(kāi)發(fā)過(guò)程中無(wú)需對(duì)代碼做任何特殊處理,在云編譯時(shí)選擇代碼加密即可。

  • 零修改、零影響

加密后不改變代碼大小,不影響運(yùn)行效率。

  • 安全盒子

定義了一個(gè)安全盒子,在盒子內(nèi)的代碼按照加密和解密進(jìn)行處理,其它代碼不受影響。

  • 重新定義資源標(biāo)準(zhǔ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ù)

--

云修復(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使用

  • launchviewclicked事件

<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)

應(yīng)用組成結(jié)構(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

以上內(nèi)容是否對(duì)您有幫助:
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號(hào)
微信公眾號(hào)

編程獅公眾號(hào)