揭秘宜信财富年度账单的技术实现

 

 

一、背景

年底很多移动产品都会推出自己的年度账单，每年都会引起大众媒体的关注。今年有幸参与了宜信财富APP年度账单的开发，本文将带大家探索宜信财富年度账单背后的技术架构和研发逻辑，希望可以给大家带来一些思路上的启发。

二、前端整体架构和执行流程

宜信财富年度账单前端架构所采用的技术栈包括：

• 前端页面是用H5制作；
• 数据加载进度百分比，技术用到swiper插件和一些CSS3动效；
• 海报生成用到了canvas图片合成，把海报背景和二维码合二为一。
• 为了完成MGM的追踪，在二维码中嵌入M1信息。

三、数据来源和数据处理

本次年度账单涉及客户维度、销售维度、客户标签等数据，其中客户维度包括活动参与、文章、视频浏览等数据。这部分数据的整合来源于数据中台的主题数据。以下是数据中台的架构图：