uni-app x,一个纯原生的Android App开发工具

uni-app x,下一代uni-app,一个神奇的产品。

用vue语法、uni的组件、api,以及uts语言,编译出了kotlin的app。不再使用js引擎和webview。纯纯的kotlin原生app。

uni-app x,让“跨平台开发性能不如原生”的这条曾广为流传的规则,扔进了历史的垃圾桶!

uni-app x原理简析

uni-app x整体推到你面前时,你可能觉得难以想象,怎么可能编译为纯原生App?uni-app过去之所以能跨平台,是因为js是跨平台的啊。

所谓,成也萧何败也萧何,而uni-app过去在app上性能不如原生,也很大程度是因为js和原生的交互通信阻塞问题。

简述下uni-app x的原理。

其实uni-app x使用的不是js,而是DCloud在2022年发布的uts语言。这是一种基于ts改造的语言,改造的目的就是让它可以全平台编译。

我们知道js和原生语言的差异性主要在于类型动态性。而ts已经为js提供了类型。uts是在ts的基础上,融合kotlinswift的特性,抽象出了一套全平台可用的编译型语言。

uts在不同平台,编译为不同的产物:

  • 在Web中编译为js
  • 在iOS中编译为swift
  • 在Android中编译为kotlin

然后DCloud又基于uts开发了uvue的ui引擎,可使用vue语法来开发界面,再补上uni的组件和api,最终形成了你目前看到的uni-app x。

让你使用熟悉的代码、跨平台的方式,却能写出和原生的功能性能完全一致的app。

而且有趣的是,我们与原生开发者交流,发现使用uni-app x开发应用,比原生开发要快非常多。

案例

很多开发者都在关注着uni-app x,等待先行者趟坑。

这几个月来,很多先行者已经发布了他们的基于uni-app x的产品。而HBuilderX也发布了里程碑的3.98正式版,已经可以支撑商业应用。

快亿商城

这是一个云端一体的、完整的电商项目。客户端、服务器,甚至还包括管理端:快亿商城管理端

640.jpeg

t-uvue-ui

这是一个丰富的ui库,解救那些不擅长界面的开发者。当然即便是擅长界面开发的,使用这个组件库也能提升不少开发效率。

ux-02.jpeg

ux-03.jpeg

快速体验

欢迎你也来体验uni-app x这个神奇的产品:用你熟悉的代码,开发出原生的Android App。

<template><view class="content"><button @click="buttonClick">{{title}}</button></view>
</template><script> //注意这里编写的是uts,是ts的变种export default {data() {return {title: "Hello world"}},onLoad() {console.log('onLoad')},methods: {buttonClick: function () {uni.showModal({"showCancel": false,"content": "点了按钮"})}}}
</script><style>.content {width: 750rpx;background-color: white;}
</style>

体验uni-app x的真实效果,在外部浏览器里下载hello uni-app x的apk,或扫描下方二维码。

ux-04.png

hello uni-app x 演示了uni-app x目前支持的所有内置组件、API、以及诸多页面模版。

ux-05.jpeg

质量

uni-app x从源头重视产品质量,第一个版本就支持自动化测试。并已为uni-app x产品编写了几十个测试工程、数十万行测试例代码。

虽然这些工作导致uni-app x初期的迭代速度变慢。但让uni-app x的质量水平大幅提升。每天晚上DCloud内部众多机器在运行这些自动化测试代码,除了监控质量,还在监控启动速度、包体积大小、内存占用等各种关键指标。

插件大赛及生态

由于uts编译为kotlin,也就是kotlin在Android上能用的api、能用的三方sdk,uni-app x里都可以用。

