2020年618大促已经过去，作为淘系每年重要的大促活动，淘系前端在其中扮演着什么样的角色，如何保证大促的平稳进行？又在其中应用了哪些新技术？淘系前端团队特此举办了 618 系列征文，为大家介绍 618 中的前端身影。本篇的作者是来自于营销活动团队的墨冥，为大家介绍618大促背后的淘系前端技术体系。
持续近一个月的618电商大促终于落下帷幕。笔者有幸成为阿里这次618大促的前端负责人，借着这个机会跟大家分享一下支撑618大促背后的前端技术体系，作为阿里淘系618前端技术分享系列的开篇。
2020开年的前几个月，肆虐的新冠肺炎疫情把人们封印在家中，对中国的服务业、旅游业等线下经济产生了巨大的冲击，同时也大大促进了电商网购、线上办公、线上医疗等服务的发展。对电商平台、商家、消费者来说，今年的618，成为了疫情之后国内最大的电商消费节点，对拉动内需，促进国内消费，带动就业起到非常关键的作用。
阿里作为电商领域的引领者，今年618大促一贯地保持了对友商的竞争优势，创造了新的数字消费记录，业务玩法和策略上也有了一些新的变化。例如：
经过多年的沉淀和发展，淘系前端已经构建出了一套较为完备的技术体系，用以支撑阿里包含618、双11在内的电商营销活动业务。接下来笔者将简单介绍淘系前端技术体系以及这个技术体系上基于618大促的场景诉求，技术演进的创新点。
淘系前端技术体系大图
基于以上淘宝前端技术体系和这次618的业务诉求，淘系前端进一步做了许多技术和方案的亮点创新，例如PHA、同层渲染、前端智能化探索、极致性能体验、营销互动提效、小程序、资损防控等，相关技术方案将以系列文章的方式做一些总结和沉淀，让我们先简单一睹为快。
在移动开发中，App 嵌入 Web 页面已经是稀松平常的事情了，它能以较低的成本实现三端复用，但因为 Web 本身的渲染缺陷使开发者要面对的问题也越来越多，比如页面加载慢、多页面（Tab）切换体验差、多页面实现成本大、富交互组件（视频、表单等）体验差、无法离线访问等等，所以社区这几年也出现了 React Native、Weex 、Ionic 等解决方案。通过这边文章给大家分享下支撑 618 会场的应用容器 PHA, 讲解如何运用 Native 技术对混合式应用进行渐进式增强，使其具有接近 Native 的用户体验。
今年618我们带来了名为“幸运列车”的互动游戏，携全国各地的特色农货和美食，让大家在这个夏天寻味中国。从2019年双十一的 “盖楼 ”到今年618的 “开列车”，在大促互动游戏背后，是业务多变性、产品稳定性和研发效率的多重博弈。这篇文章将介绍淘系互动前端团队如何应对研发效率 & 产品稳定性的挑战，内容涵盖“互动智能测试” & “弹窗规模化生产”这两个技术方案。
作为一名前端工程师，更高的性能、更流畅的体验是长久不变的追求目标。而作为大促锋线，会场页面的性能表现直接影响了亿万消费者的购买体验。那么在今年的618，我们是如何让消费者们在上千张的会场页面里能够逛的知心、挑的称心、买的开心呢？这篇文章将简要介绍今年的618，我们是如何通过预缓存、请求优化、监控测试等方案来保障会场页面体验的。
2020直播带货是电商导购的新模式之一。PHA 框架的优秀性能，使大量业务回归跨平台和开放的Web体系，但原生系统的播放器对于直播/短视频来说，稳定性、性能、播放能力支持均难以达到使用标准。这篇文章将介绍此背景下，我们如何通过同层渲染技术实现在Web中使用阿里淘系自研的Native播放器，做到期间0故障，整体无降级，端crash率稳定。
现如今，日常业务的资损防控工作在安全生产环节中已经变得越来越重要。尤其是每逢大促活动（譬如本次618大促），一旦出现资损故障更容易引发重大损失。如果只是通过 code review 之类的方式，效率低且其质量参差不齐，无法得到保障。这篇文章将介绍我们如何通过引入代码扫描，在每次代码提交时都能自动检测出代码中的资损风险并给出告警，从而在研发阶段就能提前发现问题并及时修复。
AI技术的飞速发展，使得机器代替人编码产生了可能性。P2C，即通过智能算法由结构化产品需求文档直接生成可用前端代码的技术方案。实现P2C，将给代码研发带来巨大的效率突破。这篇文章将主要围绕自动化生成代码的目标，分享我们在这一过程中的所思所想，以及我们在618会场中的实践。
为了建设更加开放的生态能力、更加丰富的商家运营能力，我们在过去一段时间操刀了旗舰店小程序升级。旗舰店作作为流量大、架构复杂、稳定性要求高的典型场景，技术挑战极大，整个过程遇到的问题非常多。在本次618大促，店铺是如何落地小程序技术方案？又是如何建设小程序的性能体验？最后又是如何保障店铺的大促稳定性？这篇文章会重点介绍店铺的小程序架构、性能优化方案、稳定保障措施等，围绕店铺在小程序上的实践，分享在整个过程中遇到的问题和经验。
过去的一年，天猫行业的业务发展促使快速建场、高效用场的需求愈发强烈，而行业前端的开发方式仍是劳动密集型，对行业频道这类长尾业务弊大于利。得益于淘系前端的积累，去年底开始，天猫行业与UED、产品团队合作完成了TaoUI组件规范，并建设了织网组件中心来支撑行业沉淀下来的物料，那么，如果按照一定的规范，使用直接的数据模型直接驱动组件，是不是大部分普适的模块就不需要开发了呢？于是，行业魔方应运而生。在这次天猫服饰行业618会场的商品内容中支持了混排 Feeds流，这篇文章将分享通过更通用、轻量的方案为营销会场带来了更丰富的体验，让用户不仅买得爽，还能看得爽。
作为阿里淘系618前端技术分享系列的开篇，本文主要是抛砖引玉，从整体上介绍淘系前端技术体系以及在618大促中的技术亮点，请期待后续详细的各项专题详细分享文章。
最后，618虽然已经结束，但更大规模的双11全球狂欢节马上就要启动。高复杂度、大规模的营销活动业务场景持续推动着淘系前端技术体系朝着极致方向迭代演进，期待更多的同学加入阿里淘系前端团队，一起来创造618、双11的新历史，此时此刻，非你莫属！
← 互动生产力进化之路 | 618 淘系前端技术分享 IOT设备动态化解决方案在工厂数据上云的应用 →