编者按：本文是蚂蚁集团前端工程师青壁在 SEE Conf 2022 的演讲内容，包括演讲视频及文字内容，欢迎享用。

大家好，我是青壁，来自蚂蚁集团体验技术部-数据智能部门，2018年毕业加入蚂蚁，一直专注在前端和智能结合的方向上，今天为大家带来的分享是《跨端智能在蚂蚁的应用》。

在分享开始前，先给大家看一个有趣的小应用：

这是香奈儿官网上的一个虚拟试妆的应用，应用可以实时检测摄像头内人的嘴巴和眼睛的位置，并且根据你选择的口红和眼影等的款式，进行动态上妆。整个应用都是跑在浏览器内，包括检测服务的代码等。这个应用就是一个典型的端上的端上智能应用。

什么是智能应⽤？

提到智能应用，一个智能应用是怎么构成的呢？ 可以看到，一个智能应用是由应用+智能服务构成的，比如上面那个香奈儿的例子，眼睛和嘴巴的检测服务就是一个智能服务。如果一个智能服务部署在云端上面，那么就是“云智能”；如果部署在端上，就是“端智能”。那么端智能相对于云智能有哪些优点呢？我理解有以下几点：

• 实时性高。相对于云智能来说，端上实时产生的数据立马就能被消费掉，例如摄像头产生的图像，可以直接在端上做检测，而不用将图像数据发送到云端。
• 保护隐私。因为数据全部在端上消费，实时消费实时销毁，用户的隐私数据可以做到不出端，从而能够有效保护用户隐私。
• 节省云端计算资源(省成本)。算力都是分布在各个端上，从而能节省一笔非常可观的计算成本。

跨端智能指什么？

好了，上面为大家介绍了什么是端智能以及端智能的优点。我们今天的主题是“跨端智能”，顾名思义，跨端智能就是指：

跨端智能可以不依赖具体的native客户端能力，一套代码可以直接部署到任何js环境内。例如一个具有智能能力的小程序，可以同时部署到支付宝、手淘、微信等。

实际业务案例分享

下面为大家介绍两个我们落地的实际业务案例：第一个是“宠物相机”项目：

宠物的鼻纹和人的指纹一样，具有唯一性，所以我们可以利用宠物鼻纹对每一只宠物进行建档。档案可以用于宠物保险的购买、宠物防丢、宠物证发放等等。所以宠物鼻纹的采集就是一项关键的工作。我们之前是让用户手动上传宠物的照片进行建档，但是建档的成功率非常低。

从上图可以看到，用户上传的照片存在各种各样的问题，一旦照片不合格，就会导致建档失败，用户体验不好的同时也降低了业务的建档成功率，导致业务发展受阻。我们是怎么解决这个问题的呢？

我们在宠物相机的小程序内部署了一套跨端智能服务，在用户打开摄像头后，我们实时地分析相机帧，当服务检测到复合要求的相机帧后会对这一帧进行抓拍，这样就得到了一张符合要求的宠物照片。最终我们达到了一个80%+的成功率的提升。目前，宠物相机的小程序已经在支付宝、手淘、闲鱼以及微信上进行了投放。

再给大家分享一个案例：碎屏险相机。

在蚂蚁推出碎屏险业务的时候，是业内唯一一家能够做旧手机碎屏险的公司，因为旧手机投保和新手机投保不太一样。很多人会在手机已经碎屏后再去投保，而公司又很难去判断用户投保时候是否已经碎屏了，导致碎屏险的赔付率很高。蚂蚁通过AI的技术去解决了这一问题。和宠物相机一样，如果让用户手动上传屏幕照片，会有很多问题： 上面这些不合要求的照片都会影响云端对手机屏幕是否碎屏的判断。

我们开发了碎屏智能相机，实时引导用户对镜拍摄屏幕，抓拍出清晰、大小合适的屏幕照片，然后交由云端做投保判断，保证了碎屏险业务的成功落地。

业务落地遇到的技术挑战

当然，业务落地的过程也不是一帆风顺的，技术上的难点成了业务落地的一个关键的阻力。

前端上的高性能计算是一个非常头疼的问题，主要在两个方面：受限于前端环境、中低端安卓手机的低性能硬件。上面分享的两个案例对实时计算要求非常高，因为需要实时抓怕，如果计算速度过慢，一是用户体验非常差，二是可能计算出一帧后，用户的手又抖动了，导致抓拍失败。所以业务方对技术提出了很高的要求。

我们是如何解决这些技术挑战的？

所以，我们是怎么解决这个问题的呢？在介绍具体的方案之前，先和大家一起回顾下我们之前说的“智能应用”：

我们把智能服务再展开下：

一个“智能服务”由AI模型和计算模型的引擎构成，这个模型可以理解为一个文件，文件里面存储了一堆数据，我们利用引擎对这些数据做各种计算，引擎可以调用端上的各种硬件能力，例如GPU、CPU等等。那么引擎的性能就决定了智能服务的速度及应用的实时性。

我们初版采用了google的TF.js作为计算引擎，但是当时的手机机型覆盖率只有30%，也就是说大部分手机都没法支持模型的高性能计算。所以，我们的目标就是优化引擎的性能。前端上面最常用的高性能计算手段就是利用WebGL做高性能计算，这样能够利用到GPU的高性能计算能力，我们的引擎就是利用WebGL做模型计算的。目标就简单了：优化引擎的WebGL计算性能。好了，我们正式开始。一个AI模型的计算本质其实是矩阵的各种操作，例如加减乘除。我们一起复习下矩阵的乘法操作：

原理十分简单，就是对左边矩阵的一行乘以右边一列，例如 1*7 + 2*9 + 3*11 = 58。是不是十分简单呢？好了，大家看到这里，相信已经掌握了看似高大上的人工智能技术了。

从上面动画可以看到，我么在做矩阵乘法的时候，GPU每次缓存16个值，实际上我们只有4个值能够命中缓存，有75%的缓存都被浪费了，这样就导致内存读取出现了瓶颈。 我们通过一定的编码手段，将矩阵在GPU内的存储方式改为块状的，这样每次读取的时候，能够最大化地利用GPU的缓存，减少cache miss的次数，这样就提升了整体的计算性能。当然，优化内存I/O只是我们其中的一种手段，我们还做了很多其他的优化，例如模型图的优化、GPU的向量化、混合精度计算等等。通过一系列的优化之后，我们将引擎的性能提升了100%+，机型覆盖率也从30%提升到了93%。保证了业务的成功落地。

未来展望

现在我们正在自研我们蚂蚁的跨端引擎，在引擎的体积和性能上都做了很多的工作，未来我们会把跨端智能引擎及相关体系对社区做开源，大家敬请期待吧！