HarmonyOS开发者限时福利来啦!最高10w+现金激励等你拿~ 了解详情
写点什么

WebAssembly 在性能及加密场景的深度探索

  • 2019-11-08
  • 本文字数:2950 字

    阅读完需:约 10 分钟

WebAssembly在性能及加密场景的深度探索


随着 Web 技术的不断发展, WebAssembly 非常有技术前景。尽管很多公司已经尝试并落地 WebAssembly ,但仍有很多公司及开发者处于观望状态,他们并不了解如何将 WebAssembly 融入到现有的项目中。coupang 优先尝试 WebAssembly 并落地 ,将其融入到自己的项目中 ,目前对 WebAssembly 的探索已经小有成就。


在即将于 12 月 20~21 日举行的 GMTC 全球大前端技术大会 (深圳站) 上,coupang 高级软件开发工程师赵洋老师将分享《WebAssembly 在性能及加密场景的深度探索》。届时,他将通过 coupang 实际落地的两个项目,分享这两个项目不断演进的过程以及未来的发展方向,深入探讨 WebAssembly 的性能及保密相关的优势。通过分享让大家有所启发,并能够逐步引入 WebAssembly 技术提升自身的开发效率和产品体验。以下是 InfoQ 对赵洋老师的会前采访。


InfoQ: 请您简单介绍下自己以及自己所负责的工作。


赵洋: 我个人职业经历比较丰富,曾在百度、腾讯担任过前端工程师,也在全民直播这样的创业公司担任过前端开发经理;目前在 coupang 的 CMG 团队担任高级软件开发工程师。


coupang 是一个非常具有前景但很低调的独角兽公司,主要从事韩国电商相关的业务,目前也在积极发展国内商家的入驻。我所属的 CMG 在公司内部是一个非常年轻的团队,目前主要负责广告媒体平台的相关工作。coupang 非常崇尚 Work Life Balance,并且鼓励个人对外发声和贡献社区,因此我个人除了在公司团队内部贡献力量外,也时常编写一些围绕 WebAssembly 相关的开源项目,包括 SecurityWorkerWXInlinePlayer 等,同时也会参与一些著名开源项目,为之贡献代码,比如 ShadowNode、Vue 等。


InfoQ: 1995 年 JavaScript 诞生,2008 年浏览器加入即时编译器 JIT,JavaScript 的运行速度快了 10 倍。有人说,现在的 WebAssembly 是另一个转折点,您怎么看?


赵洋: 相较于 JavaScript 而言,WebAssembly 的性能提升是我们感受最明显的部分,在我们的业务场景测试中,对于 CPU 密集相关的应用来说,WebAssembly 确实有非常巨大的提升。但由于我们的大部分前端项目主要面向 UI 场景,在这个场景中 WebAssembly 与 JavaScript 需要频繁的相互调用并交换数据,导致通信成本比计算成本要高得多。因此,如何更好地利用 WebAssembly 仍然需要因地制宜,根据自己的场景来测试和选择。从技术趋势来看,随着 5G 技术的出现和硬件性能的提升,我们可以预见,Web 平台能够承担的复杂工作会越来越多,尽管 V8 每年仍会提升 JavaScript 的性能,但这种提升逐渐变缓,JavaScript 已经慢慢变为整个 Web 平台发展的瓶颈,所以 WebAssembly 的出现无疑是非常让人兴奋的。这并不是说 WebAssembly 会取代 JavaScript,前端工程师们也无须担心这种情况的发生,我觉得两种技术应该会不断融合,最终为 Web 创造更多可能性。


InfoQ:coupang 当初引入该技术的契机是什么?


赵洋: 我们的大部分前端项目面向 UI 场景, WebAssembly 与 JavaScript 需要频繁地相互调用并交换数据,我们主要使用 JavaScript 编写相关代码,然后采用混淆等方式增大代码被破译的难度,但从数据上看,效果并不是很好。


