HTML5.dcloud.io-stream-app

dcloud.io提出的Stream App

本文仅仅是关于dcloud.io提出的SteamApp初探,所有内容请参考其官网。

1. Application promotion by scaning QR Code

传统方式: 1. 扫描二维码, 跳转App Store/Market  2.下载App  3.启动App

StreamApp方式: 1. 扫描二维码 2.下载 & 启动 (TODO: 验证)

2. HTML5 Plus

HTML5 Plus 文档

http://www.html5plus.org/doc/

2.1 What‘s HTML5 Plus?

HTML5 Plus是一套HTML5的扩展规范。该规范可参考 http://www.html5plus.org/doc/h5p.html

HTML5 Plus规范包括的能力有 Ref[5.2]:

Accelerometer, Audio, Barcode, Camera, Contacts, Device, Downloader, Events, Gallery, Geolocation,

IO, Key, Maps, Messaging, NativeObj, NativeUI, Navigator, OAuth, Orientation, Payment, Proximity, Push,

Runtime, Share, Speech, Statistic, Storage, Uploader, Webview, XMLHttpRequest, Zip

2.2 Native.js

一种通过js调用几十万原生API的技术。

同时HTML5 Plus Runtime还实现Native.js, 支持Android/iOS。

Android: http://www.html5plus.org/doc/zh_cn/android.html

iOS: http://www.html5plus.org/doc/zh_cn/ios.html

2.3 HTML5 Plus Runtime

HTML5 Plus Runtime实现Native.js, 闭源的。

Maybe: 通过扩展webkit来实现。

3. mui

3.1 What‘s mui?

mui是一个前端框架, 依赖于HTML5+。

开源

mui包含JavaScript, CSS, Font, Icon

轻量,体积小

