面向未来的 AI 研发和前端领域大模型

第 19 届 D2 终端技术大会将于 3 月 8 日在杭州举办。

现在,前端写代码越来越高级了。 只需要上传一张图片,就轻松写出前端界面的源代码。原本3小时的活,现在1小时搞定。

在喝杯咖啡的时间里,让代码自动生成,想想就有点小激动!

所以,我配拥有一个吗?(bushi

来看看蚂蚁内部怎么干(mo)活(yu)的?

一张图就能搞定中后台页面,简直是前端开发者的"懒人神器"!

首先,把图片切成几块,挑选出你想要生成代码的部分,然后狠狠地点击"生成代码"按钮!

接下来,选择你喜欢的技术栈和框架。

然后,坚定地点击"OK",让代码生成的魔法开始发挥作用!

最后,放松等待几分钟,小茶时间结束后,你就能看到闪闪发光的代码和炫酷的效果预览啦!

这个代码有没有生成到你的"心趴"上呢?

不止中后台,移动端也能一键生成,简直是"码农的魔法棒"!🪄挥一挥,页面搞定了!

不满意怎么办?还能支持二次调整,让你秒变前端大神!

如果页面很大怎么办?让俺复刻一个 B 站的首页,从自动切图分区到代码生成,只需要几分钟的时间,原本需要花个把小时开发。

她叫 WeaveFox

这个工具叫什么呢?没错,就是 WeaveFox。

WeaveFox 是由蚂蚁前端团队自研的 AI 工具。是面向 AI 时代的前端智能研发平台,基于蚂蚁百灵多模态大模型打造,能够根据设计图直接生成前端源代码,为前端研发带来高质、高效、高产的研发体验。平台目前已支持控制台、移动端 H5、小程序、以及局部卡片等多种主流应用类型。

从图到码:技术揭底

WeaveFox 基于蚂蚁自研的百灵多模态模型构建,是具备细粒度 UI 理解能力的前端领域大模型,为前端开发提供了更精准的代码生成和优化能力。


D2 分享

回顾过去的 2024 年,AI 技术持续多维突破。从技术演进维度看,基于 transformer 架构的大模型持续改进训练效率,多模态学习、具身智能等前沿方向取得了一定突破进展;在应用落地维度,行业解决方案正在显现出垂直领域特征,医疗和制造等场景的专用模型开发加速推进;技术标准体系方面,目前看还尚未形成统一的产业共识实施标准。基础理论框架和应用范式来看,AI 技术体系到目前仍没有收敛,在我们所处的前端技术领域,似乎正在经历"需求爆发与技术重构"的双重变革,同时也让我们看到了很多新机会。

技术团队日常面临着大量的网页开发需求,如小程序、H5、移动端卡片、中后台页面、营销页面等。而界面类开发存在诸多痛点,编码和调试耗时漫长,手工切图繁琐且易出错,设备兼容性与业务多样性带来高昂成本,并且依赖开发者丰富经验,往往需要多种角色协作。

为解决这些问题,我们基于蚂蚁自研的多模态技术和大模型基础设施打造了前端领域大模型,实现输入任意设计图,直接生成可用源代码,从而提升开发效率。将前端领域大量高质量数据进行无损压缩颇具挑战,我们为此构建了千万级别高质量训练样本,搭建高效训练架构以支撑敏捷迭代模型版本,自建了评测体系,支持多维白盒指标评测和纯图理解泛化评测,以此判别模型性能基线是否得到优化。同时,为了让下游生态更易兼容和集成,我们建立了完备描述语义 UI 的 IR-Spec 底层标准,这一标准具备广泛的意义,不仅支持技术栈扩展,能够支持市面上流行的框架和类库,如 React、Vue、小程序、Ant-design、ElementUI 等。生成的生产级 CleanCode 可与人工实现相媲美,涵盖 icon 自动识别、高阶组件封装、循环结构识别生成、自动适应布局、语义化代码变量、图片资源自动切图以及复用和封装处理等功能。

2025 年,是前端领域智能产业升级的重要一年,这次 D2 大会上,蚂蚁集团平台智能体验技术负责人达峰会带来面向未来的 AI 研发升级和前端领域大模型相关的介绍以及后续的技术开放计划分享,共同探讨前端的新机遇,共享技术变革的红利。

欢迎大家参与,3 月 8 日,期待我们在杭州相见!

大会网站:d2.alibabatech.com/

相关推荐
bin91531 分钟前
DeepSeek 助力 Vue3 开发:打造丝滑的表格(Table)之添加行拖拽排序功能
前端·javascript·vue.js·ecmascript·deepseek
跟着汪老师学编程7 分钟前
24、web前端开发之CSS3(一)
前端·css·css3
beibeibeiooo12 分钟前
【CSS3】01-初始CSS + 引入 + 选择器 + div盒子 + 字体修饰
前端·css·css3
孤╮独的美20 分钟前
CSS3:深度解析与实战应用
前端·css·css3
一城烟雨_28 分钟前
Vue3 实现pdf预览
前端·vue.js·pdf
易xingxing33 分钟前
探索HTML5 Canvas:创造动态与交互性网页内容的强大工具
前端·html·html5
好_快42 分钟前
Lodash源码阅读-arrayPush
前端·javascript·源码阅读
好_快44 分钟前
Lodash源码阅读-equalByTag
前端·javascript·源码阅读
大土豆的bug记录6 小时前
鸿蒙进行视频上传,使用 request.uploadFile方法
开发语言·前端·华为·arkts·鸿蒙·arkui
maybe02096 小时前
前端表格数据导出Excel文件方法,列自适应宽度、增加合计、自定义文件名称
前端·javascript·excel·js·大前端