让移动开发更轻松 闲鱼基于Flutter构建跨端APP应用实践

2023-10-13 07:10

本文主要是介绍让移动开发更轻松 闲鱼基于Flutter构建跨端APP应用实践,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

Flutter是一款由Google开发的开源、跨平台的移动端开发框架,使用Flutter开发出的应用符合不同平台的原生体验,可以让应用看起来跟系统更加协调。

如何基于Flutter高效构建跨端APP?本期内容特邀阿里巴巴无线技术专家吉丰就闲鱼开发实践展开分享。

Flutter是什么?

Flutter是一个全新的移动UI框架,它允许使用同一个代码库构建高性能的Android和iOS应用,同时它也是Google即将推出的Fuchsia操作系统的开发平台。通过自定义的Flutter引擎可以将其嵌入到其他平台,旨在帮助开发者使用一套代码开发高性能、高保真的Android和iOS应用。

闲鱼为什么使用Flutter?

原生性能

Flutter会以原生的性能提供给开发者,它的开发性能非常接近传统的Native,包括渲染方式、AOT的编译方式和其他优化。

Flutter开发的页面跟Native没有差距。在安卓中低端机型里,基于Flutter开发出来的APP在帧率上会有更流畅的体现,内存占用也会有更低的消耗。

快速开发

Flutter因其本身的跨端性,大幅提升了传统的安卓开发速度。一般认为,前端开发的速度较快,基于Flutter,开发速度比前端更快。

image

统一的应用开发体验

在跨端层面上,由于Flutter把两端的渲染机制下沉到更低的渲染层,基于统一的C++层的渲染引擎来搭建底层的UI框架,因此,Flutter会让跨端体验得到更一致的效果。

image

Flutter开发优点颇多,是否可在业务场景中快速铺开使用?吉丰表示,实际遇到的问题比想象中要多,他就开发过程中遇到的问题举例:

“比如,内存的问题。随着Flutter页面的堆栈变得越来越深,内存的释放并没有得到及时的释放。比如,字体的问题。不同的字体在不同的机器里渲染的效果非常不一致。再比如,截图会出现黑屏的问题。还有图片缓存的问题。跟安卓端的图片缓存是完全不同的体系。另外,它的暗黑区、适配问题,以及私有库、阿里中间件的适配,以及它不支持反射和序列化,怎么把Native的组件集成到Flutter体系,也是一个比较大的问题……”

image

那么,闲鱼是如何借助Flutter完成开发的呢?

Flutter与Native混合开发实践

闲鱼目前的解决方案是通过ID的形式共享外部缓存纹理。首选把Flutter和闲鱼现有的 APP 做渐进式整合,App中会同时有 Native、Flutter 和 H5 页面。

image

闲鱼的详情页包含混合栈、视频、动画、原生组件、多图、留言盖楼等功能,页面较复杂,是闲鱼最重要的页面之一。选择商品详情页做为第一个Flutter页面,是闲鱼能成功快速使用Flutter的重要因素。

image

image

其次,在Flutter页面嵌入Native组件的过程中需要保持数据的一致性。数据的一致性是指多个页面之间需要对数据依赖有一致性。在页面开发快速迭代过程中,代码的复用度相对较低,后期维护成本高,解决数据一致性是个难题。

对此,闲鱼构建了基于Flutter下的新架构——Redux和Component。

image

image

Redux最主要是用作应用状态的管理,可以解决数据集中的问题,它会完全follow社区的概念。基于Redux,关于社区的概念、定义、签名、实现,会以最标准的形式去follow。

Redux解决了集中问题后,基于Redux下的Component会接着完成诉求,包括分置、更多力度的复用等。对这一概念,就如同有一个page下面有一些component,最后有一些stateless,跟状态无关的表达。在数据层面,它有唯一的store,推送对应的component,这就是 Half-Dumb的模型。

因为传统的组件要做的事情很多,要负责渲染,要负责交互数据的处理,也要负责数据的修改,对于无法修改自己数据的component,称为半哑巴模型,它可以完成百分百由数据驱动视图的架构。

image

最终,这样的架构解决了数据一致性和代码复用的问题,并在复用层面上提供包括Component的组件,加快了代码隔离、代码的可读性和标准规范的落地。

image

总体而言,Flutter编程模型共有三点优势:一是可以得到非常好的性能,二是有非常及时的开发效率,三是能得到非常好的跨端体验。

