引擎盖下的混合应用程序开发(PhoneGap，Cordova，Ionic) [英] Hybrid application development (PhoneGap, Cordova, Ionic) under the hood

问题描述

我正试图了解一切工作原理，但是对此主题有一些疑问.

I am trying to understand how everything works, but have some questions about this topic.

我将解释我如何理解这些内容.

I will explain how I understand this stuff.

首先让我们从Cordova开始，这是一个将JS，CSS，HTML文件转换为本地应用程序的平台.但是请停止，这不完全是事实.
实际上，它只是将所有html，css文件放入资产文件夹中，而该平台所做的只是创建针对该平台的自定义WebView，对其进行配置，将所有必需的插件绑定到该文件并设置默认页面为打开状态.
除平台插件提供的钩子方法外，其他所有内容都只是Web开发，该方法可通过来自WebView的java调用来帮助访问本机功能，例如GPS，Camera. 因此，所有其他内容都取决于特定的本机Web核心，以处理和支持诸如HTML5，CSS3之类的功能...例如，如果特定android版本的WebKit实现不支持此类功能，则您将无法执行某些操作以使其正常运行，而不是更新Android的低级内核.

First of all lets start from Cordova this is platform that translates JS,CSS,HTML files into native app. But stop this is not exactly the true.
Really it just puts all html, css files into asset folder only thing that such platform does is creates custom WebView specific for the platform, configures it, binds all required plugins to it and sets default page to open.
Everything else is just web development except hook methods provided by platform plugins which help to access native features like GPS,Camera through java calls from WebView.
So all other stuff is up to specific native web-core to handle and support features like HTML5, CSS3 ... If for example WebKit implementation of specific android version doesn't support such features, you cannot do something to get it working rather than update low level core of Android.

所以我有以下问题.

1. 什么是平台，例如Onsen UI，Ionics，Sencha ...官方网站上说HTML5 Hybrid Mobile App Framework and UI Components for PhoneGap & Cordova.为什么在所有地方都使用关键字HTML5，这仅仅是本机浏览器核心的功能，如果浏览器不支持所有这些平台，并且框架没有用的话.

1. What are platforms like Onsen UI, Ionics, Sencha ... Official websites say HTML5 Hybrid Mobile App Framework and UI Components for PhoneGap & Cordova. Why keyword HTML5 is used everywhere, this is just feature of native browser core nothing more, if browser doesn't support all these platfroms and frameworks are useless.

这些平台提供的特殊功能是Mobile-hybrid specific.我知道PhoneGAp和Cordova提供了用于与本机API通信的插件和一些代理，但是在UI frameworks情况下，这只是css，js，html文件?为什么我不能在默认的PC浏览器中使用它们?

What do special these platform provide to be Mobile-hybrid specific. I understand that PhoneGAp and Cordova provides plugins and some proxies for communicating with native API, but in case of UI frameworks this is just css,js, html files ? Why I can't use them in default PC browser ?

例如通过npm例如npm install onsenui来安装这样的平台和框架的目的是什么，为什么我不能仅将js文件简单地复制到我的项目目录中?我了解到某些平台使用css-preprocessors将伪css文件编译为css文件，但是在没有此类工具的情况下.

What is the purpose of installing such platform and frameworks for example through npm for instance npm install onsenui, why I can't just simple copy js files to my project directory ? I understand that some platforms use css-preprocessors to compile pseudo-css files into css files, but in case of absence of such tools.

请告诉我我哪里错了，并回答我的问题.我将不胜感激

Please tell me where I am wrong and answer my questions. I would be grateful for any help

推荐答案

1)您在第一个问题中提到的所有库/框架都有些不同.

1) All of the libraries / frameworks you mentioned in your first question are a little different.

• Ionic提供了可在混合应用程序中使用的UI框架(即控件)以及与提供的UI控件进行交互的角度服务.从本质上讲，它为您提供了一个完整的堆栈，可在其中构建混合应用程序.

• Ionic provides a UI framework (i.e. controls) to be used in hybrid apps as well as angular services to interact with the UI controls provided. It essentially gives you an entire stack on which to build you hybrid app.

Onsen UI是另一个UI框架，与Ionic相比，它更小且与库无关. Onsen确实为其UI提供了Angular绑定和服务，但也可以与普通的旧式JS或jQuery一起使用.即将发布的版本还支持React绑定.

Onsen UI is another UI framework smaller and slightly more library agnostic than Ionic. Onsen does provide Angular bindings and services for their UI, but also works with plain old vanilla JS or jQuery. The upcoming version also supports React bindings.

我不能对Sencha说太多(我没有使用过)，但是它也是UI框架.但是，Snecha使用他们自己的称为ExtJS的JS框架.

I cannot say too much about Sencha (I have not used it), but it is as well UI framework. Snecha, however, uses their own JS framework called ExtJS.

使用关键字 HTML5 更有可能宣传UI框架正在使用现代Web技术(Flexbox等).我(如果我错了，请有人纠正我)相信这可能只是一种营销策略.

The use of the keyword HTML5 is more likely to advertise that the UI framework is using modern web technologies (Flexbox, etc.). I (and please someone correct me if I'm wrong) believe that that may be just a marketing ploy.

2)从技术上讲，没有一个是 Hybrid特定的.您认为它们可以在桌面浏览器环境中使用是正确的.话虽如此，UI组件是为移动设备设计的，在台式机上看起来并不吸引人.它们最适合混合应用程序和移动Web应用程序. Ionic甚至在推动渐进式Web应用程序的发展，并计划扩展对台式机(包括电子设备)的支持.

2) Technically, none are Hybrid specific. You are correct in believing that they can be used in a desktop browser environment. That being said, the UI components are designed for mobile and would not look very appealing on desktop. They are best suited for Hybrid apps and mobile web apps. Ionic is even pushing for progressive web apps and plans on extending support for desktop (including electron).

3)通过包管理器安装这些框架也很方便.您可以轻松地将文件复制过来(Ionics的网站说明您可以执行此操作).并手动编译样式，但要使其正常工作还需要更多的工作.有些工具(例如Ionic)通过NPM安装了CLI，但是该框架通常是通过Bower安装的.当发布新版本时，它也使升级变得容易.总体而言，您可能会问，为什么对任何语言/平台都使用包管理器，这取决于组织和便利性.

3) Installing these frameworks via a package manager is a matter of convenience as well. You easily could copy the files over (Ionics's website explains that you can do this). and manually compile the styles, but it's more work to get things working correctly. Some, like Ionic have a CLI installed through NPM, but the framework is typically installed via bower. It also makes it easy to upgrade when a new version is released. Overall, you could ask, why use package managers for any language / platform, and it comes down to organization and conveniences.

我希望我回答了您所有的问题，如果没有，请发表评论.

I hope I answered all your questions, and if not please leave a comment.

这篇关于引擎盖下的混合应用程序开发(PhoneGap，Cordova，Ionic)的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！