一文窥探苏宁818“专注好服务”背后的前端研发

今年的苏宁818注定与以往不同。

不久前的苏宁818发布会上,苏宁宣布由“零售商”升级为“零售服务商”,并全新升级了“专注好服务”的品牌主张。同时,家乐福1小时达等业务与全新升级的视频、直播等平台的接入,在今年的818共同为消费者打造更全面、更立体的服务。

当下,消费的持续升级与市场的快速复苏,将流量推向了更高层级。“专注好服务”,也对前端技术提出了更高的要求。经过多年的积累,苏宁已构建出较为完备的前端技术体系,全力支撑覆盖浏览器、APP、小程序矩阵等技术场景的“线上平台+线下门店”各节点大促。在经济复苏按下快进键的2020“818”,苏宁“大前端”将会打出怎样漂亮的组合拳?

业务、技术团队的“发布之争”

在电商大促中,一直存在着这样一个矛盾:一方面,业务团队希望促销活动更灵活,适应市场的快速变化,希望大促期间的活动页面、场景玩法都能多发、快发;另一方面,技术团队则希望避免频繁发布带来的质量风险,所以倾向于在大促期间封板、禁发。

那么,苏宁是如何应对这个矛盾呢?

第一,前端基于Node.js对大量的系统进行改造,彻底实现前后端分离。在系统分层上,将展示层放在Node.js系统上,由前端同学维护,而对数据的处理,保留在服务端,由服务端同学处理。

第二,服务端提供微服务,前端使用Node.js将服务组装后,渲染为页面,成为新的常态开发模式。通过这一方式,前端的多项操作就可以脱离服务端来做单独发布,解决了绝大部分大促相关业务的快速发布和系统稳定性的矛盾。涉及到数据操作相关的可以及早封板,保持稳定。而大促相关的紧急需求可以通过Node.js来做快速发布,甚至一直持续到817-818当天的爆发节点。

一文窥探苏宁818“专注好服务”背后的前端研发

(图 苏宁广泛的Node.js应用,支持WAP/PC页面快速发布)

快速搭建促销会场的“泰坦”奇兵

苏宁使用weex始于2017年,彼时被广泛使用于APP的大促会场页面上。得益于Weex的使用,苏宁易购大促会场的渲染帧率从平均30FPS提升到平均55FPS,极大提升了用户体验。同时,weex页面的转化率也远高于H5,可以说获得了体验和效益的双丰收。

据了解,今年苏宁818会场也同样使用weex技术,除定制化的大促主会场外,大部分的分会场及专用促销页,都可以通过苏宁泰坦这一no code平台搭建。

一文窥探苏宁818“专注好服务”背后的前端研发

(图 苏宁泰坦平台)

苏宁泰坦平台,支持了上百个H5/WEEX组件,支持“所见即所得”方式编辑会场、促销页。通过no code平台,大促会场的开发量降低了60%,运营同学也可以在仅仅几分钟内完成会场页的配置。

一次开发、多端部署、流量共享的苏宁小程序平台

苏宁小程序平台,是苏宁独立实现的一个小程序架构,支持业务以小程序的方式运行在苏宁系APP上,如苏宁易购、苏宁小店、苏宁金融、PP视频、PP体育等,做到了一次开发,多端部署。

通过小程序平台,苏宁得以实现多业态的流量共享和流转,用户可以在苏宁易购APP上看中超比赛,也可以在苏宁体育APP上边看边购买商品,而同一个促销玩法,可以同一时间部署到多个APP上,让用户一起来玩。

截止2020年818前,苏宁已接入了包括微信、百度、头条、支付宝等多个小程序平台。大促的一次上线,往往要同时将代码提交到3-4个小程序,开发成本很高,通过人工方式添加代码确实难以为继,于是SNT-小程序转换器孕育而生。

SNT基于Babel,将微信小程序代码转化为百度、头条、支付宝小程序代码,转化率超过80%,极大的降低了小程序的开发成本,前端工程师仅需开发微信小程序代码,再通过SNT转换器,就可以生成其他小程序的代码。通过SNT,前端团队仅花费微信小程序一半的人力成本,就支撑了百度、头条、支付宝等小程序的迭代需求。

游戏玩法引擎化,大幅提升用户体验

随着技术的进步和业务的发展,电商大促游戏玩法已经不仅限于直接发红包而是变得更具备互动性、传播性、长期性。

经过几年的探索,苏宁前端在2020大促玩法上,将渲染方案统一为pixi.js,并围绕pixi.js开发了“鲸喜”和818晚会玩法,在新浏览器中开启WebGL后,渲染性能有了一定幅度的提高,在pixi.js基础上,通过骨骼动画、粒子系统等插件,解决了以往开发中资源加载过多,核心库过大等问题。

一文窥探苏宁818“专注好服务”背后的前端研发

一文窥探苏宁818“专注好服务”背后的前端研发

苏宁818已迎来爆发,但前端的技术之路没有终点。

据悉,818后,苏宁小程序平台将进一步开放,提供开发套件给苏宁体系外的技术开发者, 818后,XNPP也将面向广大的Node.js开发者开源。未来,高复杂度的业务场景与大流量的访问,将持续推动苏宁前端技术朝着更高点前行,为苏宁全场景智慧零售服务商升级提供更稳健的技术驱动力。

(免责声明:本网站内容主要来自原创、合作伙伴供稿和第三方自媒体作者投稿,凡在本网站出现的信息,均仅供参考。本网站将尽力确保所提供信息的准确性及可靠性,但不保证有关资料的准确性及可靠性,读者在使用前请进一步核实,并对任何自主决定的行为负责。本网站对有关资料所引致的错误、不确或遗漏,概不负任何法律责任。
任何单位或个人认为本网站中的网页或链接内容可能涉嫌侵犯其知识产权或存在不实内容时,应及时向本网站提出书面权利通知或不实情况说明,并提供身份证明、权属证明及详细侵权或不实情况证明。本网站在收到上述法律文件后,将会依法尽快联系相关文章源头核实,沟通删除相关内容或断开相关链接。 )