年终盘点AI:与前端技术结合产生的奇妙化学反应

前言

去年年底 ChatGPT 的横空出世,在极短的时间风靡全球。一时间,OpenAI 也因为开发并推出了 ChatGPT 成为了全球瞩目的公司。ChatGPT 就像是一条线,拉进了我们与 AI(人工智能) 的距离,很多普通人都能使用它解决一些工作或生活的问题。人工智能目前其实已经进入了我们生活的方方面面,比如人脸识别,自动驾驶,AI绘画,AI视频等等。在未来,将会有更多人工智能+的产品进入我们的生活,方便我们的衣食住行,增加我们的生活趣味。

接下来,我将会站在前端的角度分析一下在未来 AI 会给我们带来什么样的机会与挑战。

自动化生成代码

对于我们开发者而言,实际上有很多场景都是有业内比较成熟的解决方案的,我们可以通过训练 ChatGPT,让它为我们生成我们想要的代码,解放我们的生产力。笔者认为我们前端领域目前比较火热的低代码开发,就可以考虑接入 ChatGPT,更智能的生成页面。

比如 laf 平台目前已经创新地接入了 ChatGPT,在编写云函数之前,我们可以通过简短的描述让 ChatGPT 智能地生成符合 laf 使用标准的函数,再在这个基础上进行简单的修改即可完成一个功能函数的开发。

自动生成前端组件

自动生成前端组件是一个非常富有前景的方向。想象一下,你可以通过描述你想要的效果,甚至发送一张图片,就可以指定前端语言利用 AI 生成一个组件,对一些比较复杂的静态页面而言是非常实用的。

目前 vercel 就正在研究这样的一个平台,并且正在 beta 阶段。有兴趣的朋友可以尝试一下v0.dev/

如下图这个例子,这个用户通过描述让 AI 帮他制作了一个类似推特的一个信息卡片。你还可以通过手动修改代码来预览效果,不得不说实现的效果还是很优秀的。

XRFrame

作为月活13.09亿的国民级应用,微信小程序开发是前端 play 中重要的一环。随着元宇宙的爆火,微信小程序重磅推出了 xr-frame。

何为 xr-frame ? 这是一套小程序官方提供的XR/3D应用解决方案,基于混合方案实现,性能逼近原生、效果好、易用、强扩展、渐进式、遵循小程序开发标准。xr-frame 对 ar 的使用进行了非常多的简化,只需要简单的几步就可以开发一个带有ar能力的小程序,并且还能支持图像、手势、平面识别等ar中常用的AI能力。

通过 xr-frame,虚拟3D人、3D物、3D场景都可以在小程序里进行完美呈现。AR换脸、扫描平面获得AR游戏、扫描特定图片获得AR交互等,都可以在小程序中实现。

以下是两个例子,一个是加载了一个模型,另一个是通过识别人脸,给人物戴上了面具。

WebRTC

WebRTC 是 Web 实时通信(Real-Time Communication)的缩写。它是一种通过浏览器实现实时通信的技术,彻底改变了在线交互方式。与传统通信协议相比,WebRTC 提供了一种更直接、基于浏览器的方法,极大的提高了效率和可访问性。

当 WebRTC 与人工智能相结合时,将产生奇妙的化学反应,提供更创新、更高效的通信解决方案。然而,目前 WebRTC API 仅有 JavaScript 版本,这也是我们前端开发者的未来发展的一个重要机会。

AI 与 WebRTC是实时通信的天作之合,通过二者结合,我们可以做到:

  1. 促进实时视频通信的能力;
  2. 人工智能可以根据用户行为和偏好来定制通信体验;
  3. 视频通话期间的实时语言翻译,全球通话无障碍;
  4. 人工智能可以提供实时手语翻译等高级功能,帮助残疾人也能无障碍交流;

代码辅助工具

AI如此强大的能力,当然也可以协助开发者们更快更强地编辑代码,市面上已经出现了一些AI辅助开发工具。这一定也是我们开发者需要聚焦的一个方向。

说到AI辅助开发工具,目前比较热门的有 GitHub Copilot、Codeium、Tabnine、CodeWhisperer、Bito AI。

这些辅助开发工具通过将 GPT-4/GPT-3.5 和 ChatGPT 引入 IDE、Chrome 浏览器和 CLI 等开发工具中,帮助开发人员大大加快其工作效率。

它们使用 OpenAI 的模型,开发者不需要 OpenAI 密钥,可以轻松编写代码、理解语法、编写测试用例、解释代码、注释代码、检查安全性,甚至解释高级概念。

这些开发辅助工具支持多种代码语言,有兴趣的朋友可以体验一下,以下是工具传送门:

  1. GitHub Copilot
  2. Codeium
  3. Tabnine
  4. CodeWhisperer
  5. Bito AI

后记

在 AI 的浪潮下,萌发了无数的机会,随之也带来了一些恐慌。AI 是否会淘汰掉很多做重复工作的劳动力一直是一个比较敏感而现实的话题,认知决定了想象,我相信对于我们开发者而言,深入体会到 AI 之后这种恐慌或许会愈演愈烈。在未来 AI 一定会取代一大批劳动力,既然打不败他,就加入它。且不谈利用 AI 为人类造福这种看似离我们比较遥远的话题,但是我们确实需要思考一下:我们能利用 AI 为自己造福吗?答案掌握在行动者手中。

在未来的 2024 年,让我们一起利用 AI 创造出更多有价值的事情吧!

相关推荐
Myli_ing21 分钟前
考研倒计时-配色+1
前端·javascript·考研
余道各努力,千里自同风24 分钟前
前端 vue 如何区分开发环境
前端·javascript·vue.js
软件小伟33 分钟前
Vue3+element-plus 实现中英文切换(Vue-i18n组件的使用)
前端·javascript·vue.js
醉の虾1 小时前
Vue3 使用v-for 渲染列表数据后更新
前端·javascript·vue.js
张小小大智慧1 小时前
TypeScript 的发展与基本语法
前端·javascript·typescript
hummhumm1 小时前
第 22 章 - Go语言 测试与基准测试
java·大数据·开发语言·前端·python·golang·log4j
asleep7011 小时前
第8章利用CSS制作导航菜单
前端·css
hummhumm1 小时前
第 28 章 - Go语言 Web 开发入门
java·开发语言·前端·python·sql·golang·前端框架
幼儿园的小霸王2 小时前
通过socket设置版本更新提示
前端·vue.js·webpack·typescript·前端框架·anti-design-vue
疯狂的沙粒2 小时前
对 TypeScript 中高级类型的理解?应该在哪些方面可以更好的使用!
前端·javascript·typescript