人工智能前沿:重塑前端开发的未来

发表时间: 2024-06-07 07:07

Emily Nakashima,前前端开发人员和 Honeycomb 的工程副总裁,表示人工智能不仅仅意味着前端的聊天机器人。

译自 Beyond Chatbots: How AI Can Change Frontend Development,作者 Loraine Lawson。

可观测性平台 Honeycomb 的工程副总裁 Emily Nakashima 表示,如果说有哪类开发者更有资格探索如何将 人工智能 (AI) 添加到他们的工具中,那就是前端程序员。

Nakashima 说:“前端生态系统发展得如此之快,在某些方面,前端工程师比其他任何人更适合弄清楚如何将人工智能引入他们的工具集,因为他们非常习惯于学习新工具,并弄清楚如何整合和使用它们,将所有这些不同工作流的精华汇集在一起。”

Nakashima 在 Web 开发的 jQuery 时代开始担任前端开发人员。她非常喜欢 React,并表示它“在随着时间的推移不断完善生态系统方面做得很好”。虽然她的背景主要是在前端,但她从事过全栈工作,现在负责 Honeycomb 的软件工程、安全和网站可靠性工程团队的所有方面。

关于 AI 副驾驶 如何改变开发者体验,已经有很多讨论,但 The New Stack 想知道:它将如何改变代码本身,无论是从质量上还是数量上?我们还与 Nakashima 讨论了她所看到的以及 Honeycomb 如何使用人工智能。

人工智能在前端代码中的潜力:错误处理

“我对来自 [Adobe] 或 [Figma] 等公司的那些工作流最乐观,他们正在研究设计师和开发人员之间的常见交接格式……”

——Honeycomb 工程副总裁 Emily Nakashima

Nakashima 说,人工智能在前端比在后端更有可能对代码质量产生积极影响。她指出,前端生产环境要复杂得多,而且不受控制——它必须在多种移动设备上运行,还必须在不同的浏览器,甚至是不同的语言中运行。相比之下,后端开发人员控制着他们的代码环境,因此当出现问题时,了解发生了什么“相当简单”。

她说:“凭借人工智能能够查看所有这些信号并找到共同元素的能力,单个前端开发人员更有可能使用其他人对该错误了解的所有信息来找到根本原因,而不是必须踏上尝试弄清楚 [此] 消息在此上下文中意味着什么、映射的旅程 返回到此原始代码行,并将许多不同的数据点带到其中。”她说:“能够填补模式实际上非常有帮助,这是后端无法做到的。”

尽管如此,她有点怀疑人工智能是否会真正改变前端的工具生态系统——她表示该生态系统已经发展得很快。不过,她对 改善设计师和开发人员之间的界面 的潜力感到兴奋。事实上,The New Stack 特色的早期人工智能用例之一帮助 开发人员将设计转化为代码。

Nakashima 说:“这是一个当今有点低效的地方,能够拥有简化这两个功能之间通信的工具是一个我真正看到很多繁琐工作被从流程中剔除的领域,人们能够更快地一起迭代。”“我对来自 Adobe 或 Figma 等公司的那些工作流最乐观,他们正在研究设计师和开发人员之间的常见交接格式,研究人们过去写出这些详细规范的地方,例如‘使用此颜色,它有这么多个像素’,诸如此类。”

人工智能可以帮助前端迁移和升级

人工智能代码生成工具还可以帮助管理迁移和升级,让前端开发人员可以将更多时间花在工作的创造性部分上。

“我今天看到的最令人兴奋的事情是采用 UI 中的不同多步骤工作流,并弄清楚如何从第一步跳到第五步。”

例如,当 React 的新版本发布时,她解释说,这会带来大量工作,需要遍历旧代码库并更改所有需要更改的内容,以使用新版本并利用新框架。她建议,人工智能可以“以目前不可能的方式”自动完成其中一些工作。

她说:“工程师在迁移和升级上花费了大量时间,尤其是依赖项升级或框架升级。”“这不需要太多创造力,但需要大量勤奋和细心,并且你必须了解如何从特定 API 的一个版本转换到新版本。我非常乐观,一些人工智能代码生成工具可以真正帮助那些占用前端工程师时间但不是利用他们最佳技能的创造性工作部分的琐事或工作流。”

在内部,Honeycomb 使用 copilot 工具——他们是重度 GitHub用户,许多开发人员还使用 VS Code 作为他们的编辑器。它还在尝试构建人工智能驱动的产品元素,主要使用 OpenAI,尽管 HoneyComb 正在寻找该领域的其它供应商,以了解哪家可以为其客户提供最佳体验,她说。其中一些元素是面向客户的功能,已集成到 Honeycomb 的前端 UI 中。

将前端人工智能 UI 提升到聊天机器人之外

现在,聊天机器人是人工智能集成到前端的主要方式,但 Nakashima 说,有很多地方感觉像是一种低效的用户界面 (UI) 模式。她说,她希望前端和 Web 应用程序开发人员想出其他方法将人工智能集成到用户界面中,但她认识到这是一个编码人员才刚刚开始尝试的领域。

她说:“我今天看到最令人兴奋的事情是采用 UI 中不同的多步骤工作流,并找出如何从第一步跳到第五步。”“但我确实认为,更有创意、更具视觉效果的界面有其一席之地。”

例如,Honeycomb 具有交互式数据可视化功能,可以在屏幕上绘制系统的映射。她说,这可能是可以通过人工智能自动完成的事情。

她说:“感觉对于这类功能来说还为时过早。我确实看到人们专注于聊天工作流的实验,因为这是他们在这些人工智能工具中看到的。”“我希望很快看到更多样性。”

在 Honeycomb,他们实现这一目标的一种方法是通过查询构建器 UI,其中将文本输入到表单字段中以生成查询。

她说:“有时可能很难知道如何构建该查询并键入完全正确的内容,因此我们允许你提供更通用的文本描述,然后当你单击时,我们将为你生成一个图表。”“你可以说,向我展示所有在 Web 应用程序上体验缓慢的用户图表,然后我们会向你展示该图表。”