APICloud 七天培訓課 第七天

2019-09-11 10:39 更新

/ title: 7天培訓課7 / <style> </style>

第七天:掌握APICloud應用管理相關服務的配置使用和相關API,包括:應用發(fā)布、版本管理、云修復、閃屏廣告等。理解APICloud APP優(yōu)化策略和編碼規(guī)范;了解APICloud多Widget管理機制和SuperWebview的使用

第七天課程源碼

教程更新:Github地址

主要內(nèi)容

--

  1. 應用發(fā)布

1.1 云編譯

1.2 全包加密

1.3 其它安全配置

  1. 版本管理

2.1 在APICloud控制臺管理版本

2.2 Config文件相關配置

2.3 mam模塊使用

  1. 云修復

3.1 在APICloud控制臺進行云修復(應用內(nèi)熱更新)

3.2 Config文件相關配置

3.3 相關API使用

  1. 閃屏廣告

4.1 在APICloud控制臺使用閃屏廣告

4.2 Config文件相關配置

4.3 相關API使用

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

  1. 編碼規(guī)范

  1. Widget管理

7.1 多Widget架構(gòu)

7.2 主Widget

7.3 子Widget

7.4 相關API使用

  1. SuperWebview

8.1 SuperWebview介紹

8.2 SuperWebview特點

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

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

--

1.1 云編譯

應用發(fā)布流程

1.2 代碼全包加密

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

對網(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使用

  • launchviewclicked事件

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

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

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

掃描二維碼

下載編程獅App

公眾號
微信公眾號

編程獅公眾號