imgcook 被 Thought Works 技术雷达收录 & CCF B类论文发表

简介: 可见,从 Thought Works 团队到前端技术行业,对于 imgcook.com 的价值虽然保持肯定态度,但是,对于智能生成代码的应用场景和代码可维护性还是普遍存在担忧。因此,前端智能化方向和 imgcook.com 的 D2C (Design To Code)技术还需要进一步的成熟和完善,用优秀的产品品质、先进的技术和扎实的服务,真正赋能一线前端研发人员,做到“技术普惠”。也因此,我想针对应用场景和代码的可维护性问题做一些简要的说明,借此打消一部分用户的疑虑。

image.png

作者: 甄子

在这个春暖花开的日子,前端智能化的核心技术产品 imgcook.com 被 Thought Works 的 24 期技术雷达收录,ICON 识别的论文已正式发表(https://dl.acm.org/doi/10.1145/3397481.3450671)。


Thought Works 的 24 期技术雷达,指出:https://insights.thoughtworks.cn/thoughtworks-techradar-vol-24/


「imgcook是阿里巴巴旗下的软件即服务产品。它可以通过智能化技术把不同种类的视觉稿(Sketch/PSD/静态图片)一键生成前端代码。imgcook可以生成静态代码,如果你定义了领域专用语言,它也可以生成数据绑定模块代码,该技术还没达到完美的程度,设计人员需要参考某些规范,以提高代码生成的准确性(此后仍需开发人员的调整)。我们对于魔术代码生成一直十分谨慎,因为从长远看,生成的代码通常很难维护,imgcook也不例外。但是如果你限定它用于特定的上下文,例如一次性活动广告页,这项技术值得一试。


image.png


可见,从 Thought Works 团队到前端技术行业,对于 imgcook.com 的价值虽然保持肯定态度,但是,对于智能生成代码的应用场景和代码可维护性还是普遍存在担忧。因此,前端智能化方向和 imgcook.com 的 D2C (Design To Code)技术还需要进一步的成熟和完善,用优秀的产品品质、先进的技术和扎实的服务,真正赋能一线前端研发人员,做到“技术普惠”。也因此,我想针对应用场景和代码的可维护性问题做一些简要的说明,借此打消一部分用户的疑虑。



imgcook 应用场景问题



应用场景问题诚如 Thought Works 所言,imgcook 首先是一款通过视觉稿一键生成前端代码的 SaaS(软件即服务)技术产品,通过访问 imgcook.com 即可使用全部功能。其次,通过 DSL(Domain-Specific Language 领域专用语言)的定义,imgcook 可以适用于:前端、客户端、小程序等不同的领域。


最后,通过 CLI(Command-Line Interface 命令行界面)将 imgcook 的功能深度整合进自己的前端业务平台,并利用 imgcook 的字段模型拓展自己的业务数据对象识别能力,即可适用于:用户产品、工具产品、营销导购产品、营销活动承接页……等一系列业务场景。


image.png


imgcook 研发效能数据概览


现已在阿里巴巴集团超过 17 个 BU 落地,超过 20 个团队通过 API 调用 imgcook 技术能力建设自己的业务平台,支撑着各种 C 端业务场景和移动端业务。此外,通过 imgcook 还能够生成以 CRUD 为核心功能的中后台页面代码,已经大规模在阿里云等业务上落地应用。



imgcook 代码可维护性问题



代码的可维护性问题一直是我们关注的焦点,从最初的生成代码规则中对于:变量命名规范、变量书写规范、变量使用规范等,到代码可用率度量,我们用丰富的维度去全面考察 imgcook 生成代码的可用率和可维护性:


image.png

布局可用趋势(括号内为统计样本数量)

全部视觉稿

图片

Sketch上传

PSD插件

Sketch插件

08

06

04

02

0

如女来祝如0您老家奥,推中部中市济物g朝5限加球球泸

baocountRate

Av9ScORe

更新时间

详情

布局可用Jr

模块ID

算法版本

模块名

管理员

项目ID

2021-05-100

详情

22069

a3xkaogo

1112222333

99.97%

80399

v0.2.11

1:59:27

2021-05-100

详情

Hbaux70a

80395

12956

1241

100%

v0.2.11

1:45:53

2021-05-100

详情

B7fpStpv

79968

21994

100%

v0.2.11

test1

1:38:35

青溪-工具-合

2021-05-101

详情

80390

100%

FwgORMI

v0.2.11

22032

2:06:16

2021-05-101

详情

100%

v0.2.11

80388

22062

IWiNTJBM

dome

1:59:28

2021-05-101

车轮个人

详情

Qcrl1GFP

vo.2.11

80383

22061

100%

1:55:16

2021-05-101

详情

修改信息

n7kJ2040

19910

80366

v0.2.11

100%

1:21:19



代码可维护性的指标度量和监控


并且,每周都会对 Badcase 进行详细的分析,从中找出工程技术、规则算法和机器学习模型能力的问题和缺陷,加以改进,平均每个月因此修改的 BUG 和问题有数百个之多,持续的改进和迭代,持续的用户使用和反馈,让 imgcook 可以形成以用户体验为驱动力的增长飞轮。



对未来的思考



首先,我们会继续关注:应用场景泛化能力代码生成准确率 这两个核心指标,根据用户的反馈不断借助机器学习的能力进行优化和迭代,用优秀的体验和坚若磐石的产品质量,真正服务好一线研发同学打造普惠的技术。


其次,利用 https://github.com/alibaba/pipcook 提供的前端机器学习框架,帮助一线开发者借助机器学习的能力定制自己的算法模型,进一步提升 imgcook 在业务上的表现力。


image.png




最后,围绕动画、动效、富交互……等问题,用 imgcook 降低前端在复杂需求、跨平台、跨场景业务开发过程中遇到的实际研发问题,进一步提升前端技术的业务表现力,让前端技术支撑的业务彻底摆脱生产力束缚。


从 CCF 论文 IconFont 识别为起点,阿里巴巴前端委员会智能化方向必将产出更多有价值的研究成果,分享到各种顶会和学术期刊上接受同行的检验,让我们可以用更加客观、更加全面的视角,来评价我们的研究和技术工程成果是否具有技术先进性。


同时,也能够用这种方式来为前端技术带来更多新的思考和理论工具。我会和阿里巴巴前端委员会、智能化方向、淘系技术前端、F(x)Team、开源社区和技术生态的伙伴们一起,继续努力和坚持我们“技术普惠、赋能一线研发”的理想,让时间来证明一切吧。


欢迎大家与我们交流:https://juejin.cn/post/6952774108543188999


image.png

相关文章
|
机器学习/深度学习 人工智能 算法
一文让你了解AI产品的测试 评价人工智能算法模型的几个重要指标
一文让你了解AI产品的测试 评价人工智能算法模型的几个重要指标
1584 0
一文让你了解AI产品的测试 评价人工智能算法模型的几个重要指标
|
机器学习/深度学习
基于PaddleGAN精准唇形合成模型实现美女表白视频
基于PaddleGAN精准唇形合成模型实现美女表白视频
981 0
基于PaddleGAN精准唇形合成模型实现美女表白视频
|
安全 Java API
手把手带你实现第三方应用登录
手把手带你实现第三方应用登录
1529 0
手把手带你实现第三方应用登录
|
6月前
|
人工智能 前端开发 JavaScript
AI程序员:通义灵码 2.0应用VScode前端开发深度体验
AI程序员:通义灵码 2.0应用VScode前端开发深度体验,在软件开发领域,人工智能技术的融入正深刻改变着程序员的工作方式。通义灵码 2.0 作为一款先进的 AI 编程助手,与广受欢迎的代码编辑器 Visual Studio Code(VScode)相结合,为前端开发带来了全新的可能性。本文将详细分享通义灵码 2.0 在 VScode 前端开发环境中的深度使用体验。
1075 2
AI程序员:通义灵码 2.0应用VScode前端开发深度体验
|
Kubernetes API 调度
在K8S中,各个组件及其作用是什么?
在K8S中,各个组件及其作用是什么?
|
5月前
|
Linux 应用服务中间件 网络安全
如何搭建宝塔面板
本文介绍如何在Linux服务器上搭建宝塔面板,一个功能强大的Web服务器管理工具。内容涵盖从安装Linux系统、宝塔面板的部署,到配置服务器、添加网站、安装SSL证书等详细步骤。同时分享了可能遇到的问题及解决方法,如阿里云防火墙设置。宝塔面板简化了站点与服务器管理,适合需要高效管理服务器的用户。
284 2
|
前端开发 API
自定义 Hooks 在 Vue3 中的应用和重要性
自定义 Hooks 在 Vue3 中的应用和重要性
|
SQL 安全 数据库
SQL实践指南:从基础到进阶的数据库查询与管理
一、引言 在数据驱动的时代,数据库已成为各行各业不可或缺的一部分
|
存储 Android开发 Kotlin
Kotlin开发安卓app,在使用 MediaPlayer 播放 res/raw 中的音乐时遇到突然中断的问题,而 onErrorListener 没有接收到任何报错
在使用 Android MediaPlayer 播放 res/raw 中的音乐时遇到中断问题,可能的原因包括资源问题、媒体文件编码格式、生命周期管理和设备资源配置。要排查问题,检查音频文件是否正确包含,格式编码是否支持,MediaPlayer 是否正确管理及释放,以及设备是否有足够存储和配置。通过设置 onErrorListener 日志和确保在 onDestroy 中释放资源来调试。如果文件过大,考虑使用 AssetManager。遵循这些步骤可帮助诊断并解决播放中断的问题。
|
编解码 前端开发 Java
JSR 303 验证以及国际化具体使用加案例分析
JSR 303 验证以及国际化具体使用加案例分析
298 0
JSR 303 验证以及国际化具体使用加案例分析