最近预研了许多webApp相关知识，包括H5+，mui,react native相关知识，觉得有必要写下部分感悟，因此诞生了此篇文章，不足之处，请大家及时指出，希望能对有同样需求的你带来帮助.
使用前端开发app方法
使用html5+jss+css+打包技术开发
Cordova（phoneGap） 这个玩意比较重量级,不过反编发现还是有部分app是这种开发模式的
Hbuilder（一种编译工具 提供有app的开发API html5+ 以及UI框架 mui）
webApp vs hybirdApp vs nativeApp
Native App的优势
- 提供最佳的用户体验，最优质的用户界面，最华丽的交互
- 针对不同平台提供不同体验
- 可节省带宽成本
- 可访问本地资源
- 盈利模式明朗
Native App的劣势
- 移植到不同平台上比较麻烦
- 维持多个版本的成本比较高
- 需要通过store或market的确认
Web App的优势
- 开发成本低
- 适配多种移动设备成本低
- 适配多种移动设备成本低
- 迭代更新容易
- 无需安装成本
Web App的劣势
- 浏览的体验短期内还无法超越原生应用
- 不支持离线模式(html5将会解决这个问题)
- 消息推送不够及时
- 消息推送不够及时
如何选择
- 偏交互的native, 偏浏览的web（交互是指复杂的操作）
- 已稳定的native, 试错中的web（h5开发成本比原生低）
- 访问硬件native, 信息展示Web（当然现在有框架可以直接调用原生设备）
- 核心功能native, 辅助性的web
- 上述摘自知乎
其实上面都是废话 了解就可，闲的话可以研究下 🙃
介绍下Hbuilder
由于之前项目使用需求使用Hbuilder进行开发 所以下面就大概讲解下Hbuilder开发的相关知识。
原理
- html负责页面，也就是的内容和框架；
- js负责调用方法，也就是调用一些移动端原生；
- ui负责样式，比较有名的bootstrap，amazeui，jQuery mobile，mui
下面是ui选用mui的一个的项目结构
- Common包下为项目使用到的一些样式（mui.css），字体样式（fonts），和一些mui框架提供的一些控件需要用到的js和css
Img包下为使用的图片资源 - Models包下为当前项目的不同模块，项目的界面和逻辑处理就在这个包下
- Index为项目默认的应用入口界面
- Manifest为项目图标权限使用的原生的引用相关的配置
初始化创建的项目目录结构可能和上面例子有差别，你可以自己重新构建这个就看公司要求和个人习惯。
至于用法请查看w3c和hbuilder.相关技术不在本篇博客讨论范围.
需要wechat muiApp项目源码请留言.
后续将会发布相关React Native相关开发经验。That`s All.
- Q: 使用h5页面开发app吧，这样不用发版本界面就能更新呀。
- A: 😷 不好意思你说的loadUrl.