再加上 C/C++ 代码由风控团队编写和维护,他们能够很方便地编译到 iOS 和 Android 端;对于 Web 端来说,我们需要不断地同步他们的代码,并将 C/C++ 代码改写为 JavaScript ,由于风控的策略相关代码更新非常频繁和琐碎,这样不但会降低工作效率,还加大了开发成本。


所以我们引入了 WebAssembly ,这样就可以更好地复用 C/C++ 代码,其中包括人机识别的日志内容加密、活动页面的请求加密等,不仅跨部门跨团队能有效沟通提升工作效率,还能减少开发成本。


InfoQ: 未来,您认为 WebAssembly 将会如何发展?会有哪些典型的应用场景?


赵洋: 相对于 WebAssembly 更多被提及的性能,我觉得大家还应该把目光放在代码复用上。现在,越来越多的平台和语言开始支持 WebAssembly,我相信在未来也会有更多的新技术成果出现在 Web 平台上,从而使得 Web 具有更多的可能性。目前 WASI(WebAssembly System Interface)的出现已经逐步让 WebAssembly 的使用场景更为宽广。通过 WebAssembly 对其他平台、语言的代码进行更好的复用,我觉得这是非常重要且正确的路线。


InfoQ: WebAssembly 在性能及加密场景的探索中遇到的最大的难点是什么?团队是解决的?


赵洋: 在我们的实践中 ,WebAssembly 在性能上遇到的最大难点是,目前优化手段十分有限。例如,其多线程相关的支持还不太可用,也不支持汇编代码编译、AVX 指令等,但这些问题在之后的版本中应该会逐渐解决。而在加密场景中,我们目前仍然没有解决的问题是, WebAssembly 编译后 Codebase 过大。后期我们会和风控团队合作,逐步精简目前的库代码,使得 Codebase 进一步减少。目前风控日志加密这块收益比较大,过滤了 Web 端大量不专业的羊毛党用户,降低了公司的损失。


InfoQ: 京东、淘宝在前端也有基于 WebAssembly 的探索,coupang 在 WebAssembly 的应用上与之相比,有何异同?


赵洋: 相比于京东或淘宝来说,coupang 还是非常年轻的。因此,在技术以及产品上我们也在不断学习两家的优点,并对好的部分做一些内化和提升。同时,coupang 在 WebAssembly 的应用会更加直接面向用户,而不仅仅是内部探索。当然,目前 WebAssembly 在 coupang 的使用主要还是针对一些小的场景点进行提升、优化,仍然有非常大的提升空间。


InfoQ: WebAssembly 也出现了一段时间,就技术本身而言我们更想知道您即将在 GMTC 分享的两个实践案例,可以简单介绍下吗?


赵洋: 这次分享,主要通过我开源的两个项目 WXInlinePlayer 和 SecurityWorker 来介绍自己对 WebAssembly 的一些理解和实践经验。


WXInlinePlayer 是一个通过 WebAssembly 解码 FLV 的播放器项目,主要是为了解决移动端 Web 播放器体验不一致的问题,相较于手淘、花椒以往使用 WebAssembly+FFmpeg 进行的技术探索而言,WXInlinePlayer 通过自己实现 I/O、解码、渲染层等,大幅度减小了播放器核心的代码大小,并且针对于直播场景添加了一些减少延迟及优化体验的策略。届时我将和大家分享 WXInlinePlayer 的架构及实现细节,并一起探讨未来 WXInlinePlayer 的一些可行的性能提升策略。


SecurityWorker 是一个类似于 WebWorker 的独立 VM,其中使用了 WebAssembly 和 Duktape,并且自己实现了一些 Opcode 的设计和实现。其主要场景是用来保护业务中核心的 JavaScript 通讯逻辑。其参考了 Google reCAPTCHA 以及 Native 端的一些代码保护手段(VMP),目前 SecurityWorker 这套技术稳定使用在 coupang 的 Web 的风控日志加密上。我会和大家详细介绍 SecurityWorker 的前世今生,以及未来的规划。


