写点什么

如何建立图片数据与用户注意力之间的连接?

  • 2019 年 12 月 16 日
  • 本文字数:942 字

    阅读完需:约 3 分钟

如何建立图片数据与用户注意力之间的连接?

生产工艺-图文渲染

如果说生产架构解决了宏观的生产工序问题,那么渲染就是面向微观的工艺问题。


渲染首先要解决的是效果统一,除了直接通过服务端渲染图片以外,在商家侧需要所见即所得的二次编辑能力,也就是对于同一套 DSL 数据协议,在前后端需保证渲染效果统一,为此我们构建了前后端同构的渲染方案,开发了基于 canvas 的画布引擎,在前端通过 UI 的包装提供图片可视化编辑能力;在云端通过 puppeteer 无头浏览器加载 canvas 画布引擎实现图片生产。



其次渲染需要保证对视觉设计的还原能力,尤其是文字渲染效果。前端渲染对丰富文字效果的支持由于字体库安装问题很难完成,同时后端也缺乏对文字效果的标准协议定义。而有了同构的渲染能力后,我们可以将前端协议的优势与后端字体库的优势结合,灵活的完成视觉还原。


淘宝首焦 banner 场景下,单字单样式的模板较普通模板在 AB 分桶试验下点击率平均提升约 13% 。


生产保障-性能优化

在 10 亿 量级的规模下,如果没有高性能的工程保障,一切效果的提升都是零,双十一期间鹿班的平均合图 RT<5ms ,从 DSL 解析到 OSS 上行链路完成平均 RT<200ms ,在没有增加机器资源的情况下,实现了相较于去年的整体系统吞吐性能提升 50% 。整个后端引擎分为两部分:



渲染:将结构化的 layer 数据转换为独立的图片数据流。不同类型图层转换交由对应的 handler 处理。执行并行化渲染。


合图:将渲染得到的多个图层数据进行图像合并计算,经过编码压缩,图片上传,得到成图。


性能优化主要分以下几点:


图层拉取并行化,本地采用 LRU-K 主动缓存,减少 tfs 拉图消耗。


GPU 显存主动调度管理,对显存预先分段分片,减少频繁显存的申请分配与释放消耗。


jpg 编码优化,通过 SIMD 进行加速,软编码的平均耗时由 70ms 下降至 20ms 。


未来展望

图片作为商品信息展示的重要载体,无论是在公域的搜索推荐还是私域的店铺详情都承担着传递商家意图与帮助消费者决策的双重作用。


对于商家:通过技术与数据赋能商家在图片生产上的持续优化,让结构化的图片能够更好的被机器理解,更高效的分发。同时增加商家的运营抓手。


对于消费者:利用更多维的图片特征获得对受众更泛化更精细的刻画能力,更好的满足甚至激发用户兴趣。


本文转载自淘系技术公众号。


原文链接:https://mp.weixin.qq.com/s/OCIo4nY2YVWHU0t5O_-a4g


2019 年 12 月 16 日 18:56250

评论

发布
暂无评论
发现更多内容

设计微博系统中”微博评论“的高性能高可用计算架构

方堃

Hadoop实战篇(1)

进击的梦清

大数据 hadoop Linux

模块5作业

dwade

#架构实战营

高级软件工程师必备的五大技能

架构精进之路

6月日更 软素质

【译】JavaScript 代码整洁之道-函数篇

KooFE

JavaScript 大前端 函数 6月日更 整洁代码

Go并发编程-channel多路复用

Rayjun

Go 语言 select

架构实战营 模块五:学习总结

👈

架构实战营

Go 并发基础

Damon

Go 语言 6月日更

Golang channel 通道

escray

学习 极客时间 Go 语言 6月日更

【Vue2.x 源码学习】第五篇 - 数组的劫持

Brave

源码 vue2 6月日更

一个被慕课网拿去做Java就业班终极项目的开源商城项目,推荐给大家

易烊艳芬

Java 开源 springboot

Java 并发编程—— CountDownLatch 应用

Antway

6月日更

商业模式创新

soho

如果父母依旧辛苦,那我们的成长又有什么意义?

牧小农

故事 父母

身为程序员 你真的会使用github搜索吗?

小胖说java

GitHub GitHub Pages 高效搜索 搜索技巧

模块五 作业

夏日

架构实战营

网络攻防学习笔记 Day36

穿过生命散发芬芳

网络攻防 6月日更

Python位运算符——详解

在即

6月日更

NCRE考试感想 四级嵌入式(上)

万里无云万里天

嵌入式 6月日更 NCRE 考试经验

架构实战营 模块五:课后作业

👈

架构实战营

MySQL基础之三:条件查询

打工人!

MySQL 6月日更

音频和视频流最佳选择?SRT协议解析及报文识别

明儿

音视频 协议 流媒体开发

newbee-mall开源项目被慕课网拿去做课程,然后我毫不知情,这又是什么骚操作?

易烊艳芬

Java 开源 springboot

标识符与保留字(即关键字)

在即

6月日更

可落地的积极心态

Daniel

心态 6月日更

Kubernetes手记(2)- 核心组件/附件

雪雷

k8s 6月日更

技术管理简单说

Daniel

技术管理 6月日更

权限与认证:基于JWT的授权实现

程序员架构进阶

架构 JWT 认证授权 28天写作 6月日更

newbee-mall开源项目被慕课网拿去做课程,项目详细对比记录,更多实锤看这里

易烊艳芬

Java 开源 springboot

模块5 设计微博系统中”微博评论“的高性能高可用计算架构

Chris Cheng

架构实战营

JSON.parse无双引号如何实现转换

DisonTangor

JavaScript

如何建立图片数据与用户注意力之间的连接?-InfoQ