Flutter可让一张图片自动生成多端的UI代码,UI代码不再需要特别多的人力介入,其他工程师只需关注业务层面的解决和实施推荐系统即可。

对于闲鱼Flutter跨端开发实践,开发者觉得有哪些值得借鉴和可以改进的地方呢?欢迎留言说出您的看法~

这篇关于让移动开发更轻松 闲鱼基于Flutter构建跨端APP应用实践的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/201583

相关文章

防止Linux rm命令误操作的多场景防护方案与实践

《防止Linuxrm命令误操作的多场景防护方案与实践》在Linux系统中,rm命令是删除文件和目录的高效工具,但一旦误操作,如执行rm-rf/或rm-rf/*,极易导致系统数据灾难,本文针对不同场景... 目录引言理解 rm 命令及误操作风险rm 命令基础常见误操作案例防护方案使用 rm编程 别名及安全删除

C++统计函数执行时间的最佳实践

《C++统计函数执行时间的最佳实践》在软件开发过程中,性能分析是优化程序的重要环节,了解函数的执行时间分布对于识别性能瓶颈至关重要,本文将分享一个C++函数执行时间统计工具,希望对大家有所帮助... 目录前言工具特性核心设计1. 数据结构设计2. 单例模式管理器3. RAII自动计时使用方法基本用法高级用法

PHP应用中处理限流和API节流的最佳实践

《PHP应用中处理限流和API节流的最佳实践》限流和API节流对于确保Web应用程序的可靠性、安全性和可扩展性至关重要,本文将详细介绍PHP应用中处理限流和API节流的最佳实践,下面就来和小编一起学习... 目录限流的重要性在 php 中实施限流的最佳实践使用集中式存储进行状态管理(如 Redis)采用滑动

SpringBoot 多环境开发实战(从配置、管理与控制)

《SpringBoot多环境开发实战(从配置、管理与控制)》本文详解SpringBoot多环境配置,涵盖单文件YAML、多文件模式、MavenProfile分组及激活策略,通过优先级控制灵活切换环境... 目录一、多环境开发基础(单文件 YAML 版)(一)配置原理与优势(二)实操示例二、多环境开发多文件版

使用docker搭建嵌入式Linux开发环境

《使用docker搭建嵌入式Linux开发环境》本文主要介绍了使用docker搭建嵌入式Linux开发环境,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面... 目录1、前言2、安装docker3、编写容器管理脚本4、创建容器1、前言在日常开发全志、rk等不同

ShardingProxy读写分离之原理、配置与实践过程

《ShardingProxy读写分离之原理、配置与实践过程》ShardingProxy是ApacheShardingSphere的数据库中间件,通过三层架构实现读写分离,解决高并发场景下数据库性能瓶... 目录一、ShardingProxy技术定位与读写分离核心价值1.1 技术定位1.2 读写分离核心价值二

Three.js构建一个 3D 商品展示空间完整实战项目

《Three.js构建一个3D商品展示空间完整实战项目》Three.js是一个强大的JavaScript库,专用于在Web浏览器中创建3D图形,:本文主要介绍Three.js构建一个3D商品展... 目录引言项目核心技术1. 项目架构与资源组织2. 多模型切换、交互热点绑定3. 移动端适配与帧率优化4. 可

深入浅出Spring中的@Autowired自动注入的工作原理及实践应用

《深入浅出Spring中的@Autowired自动注入的工作原理及实践应用》在Spring框架的学习旅程中,@Autowired无疑是一个高频出现却又让初学者头疼的注解,它看似简单,却蕴含着Sprin... 目录深入浅出Spring中的@Autowired:自动注入的奥秘什么是依赖注入?@Autowired

MySQL分库分表的实践示例

《MySQL分库分表的实践示例》MySQL分库分表适用于数据量大或并发压力高的场景,核心技术包括水平/垂直分片和分库,需应对分布式事务、跨库查询等挑战,通过中间件和解决方案实现,最佳实践为合理策略、备... 目录一、分库分表的触发条件1.1 数据量阈值1.2 并发压力二、分库分表的核心技术模块2.1 水平分

Python实战之SEO优化自动化工具开发指南

《Python实战之SEO优化自动化工具开发指南》在数字化营销时代,搜索引擎优化(SEO)已成为网站获取流量的重要手段,本文将带您使用Python开发一套完整的SEO自动化工具,需要的可以了解下... 目录前言项目概述技术栈选择核心模块实现1. 关键词研究模块2. 网站技术seo检测模块3. 内容优化分析模