快应用之开发体验纪要

何谓「快应用」呢？它是基于手机硬件平台的新型应用形态，标准是由主流手机厂商组成的快应用联盟联合制定。其标准的诞生将在研发接口、能力接入、开发者服务等层面建设标准平台，以平台化的生态模式对个人开发者和企业开发者全品类开放。快应用具备传统 APP 完整的应用体验，无需安装、即点即用；覆盖 10 亿设备，与操作系统深度集成，探索新型应用场景。

快应用特点

下面列出些关于「快应用」特点，这将有助于对它有更深刻的理解；

基于手机硬件平台，标准由主流手机厂商组成的快应用联盟制定;
无需安装、即点即用，且具备传统 APP 完整的应用体验;
与操作系统深度集成，一键直达;
更新直接推送，新版本直接更新到后台，用户无感知快应用的技术实现;
基于前端技术栈开发、可快速迭代;
通过全新的引擎，将系统原生的渲染机制和接口能力提供给上层应用;
运行在框架应用进程中，对每个快应用会开一个 Launcher 进程快应用的开发、发布和使用流程;
开发者需要在快应用官网注册，上传至快应用官网，测试并通过审核后即可进行分发;
使用前端技术栈进行开发，经过编译、签名后最终产出 rpk 文件;
开发者需登录快应用官网进行上传和发布，发布前会经过审核快应用与小程序的对比;
快应用使用 native 渲染，性能体验会比较好，而小程序是使用 webview 渲染 ;
快应用的系统级能力更强，能调用更多系统级 api;

与小程序对比

──	开发技术	渲染方式	硬件资源扶持	系统级能力	桌面留存
小程序	前端技术栈	webview 渲染	有	强	有
快应用	前端技术栈	native 渲染	无	弱	有

以上这些比对，皆是从两者的出生角度而言；可以肯定的是，「快应用」得益于其与生俱来的优势，将在更多应用场景发挥作用，它的崛起，将会给 Android 用户带来更多的便捷。同时作为后起之秀，其开发体验上，是明显优于小程序的；但目前的小程序，已经有长足的发展，而「快应用」才处于刚起步阶段，在经验累积、应用数量、分发传播、社区建设等方面，两者之间还存在些差距；后续故事将会如何，让我们将拭目以待。

开发 & 调试

环境搭建

鉴于「快应用」基于前端技术栈来开发，因此需要安装 Node.js (>= 6.0)；yarn （推荐使用）。
安装 hap-toolkit ；它是针对「快应用」衍生出的开发者工具；

yarn global add hap-toolkit
// 检测是否成功安装 hap-toolkit
hap -V

手机安装「快应用」调试器 ── 一个 Android 应用程序，它可以连接到手机系统内的快应用执行环境，包含扫码安装、本地安装、在线更新、开始调试、等功能；

扫码安装：配置 HTTP 服务器地址，下载 rpk 包，并唤起平台运行 rpk 包；
本地安装：选择手机文件系统中的 rpk 包，并唤起平台运行 rpk 包；
在线更新：重新发送 HTTP 请求，更新 rpk 包，并唤起平台运行 rpk 包；
开始调试：唤起平台运行 rpk 包，并启动远程调试工具；
备注：当您的手机系统尚未内置快应用运行平台，或您想在开发过程中体验快应用尚未正式发布的新功能、新特性，您可以安装 快应用预览版,这是一个包含了快应用基础功能的 Android 应用程序。下载安装成功后，通过快应用调试器可以选择在快应用预览版运行 rpk包，开发测试对应平台的 api 和功能。更详细的叙述，请参见快应用开发文档 | 环境搭建。

开发环境

在「快应用」中，对代码编辑配置做了说明；你可以使用 VsCode、Sublime Text、WebStorm 等工具来开发。鉴于官方针对 VsCode 推出了 Hap Extension 扩展，这里推荐使用 VsCode 来编写快应用代码（据悉，专门用于开发「快应用」的编辑器，尚在开发中 18-08-15）。

开发调试

在开发文档调试工具一节，对此有详细说明；从一般性开发角度总结而言，只需运行以下两个命令: npm run server 和 npm run watch；前者会在终端会输出一个二维码，用手机上启动快应用调试器，点击扫码安装扫描，即可下载安装 apk 包，并运行之；而后者将会启动文件监视器，每次修改工程文件时，会自动编译并在手机端刷新，速度蛮快；至于日志查看，可利用 devtools 调试界面 console 输出，也可利用 adb 工具，在终端进行查看：

adb logcat -s JsConsole

快应用示例

在安装 Toolkit 工具后，可通过全局 hap 命令创建一个项目模板，如下所示：

hap init <YourProjectName>

鉴于其内置的 Demo 项目示例，尚处于入门级项目设定(@18-08)，不便于用户着手开发，且不利于高效编写、维护；因此，有将编写的快应用 nicelinks-quick-app 开源，借此以探索新型应用设计；此外，也是在探索如何构建优质快应用，希望可以在此事儿上提供些参考。其代码组织结构如下：

├── sign                # 存储 rpk 包签名模块;
│   ├── debug           # 调试环境证书/私钥文件
│   └── release         # 正式环境证书/私钥文件
└── src
│   ├── assets          # 公用的资源(Images/Styles/字体...)
│   │   ├──images       # 存储 png/jpg/svg 等公共图片资源
│   │   └──styles       # 存放 less/css/sass 等公共样式资源
│   ├── helper          # 项目自定义辅助各类工具
│   │   ├──apis         # 存储与后台请求接口相关(已封装好)
│   │   ├──ajax.js      # 对系统提供的 fetch api 进行链式封装
│   │   └──util.js      # 存放项目所需公共工具类方法
│   ├── pages           # 统一存放项目页面级代码
│   ├── app.ux          # 应用程序代码的人口文件
│   └── manifest.json   # 配置应用基本信息
└── package.json        # 定义项目需要的各种模块及配置信息

有必要谈及的是，此项目秉承在高效开发 Web 单页应用解决方案中所传递的理念：为高效开发而设计；相比于内置 Demo，她具有以下诸多优点：

对项目结构进行优化；如上组织结构所示，将各资源模块，更专业的分门别类，使之可以便捷的去编写、维护、查找，同时也是基于前端开发既定共识去设计，更容易为初接触者所理解 & 上手；
更优雅的处理数据请求；采用 Promise 对系统内置请求 @system.fetch 进行封装，并抛出至全局，使得可以极简的进行链式调用，同时便捷地处理返回数据；
内置了样式处理方案；「快应用」支持 less, sass 的预编译；这里采取 less 方案，并内置了部分变量，以及常用混合方法，使得可以轻松开启样式编写、复用、修改等；
优化本地开发端口设定；「快应用」默认端口为 12306，虽说可自定义端口，但使用体验却不够友好；此处参考 creat-react-app 设定，对本地开发地址端口使用进行优化：如果

链接: https://fly63.com/article/detial/1122