<script>import Build from 'android.os.Build';export default {onLoad() {console.log(Build.MODEL); //调用原生对象,返回手机型号console.log(uni.getSystemInfoSync().deviceModel); //调用uni API,返回手机型号。与上一行返回值相同}}
</script>

 

上面的示例,在页面启动时打印了2行日志,显示手机型号。

  • uni.getSystemInfoSync,是uni的api
  • import的Build,是Android os的api

在uni-app x里,可以直接调用os的能力,不受限制,语法是uts的语法,但需要了解什么功能在原生里是哪个api。

使用uni.getSystemInfoSync则比较简单,看uni的文档即可,且可跨平台。

其实,uni.getSystemInfoSync 的内部实现就是一个uts模块,底层使用了一样的代码,也是import了android.os.Build。

uni.的api,大多是uts开发的,它们都开源在uni-api仓库

uni-app x作为一个原生应用,自然可以使用原生的各种sdk,包括flutter、react native、cocos、unity等原生sdk,均可集成使用。

在插件市场,有基于uni-app x的各种作品。

DCloud官方的:

  • App升级中心
  • uni-id-pages-x

三方项目:

  • 快亿商城,云端一体完整的电商项目,还包括管理端:快亿商城管理端
  • 考试答题模板
  • 短视频模板

ui库:

  • t-uvue-ui :丰富的组件库
  • easyX电商组件库:电商业务常见的各种组件库

还有各种原生扩展的ui组件和api插件。

目前已有数百款适配uni-app x的插件。

随着插件大赛的开展,uni-app x周边生态在如火如荼的丰富中。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://xiahunao.cn/news/2776327.html

如若内容造成侵权/违法违规/事实不符,请联系瞎胡闹网进行投诉反馈,一经查实,立即删除!

相关文章

CSP-202109-1-数组推导

CSP-202109-1-数组推导 解题思路 如果 currentValue 与 previousValue 相同&#xff0c;说明这个值不是一个独特的新值&#xff0c;因此只将它加到 sumTotal 上。如果 currentValue 与 previousValue 不相同&#xff0c;说明这是一个新的独特值&#xff0c;因此既将它加到 su…

EMC学习笔记(二十三)降低EMI的PCB设计指南(三)

双层板电源分配 1.单点与多点分布2.星型分布3.创建网格平面4.旁路和磁珠5.将噪声保持在芯片附近 tips&#xff1a;资料主要来自网络&#xff0c;仅供学习使用。 1.单点与多点分布 在一个真正的单点配电系统中&#xff0c;每个有源元件都有自己独立的电源和地&#xff0c;这些…

让AI更“智能”的Agent,究竟是什么?

引言 我相信对许多对AI感兴趣的读者来说&#xff0c;“Agent”是个听起来既熟悉又陌生的词汇&#xff0c;而由于ChatGPT引发的浪潮又将Agent的概念推上顶峰&#xff0c;正好借助这个机会我来好好解释一下这个词汇。 Agent的基本含义 在AI领域&#xff0c;Agent基本可以被理解…

蓝桥杯备赛Day9——链表进阶

给你一个链表,删除链表的倒数第 n 个结点,并且返回链表的头结点。 示例 1: 输入:head = [1,2,3,4,5], n = 2 输出:[1,2,3,5]示例 2: 输入:head = [1], n = 1 输出:[]示例 3: 输入:head = [1,2], n = 1 输出:[1]提示: 链表中结点的数目为 sz1 <= sz <= 300 &l…

心情切换器(仅供娱乐)

本次分享主要内容较为新奇&#xff0c;作用程度可以说没用&#xff0c;仅供娱乐(注&#xff1a;本次成果使用的为vue框架实现) 一、静态及呈现图 <div class"switchMood"><h2>心情转换器</h2><!--输入当前心情表单--><div class"fr…

Project 2010下载安装教程,保姆级教程,附安装包和工具

前言 Project是一款项目管理软件&#xff0c;不仅可以快速、准确地创建项目计划&#xff0c;而且可以帮助项目经理实现项目进度、成本的控制、分析和预测&#xff0c;使项目工期大大缩短&#xff0c;资源得到有效利用&#xff0c;提高经济效益。软件设计目的在于协助专案经理发…

PlantUML绘制UML图教程

UML&#xff08;Unified Modeling Language&#xff09;是一种通用的建模语言&#xff0c;广泛用于软件开发中对系统进行可视化建模。PlantUML是一款强大的工具&#xff0c;通过简单的文本描述&#xff0c;能够生成UML图&#xff0c;包括类图、时序图、用例图等。PlantUML是一款…

k8s 部署java应用 基于ingress+jar包

k8 集群ingress的访问模式 先部署一个namespace 命名空间 vim namespace.yaml kind: Namespace apiVersion: v1 metadata:name: ingress-testlabels:env: ingress-test 在部署deployment deployment是pod层一层封装。可以实现多节点部署 资源分配 回滚部署等方式。 部署的…

Docker部署前端项目

某次阿里云的自动流水线失败了&#xff0c;代码本地跑起来莫得问题&#xff0c;错误日志提示让我跑一下npm run build &#xff0c;但是俺忽然发现&#xff0c;我跑了&#xff0c;文件打包好了&#xff0c;但是往哪里运行呢&#xff1f;这涉及到要构建一个环境供打包文件部署吧…

运维高级篇-分库分表(拆分策略详解)

分库分表 介绍 问题分析 随着互联网及移动互联网的发展&#xff0c;应用系统的数据量也是成指数式增长&#xff0c;若采用单数据库进行数据存 储&#xff0c;存在以下性能瓶颈&#xff1a; IO瓶颈&#xff1a;热点数据太多&#xff0c;数据库缓存不足&#xff0c;产生大量磁盘…

【前端web入门第四天】01 复合选择器与伪类选择器

文章目录: 1. 复合选择器 1.1 后代选择器 1.2 子代选择器 1.3 并集选择器1.4 交集选择器(了解) 2.伪类选择器 2.1 伪类-文本2.2 伪类-超链接&#xff08;拓展) 1. 复合选择器 什么叫复合选择器? 由两个或多个基础选择器&#xff0c;通过不同的方式组合而成。 复合选择器的作…

基于微信小程序的校园失物招领小程序

博主介绍&#xff1a;✌程序员徐师兄、7年大厂程序员经历。全网粉丝12w、csdn博客专家、掘金/华为云/阿里云/InfoQ等平台优质作者、专注于Java技术领域和毕业项目实战✌ &#x1f345;文末获取源码联系&#x1f345; &#x1f447;&#x1f3fb; 精彩专栏推荐订阅&#x1f447;…

【JavaEE】_传输层协议UDP与TCP

目录 1. 开发中常见的数据组织格式 1.1 XML 1.2 JSON 1.3 Protobuf 2. 端口号 3. UDP协议 4. TCP协议 4.1 特点 4.2 TCP报文格式 4.3 TCP可靠性机制 4.3.1 确认应答机制 4.3.2 超时重传机制 4.3.2.1 丢包的两种情况 4.3.2.2 重传时间 4.3.3 连接管理机制 4.3.3…

肯尼斯·里科《C和指针》第13章 高级指针话题(3)命令行参数

处理命令行参数是指向指针的指针的另一个用武之地。有些操作系统&#xff0c;包括UNIX和MS-DOS&#xff0c;让用户在命令行中编写参数来启动一个程序的执行。这些参数被传递给程序&#xff0c;程序按照它认为合适的任何方式对它们进行处理。 13.4.1 传递命令行参数 这些参数如何…

在计算机/移动设备上恢复已删除视频的 10 个数据恢复工具

视频在网上疯传&#xff0c;我们都观看或创建视频&#xff0c;并将我们最喜欢的视频保存在硬盘上。如果我们丢失了一些重要的视频&#xff0c;那将是非常令人心碎的。但是今天&#xff0c;恢复已删除的视频变得更加容易。删除的视频在被新数据覆盖之前并没有真正从您的存储驱动…

OpenSSL 创建自签名证书

前言 Openssl 是一个方便的实用程序,用于创建自签名证书。您可以在所有操作系统(如 Windows、MAC 和 Linux 版本)上使用 OpenSSL。 自签名证书 创建我们自己的根 CA 证书和 CA 私钥(我们自己充当 CA)创建服务器私钥以生成 CSR使用我们的根 CA 和 CA 私钥创建具有 CSR 的…

Redis 单线程

文章目录 Redis单线程架构Redis 单线程访问速度IO多路复用原理 Redis单线程架构 Redis的单线程架构的效果为&#xff1a;Redis的单线程是对于服务端而言的&#xff0c;Redis允许多个Redis用户端同时在线操作&#xff0c;但同时只有一个用户端在和服务端交互。多个用户同时发送…

centos7的git使用方法

下载git yum install git git克隆 git clone https...(图片中复制的内容) git提交到远程仓库 git add filename git commit -m "提交日志" git push git首次使用要配置邮箱和用户名 查看提交日志 git log 查看当前提交状态 git status

人力资源智能化管理项目(day04:组织架构)

学习源码可以看我的个人前端学习笔记 (github.com):qdxzw/humanResourceIntelligentManagementProject 觉得有帮助的同学&#xff0c;可以点心心支持一下哈 树组件应用 <!-- 展示树形结构 --><!-- default-expand-all默认展开所有节点 --><el-tree default-ex…

黄金交易策略(EA):三个仓位的设计是确保可以不停息做单

完整EA&#xff1a;Nerve Knife.ex4黄金交易策略_黄金趋势ea-CSDN博客