Day7:掌握APICloud应用管理相关服务的配置使用和相关API，包括：应用发布、版本管理、云修复、闪屏广告等。理解APICloud APP优化策略和编码规范；了解APICloud多Widget管理机制和SuperWebview的使用

主要内容：

1. 应用发布

1.1 云编译

1.2 全包加密

• 网页全包加密：对网页中全包的html,css,javascript代码进行加密，加密后的网友代码都是不可读的，并且不能通过常用的格式化工具恢复。代码在运行前都是加密的，在运行时进行动态解密。
• 一键加密、运行时解密     在开发过程中无需对代码做任何特殊处理，在云编译时选择代码加密即可。
• 零修改、零影响     加密后不改变代码的大小，不影响运行效率。
• 安全盒子     定义了一个安全盒子，在盒子内的代码按照加密和解密进行处理，其他代码不受影响。
• 重新定义资源标准     对保护的代码进行统一资源管理，加速资源加载，加速代码运行。

1.3 其它安全配置

Config文件中对access字段的配置

<access origin="local" />

<access origin="http://apicloud.com" />

推荐文档：应用配置说明

2. 版本管理

2.1 在APICloud控制台管理版本

推荐文档：本版管理使用说明

2.2 Config文件相关配置

<preference name="autoUpdate" value="true" />

2.3 mam模块使用

• mam模块

3. 云修复

3.1 在APICloud控制台进行云修复（应用内热更新）

推荐文档：云修复使用说明

3.2 Config文件相关配置

<preference name="autoUpdate" value="true" />

<preference name="smartUpdate" value="false" />

3.3 相关API使用

• smartupdatefinish事件
• api.rebootApp()方法

4.闪屏广告

4.1 在APICloud控制台使用闪屏广告

推荐文档：闪屏广告使用说明

4.2 Config文件相关配置

<preference name="autoUpdate" value="true" />

4.3 相关API使用

• launchviewclicked事件

5.优化策略

5.1 了解HTML5特性

• 去掉浏览器默认样式
• 可点击区域使用div
• 使用语义化的标签
• 发挥HTML5和CSS3的新特性

5.2 窗口结构

• Windows+Frame结构
• Frame的高度计算
• 按需求优先使用Layout

5.3 网页加载速度

• HTML、CSS、JS代码写在同一个页面中
• 公用的CSS、JS尽量少和小，不要随意加载无用的CSS或JS文件
• 尽量减少过多的link或script标签

5.4 不实用重型框架

• 避免使用jQuery或BootStrap等重型的框架
• 摆脱对$的依赖，培养自己动手的习惯
• 使用Mobile First，功能独立的框架

5.5 屏幕适配

• Viewport
• UI尺寸
• 量图标准
• 布局方式（弹性响应式+流式）

5.6 数据加载

• 掌握api.ajax所有参数配置作用，按需求配置使用
• 监听网络状态
• 合理处理异常信息
• 下拉刷新和上拉加载
• JS模板
• 数据缓存

5.7 图片处理

• 减少内存占用
• 减少图片缩放等耗性能的操作
• 在服务区端或使用第三方存储服务来处理图片

5.8 交互响应速度

• click事件速度优化
• 使用平台扩展手势事件
• 使用api.parseTapmode进行主动tapmode处理
• 点击区域和点击交互效果

5.9 尊重系统特性

• 适时更新UI，理解窗体切换和界面渲染关系
  • 无论是Android还是iOS系统，在进行窗体切换的时候，如果窗体本身正在进行渲染（Window或Frame所加载的网页没有渲染完毕），则会影响窗体切换动画的流畅性，出现卡顿或丢帧的情况。
  • 建议在打开Window或Frame的时候，所加载的静态网页不能过大，内容不要太多，能快速的渲染完毕，不影响窗体切换动画的执行，在切换动画执行完毕后再进行动态数据的加载和界面的刷新。
• 避免body级别的背景图片，以原生的方式高效实现
  • 如果需要给整个窗体设置背景图片，不建议通过给body元素指定background的方式来实现，建议在openWin或openFrame的时候通过指定bgColor参数来实现。
  • 也可以通过在config.xml中配置windowBackground选项来设置全部窗体的背景图片。
• 页面之间使用pageParam传完成轻量级参数传递，避免使用过大的参数

6.编码规范

• 遵循APICloud Widget包结构来组成应用代码
• Window、Frame及html文件命名规范
• 使用语义化的标签组织页面结构，JS代码中获取的元素要明确指定id，非语义化标签样式定义需要添加class
• 任何文件避免使用中文命名、不用包含大写字母
• 避免使用？进行参数传递，要使用pageParam

7.Widget管理

7.1 多Widget架构

• 通过ID对Widget进行管理
• Widget在界面上表现为独立的窗口容器，由多个窗口所组成
• 每一个Widget在代码、资源、窗口上都完全独立
• 同一时刻，应用中只能有一个Widget在界面显示
• 按作用分为主Widget和子Widget
• Widget之间可以相互调用

7.2 主Widget

• 加载机制：是应用的入口Widget，应用启动之后首先自动加载运行主Widget
• 生命周期：等于整个应用的生命周期，关闭主Widget就会退出应用
• 配置文件：作为应用的配置文件，在云端编译应用的时候使用
• 代码位置：编译后存在于应用的安装包中，即ipa或apk包中

7.3 子Widget

• 加载机制：不会被应用自动加载运行，需要被其他的Widget调用才能运行
• 生命周期：从api.openWidget开始，到api.closeWidget结束
• 配置文件：对引擎和云端设置的配置项无效，其他的配置项有效
• 代码位置：可以存放在于应用的安装包中，也可以存在于应用沙箱中

7.4 相关API使用

• 打开子Widget:api.openWidget
• 关闭子Widget:api.closeWidget
• 获取参数:api.wgtParam

子Widget搜索路径：主widget包的wgt目录、沙箱中的wgt目录

推荐视频：初级代码篇第13讲

8. SuperWebview

8.1 SuperWebview介绍

SuperWebView是APICloud一款重要的端引擎产品，致力于解决系统WebView功能弱、体验差等问题，加速H5与Native的融合。SuperWebView以SDK的方式提供，原生应用嵌入SuperWebView替代系统WebView，即可在H5代码中使用APICloud平台的所有端API和云服务。

8.2 SuperWebview特点

• 以SDK的方式提供，嵌入到原生工程中使用；
• 为每个应用动态编译生成专属的SuperWebView;
• 可以调用平台所有端API，通过应用控制台进行配置；
• 可以使用平台所有的云服务，如版本管理、云修复、数据云等。

推荐文档

SuperWebview开发指南Android

SuperWebview开发指南IOS

SuperWebView Android API Reference

SuperWebView iOS API Reference

推荐视频

SuperWebview公开课视频

SuperWebview视频 Android

SuperWebview视频 iOS