网易支付团队分享NEJFlutter小程序动态化高性能架构,JavaScript与Flutter结合实现原生级性能

2025-03-23
来源:网络整理

大家好,我今天将与您分享的主题是“ Mini High- ”,这是关于在Mini 方向的支付团队尝试的一组技术解决方案。总而言之,它是利用业务逻辑和UI布局的开发来开发迷你程序的性能,这与本机应用程序相当;

生产团队:付款团队

1。序言

自从进入移动互联网时代以来,移动互联网的战场一直在加剧并变得越来越激烈。说“快速,准确和残酷”是幸存这个战场的基本质量,这并不夸张。查看苹果,,,,,Didi,,,等著名互联网公司的发展历史。即使您已经拥有世界上最大的公司的一半,总是对未来的黑暗打击保持警惕,而且这个战场注定要永远不会保持平静。在如此激烈的竞争环境中,主要的互联网公司正在寻找一种武器来争夺市场,这是一种可以提高公司研发效率,实现良好产品体验的古老武器,并可以快速迭代,准确地部署和快速试用和错误,从而占据了技术的高度。今天,我想向您介绍一个由支付生产的功能强大的工具,并且仍在不断抛光。

在引入迷你计划的动态高性能体系结构之前,让我们首先了解腾讯团队在市场上更频繁地讨论的动态框架:

腾讯 - :使用纯JS包装基础知识并希望用JS翻译它们的功能支持了很多支持。据估计,在框架维护上进行投资需要大量工作。此外,至于当前的框架状态,对于第三方JS图书馆或第三方介绍而言,它并不友好且完美,并且使用了许多不便。 JS方带有业务逻辑,虚拟树的建立和更新,所有这些都需要在JS运行时计算。计算量很大,并且性能损失很大。经过简单的试验,在具有复杂的UI结构的页面中有一个非常明显的滞后。从社区的各个方面了解腾讯团队的最新情况。该项目仍应处于试点阶段,我希望能尽快启动2.0版;

可以看出,无法避免动态框架设计,并且需要解决框架本身性能问题的解决方案,这要求我们最大程度地减少在设计框架时会导致渲染线程阻滞的操作或操作。在从前任的思想中学习并从他人那里汲取了宝贵的经验后,团队开始基于动态解决方案进行探索。接下来,让我们看一下技术的具体优势吗?

2。背景

在新的跨平台物种推出后,它立即成为舞台中心最亮的恒星,其出色的UI渲染性能和高跨平台的一致性。显然,我们的团队不是第一个尝试一下的人,但是闻起来很香。作为iOS开发人员,一旦他接触就立即感到强大。毫秒的热装,丰富的可定制,令人难以置信的UI渲染功能和本地UI体验确实令人惊讶。因此,团队决定开始尝试技术,但毕竟,这是一个新物种。表演真的很棒吗?框架本身是稳定的吗?跨端一致吗?该技术中还有其他什么不是完美的吗?团队中仍然有很多问题,但是如果您不尝试的话,您将永远不会知道这些答案。因此,我们在付款应用程序中选择了一些具有相对较低业务重量的业务领域以输入A/B测试:

从团队实践的过程来看,这相对容易入门,并且学习成本相对较低。该社区也很受欢迎,出色的第三方图书馆正在一个接一个地出现。最后,让我们看一下在线业务的灰度数据:

上述采样服务很简单,并且数据样本受到限制,仅供参考

技术解决了多终端一致性的问题,大大降低了团队人工成本,并带来了良好的用户体验。当之无愧地是目前最热门的跨平台技术。但是,尽管其出色的渲染性能和强大的跨端一致性,但它仍然无法解决传统移动开发中的痛点 - 无法动态(热门更新),因此解决动态问题已成为团队思维和研究的方向。

3。动态疼痛点

传统的移动开发具有出色的性能,但最终不能动态。这迫使主要的互联网公司在将其业务部署在移动市场中时进行了漫长的应用程序市场审查和新版本的逐步更新。这对市场扩展期间主要互联网公司的快速部署非常不利。加上主要应用程序市场的业务审查风险,一些公司甚至被迫“游击战”,以避免审查和杀害应用程序市场。

