Vivo商城前端架构升级-多终端统一探索、实践与展望
前端开发
浏览：988 次
1、 简介
本文将介绍Vivo商城在前置维度的统一探索与实践。
从多端价值的角度，我们为什么要做多端统一，如何满足多端业务、实践和创新的需求，我们简单而坦率地描述了我们在多端统一方面所做的工作。
2、 多端探索为vivo商城带来什么价值
多端价值体现在两个方面：技术架构的升级和人力资源的释放。
1、技术架构全面升级
从…起
形象
达到
形象
我们已经实现了技术架构解决方案的统一。通过统一，大大降低了开发成本和维护成本。同时，它具有很高的重用性和效率。
2.释放大量人力资源
技术架构的统一为业务的横向扩展提供了强有力的技术支持和可实现的保障。
下图显示了使用新技术架构后的开发人力投资比率。
形象
从上图可以看出，通过技术架构的升级，已经释放了大量的开发资源。让释放的开发资源做更多有价值的事情。
3、 为什么我们要做多终端统一
您可能会有一个问题，那就是，什么是多端统一？
让我告诉你一些事情。我们不要谈论统一。我们来谈谈多端。什么是多终端？想必我们都可以继续交谈。
我画了一张关于多个终端的图片，如下所示：
形象
从上图可以看出，线下、PC、wap、APP、微信公众号、微信小程序等，每一个都可以称为一个终点。既然我们知道了多终端的含义，那么让我们回顾一下多终端统一。
完整的多终端统一应包括以下方面
大型前端的多终端统一[前端+客户端]
服务器的多终端统一
多终端业务统一
这里，我们只讨论前端统一。
从PC浏览器到移动浏览器，再到嵌入式APP，再到各种小程序，再到服务器和客户端。繁荣的生态就像百家争鸣，百花齐放。然而，在繁荣的背后，前端工程师面临的挑战越来越大。
我们正在承接越来越多的终端，新的终端不断涌现，如小程序、快速app等。前端工程师陷入以下陷阱：
现有代码和新代码应适应新的最终开发场景
适应新终端开发场景的代码已成为现有代码
现有代码和新代码应适应新的最终开发场景
环
我们希望解决这个问题，并实现一套能够覆盖当前端和未来端的技术架构解决方案[代码]。
更一般地说，我们希望实现以下功能：
形象
在前端发展的背景下，出现了多终端统一。这是前端未来的趋势，也是解决上述玩偶陷阱的良药。
4、 如何满足日益增长的多终端服务需求
随着时间的推移，各个小应用端的业务逐渐被重视，尤其是vivo商城中的微信小程序。
业务方面有两个要求，如下：
首先，保持现有Vivo商城微信小程序的核心功能与商城H5功能一致。
第二点：后续版本迭代在小程序端和H5端同步进行。
现实是，现有商城微信小程序的版本迭代已经落后于商城H5版本。
我们使用新老版本小程序购买过程的视频进行对比，这样我们可以有更直观的感受。
旧商店小程序：
新版商城小程序：
从以上两段视频中，我们可以看出两者的区别。我们面临着巨大的挑战。
根据业务端的要求，我们需要增加一点来解决以上两点。共有三点，如下所示：
第一点：在最短的时间内，在微信小程序上实现商城H5的基本功能和流程
第二点是在后续小程序端和H5端的功能同步迭代时，实现高重用和高效率。
第三点：提前考虑其他端业务场景的实现，做好可扩展性和多端可重用性。
在业务驱动下，我们进行了技术研究、演示验证和mvp验证。最后，在综合考虑下，uni app多终端架构师