活动推荐


在即将到来的 GMTC 深圳 2019 上,赵洋老师还会具体分享到,如何更好地保护前端的核心代码?如何更好地适配 Mobile 端播放器?以及常规的代码保护方案、Google reCAPTCHA 所采用的方案调研、WebAssembly 的落地方案、各方案优劣势对比、如何结合自身的场景去提升性能、缩小生成体积、增强编码体验等。


除了赵洋老师的分享,本次 GMTC 全球大前端技术大会(深圳站)2019 我们还设置了小程序挑战与应对、音视频技术、Serverless 实践、前端测试与安全、大前端工程化、Flutter 实战、新兴编程语言、团队建设与管理等热门技术专场。


2019-11-08 15:343210

评论

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

设计模式之观察者模式

乌龟哥哥

5月月更

ffmpeg封装格式转换

Loken

音视频 5月月更

直播预告丨OpenHarmony标准系统多媒体子系统之视频解读

OpenHarmony开发者

OpenHarmony 多媒体

WorkPlus IM即时通讯:快速集成、私有化部署、安全加密

WorkPlus

5.17电信日 | 融云积极消除数字鸿沟 助力打造数字化新基建

融云 RongCloud

融云 x Zervo:打造欧美 Z 世代社交的「主题幻想世界」

融云 RongCloud

FFmpeg安装

Loken

音视频

听说你在写Python爬虫,你对浏览器的开发者工具了解多少?【多图预警】

梦想橡皮擦

5月月更

Druid连接池源码阅读07

石小天

druid源码学习七

Nick

有了这10个GitHub仓库,开发者如同buff加持

华为云开发者联盟

GitHub 开源 Web 软件开发

MAE自监督算法介绍和基于EasyCV的复现

阿里云大数据AI技术

深度学习 算法 自监督学习

苹果 AppStore 财年和账单那些趣事

37手游iOS技术运营团队

apple appstore App生态

Apache Kafka 分层存储(Tiered Storage)技术解析

移动云大数据

kafka

架构训练营第一次作业

地下地上

比特币跌破27000美元!币圈大佬损失惨重,最高身价缩水近9成

CECBC

区块链有什么价值?

CECBC

7件大事回顾加密史上最疯狂一周

CECBC

【C 语言】指针 Three 之 [赋值语句的方法、指针变量的大小、上述总结、 * 和 & 认识、对解引用(*)认识]

謓泽

5月月更

使用 nginx 配置项的好习惯

liuzhen007

nginx 5月月更

揭秘华为云GaussDB(for Influx):数据直方图

华为云开发者联盟

数据库 华为云 GaussDB(for Influx) 数据直方图 直方图

极狐GitLab yum/apt repo正式开放,更顺畅的极狐GitLab安装升级体验

极狐GitLab

极狐GitLab 安装源

探索开源工作流引擎Azkaban在MRS中的实践

华为云开发者联盟

开源 MRS Azkaban 开源工作流引擎

Go 语言入门很简单:AES加密和解密

宇宙之一粟

AES Go 语言 5月月更

Wallys-AR9582 /2x2 MIMO /Industrial-grade/ 902-928Mhz

wallys-wifi6

架构实战营模块一作业

融冰

springboot启动失败的问题('hibernate.dialect' not set)

程序员欣宸

Java 5月月更

网站开发进阶(七十一):css伪元素::before和::after用法详解

No Silver Bullet

css3 5月月更 伪元素 伪类

你说写代码,最常用的3个设计模式是啥?

小傅哥

设计模式 小傅哥 架构设计 代码优化 设计原则

C语言打印程序行号、日期方便调试程序

DS小龙哥

5月月更

浅谈 Fiori Fundamentals 和 SAP UI5 Web Components 的关系

汪子熙

前端开发 UI SAP Fiori 5月月更

WebAssembly在性能及加密场景的深度探索_大前端_叶兰_InfoQ精选文章