前端需要知道:App开发的最佳跨平台框架

更新日期: 2021-06-13阅读: 3.9k标签: app

当今移动端主要有安卓、IOS,以及最新的鸿蒙等系统,作为企业而言,尤其是中小企业在低成本的情况下,如何实现多端兼容,快速开发?这篇文章主要介绍当前比较常用的跨平台应用开发框架,跨平台应用程序框架使开发人员能够通过一次性编码建立移动应用程序,并以最小的改动在多个平台上运行。


Uniapp

uni-app 是一个使用 vue.js 开发所有前端应用的框架,开发者编写一套代码,可发布到iOS、Android、Web(响应式)、以及各种小程序(微信/支付宝/百度/头条/QQ/钉钉/淘宝)、快应用等多个平台。

优点:
uni-app是一套可以适用多端的开源框架,一套代码可以同时生成ios,Android,H5,微信小程序,支付宝小程序,百度小程序等。

uni-app对前端开发人员比较友好,学习成本比较低,首先uni-app是基于vue.js的。其次封装的组件和微信小程序的组件一毛一样,所以对于现在的主流前端人员来说学习几乎0成本,如果你作为一个前端,没有接触过vue和微信小程序的话那建议你多去加加油了。

uni-app使用HBX进行开发,HBX对于vue语法等支持可以说是比较完备了。使用HBX进行开发可以说是速度杠杠的。开发速度比较快,ps:虽然我是一个vscode党,但是也还是不得不说HBX做的也很不错了。

uni-app拓展能力强,封装了H5+,支持nvue,也支持原生Android,ios开发。可以将原有的移动应用和H5应用改成uni-app应用。

缺点:
uni-app问世的时间还比较短,有很多地方还不是完善,坑很多,如果不喜欢爬坑的朋友那就少用uni-app吧。

对于使用中的一些bug及问题,官方回应的不是很及时。不过可以加一下qq群或者去社区和其他uni-app开发者一起讨论。

开发工具

HBuilderX 

地址:

https://uniapp.dcloud.io/


Taro

Taro 是一个开放式跨端跨框架解决方案,支持使用 react/Vue/Nerv 等框架来开发 微信 / 京东 / 百度 / 支付宝 / 字节跳动 / QQ 小程序 / H5 / RN 等应用。
现如今市面上端的形态多种多样,Web、React Native、微信小程序等各种端大行其道。当业务要求同时在不同的端都要求有所表现的时候,针对不同的端去编写多套代码的成本显然非常高,这时候只编写一套代码就能够适配到多端的能力就显得极为需要。

Taro 3 可以支持转换到 H5、ReactNative 以及任意小程序平台。

目前官方支持转换的平台如下:

  • H5
  • ReactNative
  • 微信小程序
  • 京东小程序
  • 百度小程序
  • 支付宝小程序
  • 字节跳动小程序
  • QQ 小程序
  • 钉钉小程序
  • 企业微信小程序
  • 支付宝 IOT 小程序

地址:

https://taro.aotu.io/


Flutter

Flutter 是最新的跨平台应用程序框架之一,由 Google 开发并于 2017 年发布。Flutter是一个免费的开源跨平台框架,它允许你用一组代码创建一个移动应用程序。它的独特之处在于它使用Dart编程语言,不同于其他跨平台应用框架,Flutter根本不使用JavaScript。

你可以改变你的代码并实时看到结果,只需片刻就可以升级应用程序。您可以使用Flutter为iOS、Android和其他不太流行的移动平台创建跨平台的移动应用程序。平心而论,就目前而言,这是为 Fuchsia OS 开发应用程序的唯一途径。

优点:

Flutter 自带图形引擎,这意味着无需为 iOS 和 Android 分别制作界面。

Dart 使您能够编写额外的结构化程序代码,从而允许您创建更多层次结构和复杂功能。

基于 Flutter 的移动应用程序快速高效。与其他跨平台应用程序框架相比,Flutter 提供了更显着的性能提升。

开发工具:

Emacs

VS Code

Android Studio

地址:

https://flutter.dev/


React Native

React Native 是另一个流行的跨平台应用程序开发框架。它与 iOS 和 Android 兼容。React Native 于 2015 年初由 Facebook 开发,并由其自己的社区不断改进。它是用 React 构建的,不使用 WebView 或 html 技术。它不是 HTML,而是 JSX 中的平台组件,而不是 css,它有类似 CSS 的 polyfill。此外,也没有 dom api。React Native 由 JavaScript 和 React.JS 的组合组成。此外,它允许开发人员使用 Swift、Java 或 Objective-C 开发某些部分。

优点:

React Native 专注于用户界面,使应用程序开发人员能够构建高度可靠的界面。

允许为各种平台创建应用程序,例如 iOS、macOS、tvOS、Web、Windows、Android、Android TV 和 UWP。

开发工具:

JS编辑器

SDK, Android Studio, Emulator

地址:

https://reactnative.dev/


Xamarin

Xamarin 是一个免费的开源跨平台应用程序框架,类似于 React Native。它于 2011 年作为独立平台创建,但五年后被微软收购。

Xamarin 与大多数跨平台框架不同,它基于 Mono,这是 .NET 平台的开源实现。此实现带有自己的 C# 编译器、运行时和 .NET 核心库。该项目的目标是使 C# 程序能够在 Windows 以外的操作系统上运行,例如 Unix 和 Mac OS。

优点:

与其他跨平台应用程序开发框架不同,Xamarin 使用起来相对简单,因为所需的只是 C# 和 .NET 环境的工作知识。