因此,推出了一个框架,以支持和编写本机移动应用程序,这似乎是最受欢迎的。它欢呼起来。一旦推出,它就点燃了全球开发人员。它通过开发 +渲染实现了跨端 +动态,并确保了性能,并在一夜之间成为“救世主”。期望越高,要求越高。我们已经使用了RN,但是总体用法效应仍然无法匹配我们的预期指标,尤其是在低频设备上,性能很难满足。

尽管启动了具有如此众多优势和性能的跨端框架,但它无法实现RN之类的动态是该框架的唯一缺点。动态和性能就像平衡的两端一样,似乎永远无法达到平衡。性能和动态就像是一个咒语,它始终驱使国内外开发人员在这条路上继续进行。似乎没有计划在长期和长期内支持对动态的态度,因此我们计划站在这个巨人的肩膀上,自己创建一个动态的高性能建筑,因此我们开始探索该项目。

4。动态解决方案想法

在引言中,我们在思考动态解决方案时为我们提供了参考意义。我们希望在设计动态解决方案时,我们可以最大程度地减少框架层的视图层和逻辑层之间不必要的大量数据对象。因此,我们围绕加法和减法的指导思想设计。添加表示保留了出色的特征作为视图层(高性能/高稳定性/高能量效率)和动态脚本语言作为逻辑层,以实现整个解决方案的动态。减法表示:在设计动态解决方案时,请尝试避免框架层的性能消耗,这主要是指逻辑层和视图层之间的频繁密集数据交互,例如在与大规模视图相关的数据传输和数据传输以及解码和解码或UI 的大规模视图中的多个虚拟机之间的异步操作。坚持这个核心想法,让我们看一下我们如何分析和设计它。

