uni-app x 跨平台开发框架

简介: uni-app x 是一个强大的跨平台开发框架uni-app x 是一个庞大的工程,它包括uts语言、uvue渲染引擎、uni的组件和API、以及扩展机制。

uni-app x 是什么

uni-app x 是一个强大的跨平台开发框架

uni-app x 是一个庞大的工程,它包括uts语言、uvue渲染引擎、uni的组件和API、以及扩展机制。

uts是一门类ts的、跨平台的、新语言。uts在iOS端编译为swift、在Android端编译为kotlin、在Web端编译为js。

在Android平台,uni-app x 的工程被编译为kotlin代码,本质上是换了vue写法的原生kotlin应用,在性能上与原生kotlin一致。

uni-app x不支持vue2

uts替代的是js,而uvue替代的就是html和css。或者如果你了解flutter的话,也可以理解为uts类似dart,而uvue类似flutter。

和Flutter对比

在过去的跨平台方案中,逻辑层和ui层的通信始终是痛点。

所以在webview渲染时,增加了renderjs、wxs等技术

所以在nvue渲染时,增加了bindingX技术

所以在skyline渲染时,增加了worklet技术

但这些补丁技术都不治根。过去只有flutter解决了dart和ui层的通信问题。可是这套方案又带来2个问题:

dart和原生层通信也还是有延时,对象传递需要序列化,造成性能问题;

自渲染而不是原生渲染,无可避免会引发混合渲染,比如原生的信息流广告内嵌、原生输入法适配,造成内存高和输入障碍。

其实不管是js还是dart,和原生都有通信桥,功能上没有限制,可以调用各种原生能力,但问题就出在Android上这个通信性能上不去。

既然通信性能不行,那就干脆不通信。

由于uts在Android上被编译为kotlin,它的逻辑层和UI层都是纯原生的,没有通信问题,所以它的性能真正达到了原生水平。因为本质上它就是换了vue写法的原生kotlin应用。

在iOS上,情况要复杂些

 

uts语言

uts替代的是js,而uvue替代的就是html和css。或者如果你了解flutter的话,也可以理解为uts类似dart,而uvue类似flutter。

uvue是一套基于uts的、兼容vue语法的、跨平台的、原生渲染引擎。

Android版于3.99上线

Web版于4.0上线

iOS版于4.11上线

uts和ts很相似,但为了跨端,uts进行了一些约束和特定平台的增补。详见 uts语言介绍

例子如下:

// 声明一个string类型的变量

let str :string = "hello";  

let str1 = 'world';

str = "hello world";

str = str1 as string; // 在不确定类型的时候可以给他一个类型

 

 

// 声明一个传参是数字类型的,返回是boolean类型的函数

const test = (score: number): boolean => {

return (score>=60)

}

 

 

// 也可以自定义数据类型进行类型规范,比如声明一个Page类型

 

type Page = {

   name : string

   enable ?: boolean

   url ?: string.PageURIString

 }

 

// 总的来说,会TypeScript的,这个是没问题的,两个很相像

 

uvue渲染引擎

uvue支持的是vue3语法,支持组合式API和选项式API。详见vue语法

uvue在App端支持的css语法,是web的子集,类似于但优于nvue的css。仅支持flex布局,但也足以布局出需要的界面。详见css语法

使用该css子集,可保证跨端。如果把uvue页面编译到web平台,则web的其他css也都可以使用。

