写点什么

Shopify 将应用迁移到 React Native,跨平台代码达到 86%,旧代码减少 180 万行

  • 2024-11-15
    北京
  • 本文字数:1082 字

    阅读完需:约 4 分钟

大小:485.20K时长:02:45
Shopify将应用迁移到React Native,跨平台代码达到86%,旧代码减少180万行

我们刚刚完成了将 Shopify 移动应用迁移到 React Native 的工作。这是我们最大的一个应用,开发至今已经超过十年的时间。以下是迁移过程。

 

我们增加了 68.3 万行新代码,同时删除了 250 万行旧代码,净减少 180 万行。我们将 586 个页面迁移到 React Native,并移除了 232 个过时的页面。

 

现在我们在 iOS 和 Android 平台之间共享的代码达到了 86%,而之前只有 5%。现在,在不同平台之间保持功能一致性不再是问题。

 

性能优化是我们关注的一个重要方面。我们将屏幕加载时间缩短了 59%,应用启动速度提升了 44%,网页视图速度也加快了 63%。

 


https://twitter.com/i/status/1695098627683721341

 

我们减少了每个应用版本约 50 万次的崩溃,显著提升了应用的稳定性,实现了超过 99.9%的无崩溃用户会话。

 

我们的用户也注意到了这些改进。我们的 28 天平均应用商店评分在 iOS 上从 4.4 提高到了 4.8,在 Android 上从 4.1 提高到了 4.4。

 

苹果和谷歌也注意到了这些改进。在迁移过程中,我们的应用被特别推荐了 5 次。

 


https://x.com/mustafa01ali/status/1801721357111279991/video/1

 

我们致力于开源贡献,希望回馈社区。我们开发并开源了 Flashlist,它现已成为使用 React Native 构建高性能清单功能的标准方式。

 


https://twitter.com/i/status/1542542577953644544

 

我们与 @wcandillon 合作,促成了 React Native Skia 的诞生。这一创新将 Skia 图形库引入 React Native,使得实现高质量的 2D 图形绘制和动画成为可能。

 


我们为 @swmansion 在 Reanimated 项目上的工作提供赞助,这个项目让 React Native 能够提供高质量的动画效果。

 


https://twitter.com/i/status/1630590156255240193

 

我们开发并开源了 Tophat,用于实现构建的应用一键安装。

 


https://twitter.com/i/status/1825920486666084360

 

我们从迁移中学到的东西:

 

  1. 原生代码和原生开发至关重要。任何东西都无法替代通过构建高质量移动应用所积累的经验和独到的品味。

  2. 将 100%使用 React Native 作为目标是不明智的。在任何情况下,只要原生是最适合实现功能的地方(小部件、Siri、手表应用等),或者在有高性能要求的地方,都应该使用原生。

  3. 获得良好的性能需要不断的努力,并且应该从一开始就将其作为一个优先事项。全面测量性能指标,并毫不留情地对每一层进行优化。引入自动化监控来捕捉性能回退。

 

总的来说,React Native 为 Shopify 带来了生产力的飞跃,同时使我们能够在适当的情况下继续使用原生技术的优势。我们对 React Native 的未来发展充满期待,并将继续与 Meta 和社区合作,让它变得更好。

 

【声明:本文由 InfoQ 翻译,未经许可禁止转载。】

 

原文链接:https://threadreaderapp.com/thread/1853619638141071573.html

2024-11-15 08:009466

评论 1 条评论

发布
用户头像
近日(2018年06月20日),Airbnb(爱彼迎) 技术团队在 Medium 上宣布,放弃使用 React Native,将回归到使用基于原生技术的自有框架开发 App。

https://medium.com/airbnb-engineering/sunsetting-react-native-1868ba28e30a
2024-11-15 11:43 · 北京
回复
没有更多了
发现更多内容

一起学Elasticsearch系列-索引的批量操作

Java随想录

Java 大数据 Elastic Search

Beyond Compare 4 for Mac中文注册激活 附 激活码 支持m1/m2

Rose

mac软件下载 Beyond Compare 4 注册版 Beyond Compare 4 下载 文件比较工具

油猴浏览器管理脚本:Tampermonkey油猴插件安装教程

Rose

油猴插件 Tampermonkey插件 油猴脚本使用

3.2.1.0 发布!时间转换函数+BI 集成+视图正式上线!

TDengine

tdengine 时序数据库

第30期 | GPTSecurity周报

云起无垠

无人巡检 | AIRIOT变电站无人机运防一体管理解决方案

AIRIOT

无人机 变电站 智能变电站

深挖数据资产价值,释放数字风控效能,用友智慧模型革新虚假贸易监控新手段

用友BIP

虚假贸易零容忍

风靡万千软件开发者:揭秘华为研发代码大模型是如何实现的?

云计算 软件开发 华为云

火山引擎DataTester升级MAB功能,助力企业营销决策

字节跳动数据平台

A/B 测试 对比实验

同城双活的必修课 - 落地经验与关键挑战解析

柠檬汁Code(binbin0325)

容灾 异地多活 故障恢复 部署架构 同城双活

Databend 开源周报第 122 期

Databend

基于阿里云服务网格流量泳道的全链路流量管理(一):严格模式流量泳道

阿里巴巴云原生

阿里云 云原生 Service Mesh 服务网格

车企数据治理实践案例,实现数据生产、消费的闭环链路

袋鼠云数栈

大数据 数字化转型 数据治理

系统测试的实践与思考

老张

软件测试 质量保障 系统测试

向“创新者”升阶,程序员当下如何应对 AI 的挑战 | 京东云技术团队

京东科技开发者

人工智能 程序员 AI 大模型

连夜整理的6个开源项目,都很实用

伤感汤姆布利柏

开源 低代码 开发

3D渲染:hdrlightstudio8插件怎么安装?HDR Light Studio 8 Mac破解版下载安装教程

Rose

3D渲染 HDR Light Studio 8 HDR Light Studio安装

Amazon CodeWhisperer 正式可用, 并面向个人开发者免费开放

亚马逊云科技 (Amazon Web Services)

人工智能 API CodeWhisperer Amazon Lambda 云上探索实验室

如何让“省钱”“赚钱”相结合,资产管理实现效益最大化

用友BIP

资产管理

揭秘华为研发代码大模型是如何实现的

华为云开发者联盟

人工智能 华为 华为云 华为云开发者联盟

数据“表”的增删改查

小齐写代码

12 | 排序(下):如何用快排思想在O(n)内查找第K大元素

鲁米

带你走进灵动岛 | 京东云技术团队

京东科技开发者

ios 开发 灵动岛 UI适配

数智化驱动建企人才管理创新

用友BIP

人才管理

Shopify将应用迁移到React Native,跨平台代码达到86%,旧代码减少180万行_架构/框架_Mustafa Ali_InfoQ精选文章