有人支持以DSL描述性语言编写UI布局,考虑保留与UI布局相关的代码,并剥离业务逻辑相关的代码以使用其他动态脚本语言,以完全实现视图层和逻辑层的真实分离。首先,至于移动动态脚本的普及,似乎每个人都在选择动态语言方面别无选择。从以前著名的动态解决方案(例如// WEEX)来看,这确实是最好的选择。 JS生态系统不仅是iOS和系统非常好的JS引擎支持,而且还可以很好地发展,并支持大量出色的三方库。最重要的是,开发人员的受众群体非常广泛,因此该解决方案自然被选为动态语言中的动态开发语言。最终的渲染体验最终以AOT模式推出。该代码将被编译到面向机器的指令代码中,并且不支持DART代码的动态执行。因此,如何将其保留为视图层,并可以支持动态“执行”,以及如何连接JS以及通信和交互是我们需要考虑的关键问题。这涉及我们自己开发的有效的管理机制。我暂时不会一个人扩展。如果您有机会,我将与您讨论这一点。让我们首先看一下我们的整体架构,如下所示:

模板小程序开发存在哪些局限性_微信小程序缓存在哪个文件夹_小程序表单存在数据库

通过“”管理机制的中间层,为每个对象(包括或数据对象)打包了框架层的相应NEJF对象,并负责管理和刷新单个生命周期。这样,树是“动态”创建的,UI渲染是通过树重新驱动的引擎完成的。当前,已根据.9.1完成了700多个常用包装并使用。事件还通过中间层建立了管理结合机制,以完成事件与JS与末端之间的数据之间的相互作用。

5。迷你计划设计

动态问题是整个迷你程序解决方案中非常关键的问题,但是要设计一个完整的迷你程序解决方案,至少需要考虑以下三个方向。首先:如何使用迷你程序沙盒机制来确保迷你程序之间的独立管理,包括独立的安装目录,数据隔离,网络安全和虚拟机独立性;第二:混合编程,目的是将整个迷你程序框架连接到现有项目,并以最新费用访问现有的基本服务;第三:开发与分销平台,Mini计划最终以较小的应用方式开发,发布和启动,至关重要的是建立一个为迷你程序发布和版本管理的平台。让我们一一介绍它。

1。沙盒机构

安装目录独立

每个小程序都需要一个独特的表示。每个小程序都由单独的目录文件夹保存。该文件仅读取,无法修改。它主要由压缩的main.js +模板文件 +资源文件组成。它用于启动小程序,该小程序等效于主程序的目录;

数据隔离

I.每个小程序都有数据缓存的要求,该数据缓存是通过提供数据读取和写入API,坚持业务数据操作以及支持文件和数据库缓存解决方案来管理的;

ii。当每个小程序访问磁盘文件或数据库时,它将用于验证和 Path验证的读取权限,以确保 A的数据不会被 B偷窃或污染,并确保数据安全性;

网络安全

为了防止跨域访问小程序,小程序需要申请特定的网络访问域,以防止服务访问错误名称的风险;

虚拟机独立

打开一个独立的虚拟机环境,以供每个小程序运行,确保JS环境是独立的,数据未经污染或被盗,内存管理是独立的,并且在执行异常时,JS环境相对可控制,避免在小问题之间相互影响;

2。混合

为了将整个迷你程序框架连接到现有项目,最低成本是将体系结构定位为与容器相同级别的技术体系结构,并将其连接到现有桥梁,以便可以以最低的成本来调整现有的基本业务服务。

3。第三方图书馆支持

当然,为了实施该解决方案,我们的小组开发了支持开发套件,包括DART FILE到模板文件工具,自动转换节点工具,简单的表达转换工具和其他套件,以及在框架级别上进行特殊控制的特殊包装,以及对JS三方图书馆的扩展支持,以满足更多的三部分控制和更高的三分之二的介绍。故障排除V8或版本的兼容性限制,它已完全支持JS三方库的引入。三方库推出了出色的三方库,例如T,T等,开发人员可以根据这些出色的三方库来轻松开发出色的应用程序。如果您看到其他非常有用的三方库,则将继续加入,开发人员也可以自定义它们。

4。分销平台

模板小程序开发存在哪些局限性_小程序表单存在数据库_微信小程序缓存在哪个文件夹

I.快速访问开发环境:如果开发团队很大,则环境配置将为团队带来许多冲突或不一致。为了允许该框架以几乎为零的成本访问现有项目,CI用于直接自动包装相关的小程序代码,并通过POD快速访问原始项目,这是相似的;

ii。分销平台:主要责任是在发布和版本管理方面做得很好。当然,为了确保迷你程序的安全性,需要添加一层签名扩展机制。以下是一组快速发展和一般过程,如下所示:

6。工程实践1。项目特征:

引入了三方图书馆:

2。 Game -Mini计划

基于Mini计划框架,我们选择了 Game 在 应用程序中开发迷你程序版本。就整体经验而言,它非常出色,目前正在为灰度启动,具有以下效果:

3。性能测试

对帧速率,内存使用和启动时间进行了简单的测试。由于有一些样本,因此统计参数可能不是很准确。仅供参考:

I.帧速率维度:iOS设备上的性能相对稳定,涵盖了包括5S/6/6p/8p/X/Xs Max的主流型号,并且帧速率性能非常出色。除了5s的略微下降外,经验几乎可以在中高端设备以上实现;该设备在低端设备上仍然很难运行,中高端设备仍然表现良好,可以实现水平体验。参考数据如下:

ii。内存维度:内存占用主要包括两个观察点,一个是第一个启动,另一个是Mini程序的频繁存储器增量,如下图所示:

第一个启动的内存增量主要包括引擎启动的初始化以及游戏方形带来的增量。在iOS和第一个条目上,它们将带来大量的内存增量,约;频繁的内存增量进出Mini程序主要是为了观察MINI程序中的内存发布问题。从数据的角度来看,排序仍然稳定,并且内存波动约为10m。

iii。第一个启动时间维度:iOS和两个都相对较快,从输入页面的整体渲染,基本上是非常有效的;

7。这条路很长

目前,该计划刚刚发布,需要持续检查和迭代。当然,仍然需要建造许多周围的辅助设施。同时,由于一些出色的三方图书馆提供商,我们提供了一些出色的三方库,可以方便地支持动画,视频,页面管理等功能。

后续计划:

分享