相关文章
|
7月前
|
移动开发 JavaScript 小程序
从入门到实践:Uni-app跨平台开发与应用
从入门到实践:Uni-app跨平台开发与应用
418 1
|
1月前
|
Java 测试技术 持续交付
【入门思路】基于Python+Unittest+Appium+Excel+BeautifulReport的App/移动端UI自动化测试框架搭建思路
本文重点讲解如何搭建App自动化测试框架的思路,而非完整源码。主要内容包括实现目的、框架设计、环境依赖和框架的主要组成部分。适用于初学者,旨在帮助其快速掌握App自动化测试的基本技能。文中详细介绍了从需求分析到技术栈选择,再到具体模块的封装与实现,包括登录、截图、日志、测试报告和邮件服务等。同时提供了运行效果的展示,便于理解和实践。
112 4
【入门思路】基于Python+Unittest+Appium+Excel+BeautifulReport的App/移动端UI自动化测试框架搭建思路
|
6月前
|
开发框架 移动开发 JavaScript
SpringCloud微服务实战——搭建企业级开发框架(四十七):【移动开发】整合uni-app搭建移动端快速开发框架-添加Axios并实现登录功能
在uni-app中,使用axios实现网络请求和登录功能涉及以下几个关键步骤: 1. **安装axios和axios-auth-refresh**: 在项目的`package.json`中添加axios和axios-auth-refresh依赖,可以通过HBuilderX的终端窗口运行`yarn add axios axios-auth-refresh`命令来安装。 2. **配置自定义常量**: 创建`project.config.js`文件,配置全局常量,如API基础URL、TenantId、APP_CLIENT_ID和APP_CLIENT_SECRET等。
254 60
|
4月前
|
Python Windows 内存技术
【Azure 应用服务】Azure App Service (Windows) 使用Flask框架部署Python应用,如何在代码中访问静态文件呢?如何设置文件路径?是相对路径还是绝对路径呢?
【Azure 应用服务】Azure App Service (Windows) 使用Flask框架部署Python应用,如何在代码中访问静态文件呢?如何设置文件路径?是相对路径还是绝对路径呢?
|
6月前
|
开发框架 小程序 前端开发
uni-app前端应用开发框架
uni-app对做移动端开发的来说应该无人不知、无人不晓了吧?!从名字就能看出来这个框架要干啥,unify app——没错,就是统一前端应用开发,不管你是小程序、app、还是H5、公众号,用这个框架都能做。uni-app让开发者编写一套代码,就可以编译为安卓app、ios app、微信小程序、抖音小程序、支付宝小程序等十几个平台,而且马上支持纯血鸿蒙了,这简直是个人、开发工作室、小型开发公司的福音,开发一些常规的app、小程序,用这个框架足够了。
74 7
|
6月前
|
安全 测试技术 网络安全
APP攻防-资产收集篇&反证书检验&XP框架&反代理VPN&数据转发&反模拟器
APP攻防-资产收集篇&反证书检验&XP框架&反代理VPN&数据转发&反模拟器
|
6月前
|
安全 JavaScript 前端开发
kotlin开发安卓app,JetPack Compose框架,给webview新增一个按钮,点击刷新网页
在Kotlin中开发Android应用,使用Jetpack Compose框架时,可以通过添加一个按钮到TopAppBar来实现WebView页面的刷新功能。按钮位于右上角,点击后调用`webViewState?.reload()`来刷新网页内容。以下是代码摘要:
|
6月前
|
缓存 Android开发 Kotlin
【安卓app开发】kotlin Jetpack Compose框架 | 先用OKhttp下载远程音频文件再使用ExoPlayer播放
使用 Kotlin 的 Jetpack Compose 开发安卓应用时,可以结合 OkHttp 下载远程音频文件和 ExoPlayer 进行播放。在 `build.gradle` 添加相关依赖后,示例代码展示了如何下载音频并用 ExoPlayer 播放。代码包括添加依赖、下载文件、播放文件及简单的 Compose UI。注意,示例未包含完整错误处理和资源释放,实际应用需补充这些内容。
|
7月前
|
Web App开发 Rust 前端开发
【一起学Rust | 框架篇 | Tauri2.0框架】Tauri App开启远程调试功能
【一起学Rust | 框架篇 | Tauri2.0框架】Tauri App开启远程调试功能
619 0
|
7月前
|
开发框架 移动开发 JavaScript
SpringCloud微服务实战——搭建企业级开发框架(四十六):【移动开发】整合uni-app搭建移动端快速开发框架-环境搭建
正如优秀的软件设计一样,uni-app把一些移动端常用的功能做成了独立的服务或者插件,我们在使用的时候只需要选择使用即可。但是在使用这些服务或者插件时一定要区分其提供的各种服务和插件的使用场景,例如其提供的【uni-starter快速开发项目模版】几乎集成了移动端所需的所有基础功能,使用非常方便,但是其许可协议只允许对接其uniCloud的JS开发服务端,不允许对接自己的php、java等其他后台系统。
323 61

热门文章

最新文章