有一个由公司和贡献者组成的大型社区。

免费和开源框架。

开发工具:

Xamarin Studio

Visual Studio Code

地址:

https://visualstudio.microsoft.com/xamarin/


NativeScript

它是一个开源跨平台框架,可让您使用 XML、CSS 和 JavaScript 开发跨平台应用程序。NativeScript 应用程序可以使用任何可转换为 JavaScript 的语言构建,例如 TypeScript,它还支持 angularJS 和 Vue.js。NativeScript 兼容 iOS 和 Android 平台。与其他跨平台框架不同,NativeScript 不需要安装任何插件来访问相机、GPS 等。

优点:

NativeScript 预装了大量插件,无需第三方插件。

它有一个可爱的平台原生 UI,无需使用 WebView 即可访问。

NativeScript 支持 AndroidArsenal 和 Cocoapods 组件,以及从库资源调用原生方法。

开发工具:

CLI NativeScript

地址:

https://nativescript.org/


PhoneGap

PhoneGap 是一个出色的跨平台应用程序开发框架。Nitobi软件在2005年创建了它,Adobe在2011年收购了它。PhoneGap 基于 JavaScript、CSS3 和 Html5 构建,使其对 Web 和应用程序开发人员非常友好。它还支持广泛的平台,从 iOS 和 Android 到 Windows、Blackberry 和 Bada。

它有一个强大的后端系统,可以极大地加速开发,它更适合创建不严重依赖原生手机功能的简单移动应用程序。

优点:

该框架支持通过适用于 Android 的 Google Play 和适用于 iOS 的 App Store 在应用程序中使用嵌入式支付系统。

为了管理交互,移动应用程序开发人员可以使用旧版 JavaScript 或其他库,例如 Prototype、jquery、MooTools、Sencha Touch 等。

使用 PhoneGap 创建的应用程序在不同平台之间仅略有不同。

PhoneGap 由最常见和最广泛使用的Web技术操作,包括 JavaScript、CSS3 和 HTML5。

地址

https://cordova.apache.org/


Weex

Weex 是一个可以使用现代化的 Web 技术开发高性能原生应用的框架。Weex 致力于使开发者能基于通用跨平台的 Web 开发语言和开发经验,来构建 Android、iOS 和 Web 应用。简单来说,在集成 WeexSDK 之后,开发者可以使用 JavaScript 语言和前端开发经验来开发移动应用。

目前Weex 从 Apache Incubator 退休并不意味着停止维护,仅表示它不再在 Apache Incubator 中开发(与 TLP 项目移动至 Attic 类似),详情查看 Guide to Retirement:https://incubator.apache.org/guides/retirement.html

地址:

http://weex.apache.org/


链接: https://www.fly63.com/article/detial/10423

APP和小程序互相跳转

随大流吧。微信小程序出了这么久,现在才学习下。app和小程序互相跳转:1、App主动发起小程序卡片分享到微信,微信点击打开小程序,这时的小程序可以打开App,2、App主动发起打开小程序,这时的小程序可以打开App

几种常见的APP开发模式的优缺点

常见的开发模式有6种(Native App,Web App,Hybrid App,Weex,React Native、Flutter)

在H5中唤起APP,唤起失败进入APP下载页

在H5中唤起APP原理:通过Scheme协议打开APP,Scheme的组成:scheme:path[#fragment],直接使用协议打开APP,打开失败进入下载页

创建一个成功的App前要考虑的5个要点

在智能机时代,相比浏览网页而言,人们一般更喜欢喜欢使用手机应用。这种趋势就导致了成千上万的APP在Google Play 和 Apple Store 平台的诞生。有一些企业想要通过创建APP去提升他们的业务,其他人也想要通过创建APP去获得收益

前端实现iPhone绕过AppStore从浏览器安装App

都知道 iPhone 苹果手机应用只能通过 AppStore 进行安装,测试包只能通过官方提供的 TestFlight 等工具安装,而且通常有较长的审核流程,无法及时更新安装包

H5如何实现唤起APP

写过hybrid的同学,想必都会遇到这样的需求,如果用户安装了自己的APP,就打开APP或跳转到APP内某个页面,如果没安装则引导用户到对应页面或应用商店下载

ios获取app url地址 - 如何获取苹果appstore的应用链接?

在AppStore,每个应用都会有一个AppleID,包括还没有上线的应用。打开AppStore,点开我们的App,就会在网址上看到一串数字,这一串数字就是我们的Apple ID了。

一款 IOS 端休闲益智类,数字小游戏集

益智小游戏有哪些?休闲益智小游戏一直以来都深受玩家的喜爱,它不仅有趣,还能锻炼玩家的思维能力,今天小编就为大家带来了一款IOS益智数字类小游戏集,APP界面简洁,满足你的逻辑挑战,体验数字的魅力

H5 如何实现唤起 APP

写过hybrid的同学,想必都会遇到这样的需求,如果用户安装了自己的APP,就打开APP或跳转到APP内某个页面,如果没安装则引导用户到对应页面或应用商店下载。这里就涉及到了H5与Native之间的交互,为什么H5能够唤起APP并且跳转到对应的页面?

个人如何申请软著

目前软著已实行无纸化,不需要再邮寄纸质材料,但是之前需要邮寄的申请表还是需要盖章或签字电子版上传。实行无纸化之后的首批证书还没有下发,所以具体的下证率,加急的下证情况也都不清楚

点击更多...

内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权或违规,请与小编联系!情况属实本人将予以删除!