[TOC]
# SPA 库
Examples of SPA libraries you can use in your Cordova applications are:
[Monaca](http://monaca.mobi/en/)
[Angular](http://angular.cn/)
[VUE](https://vuejs.org/)
[ReactJS](https://reactjs.org/)
[Kendo UI](http://www.telerik.com/kendo-ui)
[EmberJS](http://emberjs.com/)
当然,还有很多很多其他库
# 关于性能
1. 点击vs触摸
最大和最简单的错误是使用点击事件。虽然这些“工作”在移动设备上运行得很好,但大多数设备都会对它们施加300毫秒的延迟,以便区分触摸和触摸“保持”事件。使用 `touchstart` 或 `touchend` 会带来显着的改进 - 300毫秒听起来并不多,但它可能导致不稳定的UI更新和行为。您还应该考虑非webkit浏览器不支持“触摸”事件的事实,请参阅[CanIUse](http://caniuse.com/#search=touch)。为了解决这些限制,您可以查看HandJS和Fastclick等各种库。
2. CSS转换与DOM操作
使用硬件加速CSS转换将比使用JavaScript创建动画要好得多。有关示例,请参阅本节末尾的参考资料列表。.
3. 糟糕的网络
移动网络的延迟,甚至是好的移动网络,都比你想象的要糟糕得多。一个桌面应用程序,每隔30秒就会发出500行JSON数据,在移动设备和电池上都要慢一些。请记住,Cordova应用程序有多种方法可以在应用程序中保留数据(例如LocalStorage和 文件系统 )。在本地缓存该数据并了解您来回发送的数据量。当您的应用程序通过蜂窝网络连接时,这是一个特别重要的考虑因素。
4. 其他性能文章和资源
* ["You half assed it"](http://sintaxi.com/you-half-assed-it)
* ["Top Ten Performance Tips for PhoneGap and Hybrid Apps"](http://coenraets.org/blog/2013/10/top-10-performance-techniques-for-phonegap-and-hybrid-apps-slides-available/)
* ["Fast Apps and Sites with JavaScript"](https://channel9.msdn.com/Events/Build/2013/4-313)
# 识别并处理离线状态
请参阅前面有关网络的提示。您不仅可能会使用慢速网络,而且您的应用程序可能完全的离线。您的应用程序应以智能方式处理此问题。如果您的应用程序没有,人们会认为您的应用程序已损坏。考虑到处理起来容易(Cordova支持同时监听离线和在线事件),您的应用程序绝对没有理由在离线运行时不能很好地响应。
请务必测试(请参阅下面的“测试”部分)您的应用程序,并确保测试应用程序在一个状态下启动然后切换到另一个状态时的处理方式。
请注意,在线和离线事件以及网络连接API并不完美。您可能需要依赖于使用XHR请求来查看设备是真正脱机还是在线。在一天结束时,请确保为网络问题添加某种形式的支持 - 事实上,Apple商店(可能还有其他商店)将拒绝不能正确处理离线/在线状态的应用程序。有关此主题的更多讨论,请参阅["Is This Thing On?"](http://blogs.telerik.com/appbuilder/posts/13-04-23/is-this-thing-on-%28part-1%29)
# 调试Cordova程序
## IOS 调试
一旦您的应用程序在设备上启动并运行,您就可以调出Safari的Web检查器(如下所述)来调试应用程序的webview和js端。有关更多详细信息,请参阅[Apple支持](https://developer.apple.com/support/debugging/)文档。
## Chrome远程调试
使用 `chrome://inspect` 来调试,然后打开 Chrome Dev Tools。
使用 Chrome Dev Tools 调试 iOS apps,通过WebKit代理:https://github.com/google/ios-webkit-debug-proxy/
# 用户界面
许多人选择使用UI框架来简化这一过程。下面是你可能想考虑的一些选择。
[ionic](http://ionicframework.com/) - This powerful UI framework actually has its own CLI to handle project creation.
[Ratchet](http://goratchet.com/) - Brought to you by the people who created Bootstrap.
[Kendo UI](http://www.telerik.com/kendo-ui) - Open source UI and application framework from Telerik.
[Topcoat](http://topcoat.io/)
[BIN](https://github.com/BuildItNow/BIN_Documents)
具有iOS风格UI的Android应用程序可能不会很好地适应用户。这有时甚至由各种应用程序商店强制执行。因此,您必须尊重每个平台的惯例,因此熟悉各种人机界面指南:
* [iOS](https://developer.apple.com/library/ios/documentation/userexperience/conceptual/MobileHIG/index.html)
* [Android](http://developer.android.com/design/index.html)
* [Windows Phone](https://dev.windows.com/en-us/design)
# 其他的考虑
## 平台怪癖
阅读文档时,请查看在多个平台上概述不同行为或要求的部分。
这些内容将在标题为“Android Quirks”,“iOS Quirks”等的部分中。阅读这些怪癖,并在使用Cordova时最好了解它们。
## 加载远程内容
应使用Cordova的InAppBrowser在webview中显示远程加载的HTML内容。 InAppBrowser的设计使得在那里运行的JavaScript由于上面列出的原因无法访问Cordova JavaScript API。请参阅[安全指南](http://cordova.apache.org/docs/en/latest/guide/appdev/security/index.html)。
# Help
StackOverflow: http://stackoverflow.com/questions/tagged/cordova
- PWA 概念
- Immutable
- Angular 基础概念
- 入门参考
- Angular 更新总结
- Angular 生态系统
- Rx.js
- Ngrx
- CQRS/ES 模式
- Angular 5 详解
- 测试
- 定义共享模块
- 懒路由加载
- angular组件
- 双向绑定及变化检测
- 样式
- ionic 3详解
- ionic3
- ionic 插件
- Ionic 添加动画
- Ghost-Loading
- 打包发布
- Android上架国内应用市场流程
- 总结
- 文章
- 问题合集
- Cordova
- 插件开发指南
- Android插件开发指南-官网
- IOS插件开发指南-官网
- Hooks 编写
- 桥接技术
- ===cordova插件收集===
- 相关主题-官网
- 实战-自定义插件流程
- UI 及 相关资源