基于ratchet (http://goratchet.com/, Build mobile apps with simple HTML‚ CSS‚ and JS components.)

mui github

https://github.com/dcloudio/mui

mui文档

http://dev.dcloud.net.cn/mui/ui/

4. HTML5 Plus SDK

封装HTML5 Plus(H5+) Runtime得到的HTML5 Plus SDK,主要应用于:

A: 使用H5+ SDK进行本地打包

HBuilder支持云端打包, 包的大小限制为40M以下。

B: 原生代码来扩展H5+ Runtime的能力

C: 集成SDK到已有的App Project中。替换原有的webview 或者 运营HTML5 Plus App。

集成方式 应用场景

Widget插件

在现有应用的基础上使用HTML5 Plus SDK显示一个手机端的HTML5 Plus APP
Webview  显示一个支持HTML5 Plus扩展能力的WebView 

4.1 Android Platform

SDK zip: 36M

SDK包含: assets, libs, res, src

SDK中包含的lib, 所有的lib有16M。

libs包含的库

AMap_3DMap_V2.4.1.jar
AMap_Services_V2.4.0.jar
BaiduLBS_Android.jar
GetuiExt-2.0.3.jar
GetuiSDK2.7.0.0.jar
MapApiLocation_1.3.3.jar
Msc.jar
alipaysdk.jar
alipaysecsdk.jar
alipayutdid.jar
android-support-v4.jar
aps-dhPush.jar
aps-igexin.jar
aps.jar
armeabi/
armeabi-v7a/
audio.jar
barcode.jar
camera.jar
contacts.jar
device.jar
downloader.jar
file.jar
gallery.jar
geolocation-amap.jar
geolocation-baidu.jar
geolocation-system.jar
geolocation.jar
invocation.jar
json_simple-1.1.jar
map-amap.jar
map-baidu.jar
messaging.jar
nativeObj.jar
nativeui.jar
navigatorui.jar
nineoldandroids-2.4.0.jar
nopermission.jar
oauth-qq.jar
oauth-sina.jar
oauth-weixin.jar
oauth.jar
open_sdk_r5043_lite.jar
payment-alipay.jar
payment-weixin.jar
payment.jar
pdr.jar
sensor.jar
share-qq.jar
share-sina.jar
share-tencent.jar
share-weixin.jar
share.jar
speech.jar
speech_ifly.jar
statistics-umeng.jar
tx_weibo_sdk-httpclient-3.0.1.jar
tx_weibo_sdk.jar
tx_weibo_sdk_component.jar
tx_wx.jar
ui.jar
umeng-analytics-v5.6.1.jar
universal-image-loader-1.9.0.jar
uploader.jar
weibosdk.jar
weibosdkcore.jar
x86/
xhr.jar

4.2 iOS Platform

SDK zip: 136M

SDK包含: inc, Bundles, Libs

Bundles: 4.3M Libs: 337M

Libs包含的所有library和framework

Libs包含的所有library和framework

AMapSearchKit.framework
AlipaySDK.framework
BaiduMapAPI.framework
MAMapKit.framework
TencentOpenAPI.framework
iflyMSC.framework
libAMapImp.a
libASIHttpRequest.a
libBaiduKeyVerify.a
libBaiduMobStatForSDK.a
libBaiduWalletSDK.a
libGeTuiPush.a
libGeTuiSdk.a
libIAPPay.a
libJSONKit.a
libMobClickLibrary.a
libPushSDK.a
libQQOauth.a
libQQShare.a
libSDWebImage.a
libSinaShare.a
libSinaWBOauth.a
libTCWeiboSDK.a
libTencentShare.a
libTouchJSON.a
libUPPayPlugin.a
libWXOauth.a
libWeChatSDK.a
libWeiboSDK.a
libalixpayment.a
libbmapimp.a
libcoreSupport.a
libiflySpeech.a
liblibAccelerometer.a
liblibBarcode.a
liblibCache.a
liblibCamera.a
liblibContacts.a
liblibGeolocation.a
liblibIO.a
liblibLog.a
liblibMap.a
liblibMedia.a
liblibMessage.a
liblibNativeObj.a
liblibNativeUI.a
liblibNavigator.a
liblibOauth.a
liblibOrientation.a
liblibPDRCore.a
liblibPGInvocation.a
liblibPGProximity.a
liblibPayment.a
liblibPush.a
liblibShare.a
liblibSpeech.a
liblibStatistic.a
liblibStorage.a
liblibUI.a
liblibWebNavi.a
liblibWidget.a
liblibXHR.a
liblibZip.a
liblist.txt
libopencore-amrnb.a
libpingpp.a
libpingpppay.a
libweixinShare.a
libwxpay.a

引入SDK到已有App Project中会使最终的安装包变大;以及可能带来的library冲突。

5. HTML5 Plus/MUI Application

HTML5, CSS, JavaScript, HTML5 Plus Runtime, Mui Framework

5.1 HTML5 Plus vs React Native

http://ask.dcloud.net.cn/question/2900

5.2 Manifest.json文档说明 manifest配置

http://ask.dcloud.net.cn/article/94

6. HBuilder

开发HTML5 Plus App, Stream App的IDE。

基于Eclipse开发。

7. Stream Application

http://dcloud.io/ (官网)

7.1 What?

HTML5 Plus Application + Page Reference Configuration

A: 页面引用关系

用来描述App Project中页面与项目资源文件之间引用的关系

B: 生成页面引用关系

"Project"右击->发行->发布为流应用

生成页面引用关系的方法: HBulder扫描代码; 通过运行应用; 手动配置。

页面引用关系本质是 有向无环图

7.2 Traits

差量更新+即时更新

多端发布(iOS, Android等)

可提高用户转化率 (“实现5秒内完成App的安装和启动”)

基于DCloud快码提高转化率

7.3 Cons

依赖网络

仅Android平台  (??)

流畅度稍弱 (Android版本的)

7.4 Company Behind Stream Application

DCloud 数字天堂

7.5 DCloud快码

DCloud快码是DCloud推出的App推广码。

快码一个码集成了多个推广信息,包括 流应用、原生App地址、微信公众号、微博等信息,使用不同软件扫码可以得到不同结果。

微信扫快码

关注微信公众号或下载App,下载App时又会根据设备支持情况秒装流应用或下载原生App

微博扫快码

访问关注微博

DCloud快码的申请

只有发布过流应用的App才可以申请快码

7.5 Is Stream Application suppored on iOS Platform?

TODO: iPhone上扫码实验验证

7.6 vs. React Native

7.7 Scenario & Case

应用场景

从Wap站点/Mobile站点迁移

某单一功能点独立为流应用

对交互流畅度不高的应用

案例

应用案例包括: 京东秒杀,有道词典 Ref[6]

应用案例多分布于 O2O, 资讯, 电商 行业。


Reference

1. 流应用

http://www.dcloud.io/streamapp.html

http://ask.dcloud.net.cn/docs/  (文档)

2. ratchet

https://github.com/twbs/ratchet

Build mobile apps with simple HTML, CSS, and JS components.

3. 关于DCloud的一些视频教程

http://edu.yuantuan.com/course/explore/DCloud

4. DCloud - 流应用专题

http://edu.yuantuan.com/course/171/lesson/list

5. HTML5 Plus

5.1 http://www.html5plus.org

5.2 http://www.html5plus.org/doc/zh_cn/runtime.html

6. 流应用案例

http://dcloud.io/case/#group-1


Others

1. wex5

http://www.wex5.com/wex5/

2. App Promotion

http://buildfire.com/free-app-promotion/

http://www.shoutmeloud.com/how-to-promote-android-app-game.html

时间: 2024-10-13 06:56:38

HTML5.dcloud.io-stream-app的相关文章

HTML5定稿:手机App将三年内消失,互联网世界的第二次大战

HTML5与app以对立竞争的产品形态展现在大众视野.从去年开始又有一大批技术派或者创业者盯向html5领域,移动游戏的爆发和微信朋友圈等众多平台为HTML5导流,能不能颠覆,或许只是时间上的问题. 就像Apple成立前,HP的高层告诉沃兹:谁会在家里摆一台电脑呢?未来HTML5肯定会颠覆原生App.2007年W3C(万维网联盟)立项HTML5,直至2014年10月底,这个长达八年的规范终于正式封稿. 过去这些年,HTML5颠覆了PC互联网的格局,优化了移动互联网的体验,接下来,HTML5将颠覆

html5页面打包成App - Android或Iphone安装程序

下载安装前端开发工具:HBuilder 官网下载:http://www.dcloud.io/ 根据官网说明安装 * 打开登录HBuilder,把做好的H5页面通过添加app项目把H5的文件夹加入进来(项目列表内会生成文件夹和文件如manifest.json) * 按Ctrl+R启动项目模拟,双击左侧项目列表的manifest.json配置相关参数 * 然后选择顶部菜单项‘发行’→‘App打包’→设置相关参数→上传云端打包好下载下来(可以选择打包成Android或Iphone安装包) * 发送手机

html5开发移动端app的7大优势(一)

移动web端APP是如今市场份额占据霸主,自html5开发语言正式封稿后,使用html5语言开发app应用带来的用户体验和制作难度是其他语言远远不如的.本文华清创客学院为读者解析html5开发移动端app的7大优势.让对html5感兴趣的读者更好的了解html5网页开发技术. html5开发移动端app的7大优势(一): 1.跨平台: 开发者的幸福指数随着多屏时代的来临岌岌可危.人人都期盼HTML5能扮演救星.多套代码.不同技术工种.业务逻辑同步,这是折磨人的过程.有点类似个人电脑早期世界,那个

Java IO Stream

ref: http://www.studytonight.com/java/java-io-stream.php IO Stream Java performs I/O through Streams. A stream is linked to physical layer by java I/O system to make input and output operation in java. In general, a stream means continuous flow of da

HTML5、微信、APP:创业寒冬只能选其一,该选哪个?

HTML5手机网站 优势:开发技术简单,研发周期短,用户接触成本低 劣势:功能实现相比APP存在差距,用户重复使用难度大,用户粘性差 适合场景:把手机网站当成网络上的“电子产品介绍手册”.手机网站更适合用户“主动百度搜索”或者“主动访问”,适合于陌生用户的低频或初次访问,让用户更完整和详细的获得快速介绍.通常用户使用搜索引擎.手动输入网址等形式进行访问. 微信公众号 优势:开发技术简单,研发周期短,微信可以带来流量和用户 劣势:功能受限,与此同时在长期运营角度存在2大弊端 “效果递减”,微信公众

使用HTML5构建iOS原生APP(2)

本文转载至 http://ju.outofmemory.cn/entry/18807 有时候我们在内嵌的webview中希望点击一个链接之后,触发iOS原生事件,而不是webview内页面跳转(因为webview的跳转很生硬,而ajax+js模拟则不如原生segue平滑). 有时候我们希望在页面内consloe.log('log something')的时候在控制台里看到输出,但手机里没有控制台,所以我们希望可以利用xcode的控制台输出信息. 因为iOS没有提供API让我们直接用html或者j

使用HTML5构建iOS原生APP

转自http://ju.outofmemory.cn/entry/18807 有时候我们在内嵌的webview中希望点击一个链接之后,触发iOS原生事件,而不是webview内页面跳转(因为webview的跳转很生硬,而ajax+js模拟则不如原生segue平滑). 有时候我们希望在页面内consloe.log('log something')的时候在控制台里看到输出,但手机里没有控制台,所以我们希望可以利用xcode的控制台输出信息. 因为iOS没有提供API让我们直接用html或者js来跟外

html5开发移动混合App系列1-开发环境搭建

最近公司准备开发门店收银系统,是基于IPAD的程序,决定采用基于 Ionic + Cordova + AngularJS技术混合开发模式. 准备 一台mac(安装了mac os的虚拟机也可以),nodejs,ionic,xcode 安装 1,安装nodejs 到官网下载nodejs安装包(pkg文件),需要0.10.*及以下的版本,高版本会有很多插件不可用.我使用的版本是v0.10.38(下载地址:http://nodejs.org/dist/v0.10.38/  ) ,下载完成之后直接打开按提

使用phonegap包装html5网页为iOS app

工具准备:mac开发机.苹果开发者账号(测试可行性时不需要,但真机调试及发布时需要) phonegap下载地址:http://phonegap.com/install/ (若找不到,请往下拉) 截至今天,PhoneGap更新到 2.9.1版本,为了保证快速使用,我提供了一份下载地址在我的百度网盘: 链接: http://pan.baidu.com/s/1gd9yPyF 密码: zvcs OK无论你是自己下载的还是通过我的网盘下载到zip包,首先我们解压一下,通过终端找到  phone-2.9.1