編輯 | 星璇
出品 | 51CTO技術(shù)棧（微信號(hào)：blog51cto）
如果問(wèn)，哪類(lèi)開(kāi)發(fā)者更適合探索人工智能如何為其工具增添價(jià)值，那么一定是前端程序員。
可觀測(cè)性平臺(tái)Honeycomb的工程副總裁Nakashima非常篤定這一點(diǎn)。
1.AI更適合前端開(kāi)發(fā)者
“前端生態(tài)系統(tǒng)發(fā)展得如此之快，從某種程度上講，前端工程師比其他任何人都更擅長(zhǎng)將AI引入他們的工具集，因?yàn)樗麄兞?xí)慣于掌握新工具，并弄清楚如何整合和使用這些工具來(lái)匯集所有不同工作流程的精華，”Nakashima說(shuō)。
Nakashima最初在jQuery時(shí)代的網(wǎng)絡(luò)開(kāi)發(fā)中擔(dān)任前端開(kāi)發(fā)者。她是React的忠實(shí)粉絲，稱(chēng)它“在生態(tài)系統(tǒng)的長(zhǎng)期發(fā)展中做得非常出色”。雖然她的背景主要是前端，但她曾做過(guò)全棧開(kāi)發(fā)，現(xiàn)在負(fù)責(zé)Honeycomb的軟件工程、安全和站點(diǎn)可靠性工程團(tuán)隊(duì)的所有方面。
關(guān)于AI輔助工具如何改變開(kāi)發(fā)者體驗(yàn)，人們已經(jīng)說(shuō)了很多，但大家肯定想知道：它如何從質(zhì)量或數(shù)量上改變代碼本身？Nakashima分享了她的觀察結(jié)果以及Honeycomb如何使用AI。
Nakashima表示，AI在前端對(duì)代碼質(zhì)量產(chǎn)生積極影響的潛力比后端更大。她指出，前端生產(chǎn)環(huán)境要復(fù)雜得多，也更難控制——它需要在多個(gè)移動(dòng)設(shè)備和不同瀏覽器中運(yùn)行，甚至是在不同語(yǔ)言中運(yùn)行。相比之下，后端開(kāi)發(fā)者可以控制他們的代碼環(huán)境，因此當(dāng)出現(xiàn)問(wèn)題時(shí)，了解發(fā)生了什么“相當(dāng)直接”，她說(shuō)。
“憑借AI的能力，它可以查看所有這些信號(hào)并找到共同點(diǎn)，一個(gè)前端開(kāi)發(fā)者就更有可能利用其他人已經(jīng)學(xué)到的關(guān)于該錯(cuò)誤的所有知識(shí)來(lái)找到根本原因，而不是試圖弄清楚這條消息在這個(gè)上下文中意味著什么，追溯回原始的代碼行，并引入許多不同的數(shù)據(jù)點(diǎn)，”她說(shuō)?！澳軌蛱钛a(bǔ)這些模式實(shí)際上是非常有幫助的，這在后端并不適用?！?/p>
話(huà)雖如此，她對(duì)AI是否會(huì)真正改變前端的工具生態(tài)系統(tǒng)持有一些懷疑——她說(shuō)前端生態(tài)系統(tǒng)本身就已經(jīng)在迅速發(fā)展。盡管如此，她還是對(duì)改進(jìn)設(shè)計(jì)師和開(kāi)發(fā)者之間界面的潛力感到興奮。
“目前這一環(huán)節(jié)的效率略低，而能夠擁有工具來(lái)簡(jiǎn)化這兩個(gè)功能之間的溝通是一個(gè)讓我看到大量繁瑣工作被消除的領(lǐng)域，人們能夠更快地一起迭代，”Nakashima說(shuō)。
“我對(duì)Adobe或Figma等公司推出的工作流程最為樂(lè)觀，他們正在研究設(shè)計(jì)師和開(kāi)發(fā)者之間的常見(jiàn)交接格式，查看過(guò)去人們編寫(xiě)這些詳細(xì)規(guī)范的地方，如‘使用這種顏色，這是這么多像素’，等等?！?/p>
2.AI有助于前端遷移和升級(jí)
AI代碼生成工具在管理遷移和升級(jí)方面也能起到幫助作用，讓前端開(kāi)發(fā)者有更多時(shí)間專(zhuān)注于他們工作的創(chuàng)新部分。
“我今天看到的最令人興奮的事情是，在UI中采用不同的多步驟工作流程，并弄清楚如何從第一步直接跳到第五步。”
例如，她解釋說(shuō)，當(dāng)React的新版本發(fā)布時(shí)，需要花費(fèi)相當(dāng)多的工作來(lái)檢查舊的代碼庫(kù)，并更改所有需要使用新版本和利用新框架的內(nèi)容。她建議，AI可以通過(guò)目前無(wú)法實(shí)現(xiàn)的方式自動(dòng)完成部分工作。
“工程師在遷移和升級(jí)上花費(fèi)了很多時(shí)間，特別是依賴(lài)升級(jí)或框架升級(jí)，”她說(shuō)?！斑@不需要太多的創(chuàng)造力，但需要大量的勤奮和細(xì)心，并且你需要理解從一個(gè)特定API的舊版本轉(zhuǎn)換到新版本的模式。我相當(dāng)樂(lè)觀地認(rèn)為，一些AI代碼生成工具對(duì)于前端工程師日常中花費(fèi)時(shí)間但并非使用他們最佳技能的創(chuàng)新部分的這類(lèi)瑣事或工作流程來(lái)說(shuō)，會(huì)非常有幫助?！?/p>
例如，她解釋說(shuō)，當(dāng)React的新版本發(fā)布時(shí)，需要花費(fèi)相當(dāng)多的工作來(lái)檢查舊的代碼庫(kù)，并更改所有需要使用新版本并利用新框架的內(nèi)容。她建議，AI可以通過(guò)目前無(wú)法實(shí)現(xiàn)的方式自動(dòng)完成部分工作。
“工程師在遷移和升級(jí)上花費(fèi)了很多時(shí)間，特別是依賴(lài)升級(jí)或框架升級(jí)，”她說(shuō)?！斑@不需要太多的創(chuàng)造力，但需要大量的勤奮和細(xì)心，并且你需要理解從一個(gè)特定API的舊版本轉(zhuǎn)換到新版本的模式。我相當(dāng)樂(lè)觀地認(rèn)為，一些AI代碼生成工具對(duì)于前端工程師日常中花費(fèi)時(shí)間但并非使用他們最佳技能的創(chuàng)新部分的這類(lèi)瑣事或工作流程來(lái)說(shuō)，會(huì)非常有幫助?！?/p>
在Honeycomb內(nèi)部，他們使用copilot工具——他們是GitHub的大用戶(hù)，許多開(kāi)發(fā)人員也使用VS Code作為他們的編輯器。她還表示，Honeycomb還在試驗(yàn)構(gòu)建基于AI的產(chǎn)品元素，主要使用OpenAI，不過(guò)他們也在關(guān)注該領(lǐng)域的其他供應(yīng)商，以看看哪家供應(yīng)商能為其客戶(hù)提供最佳體驗(yàn)。這些元素中的一些是面向客戶(hù)的功能，已經(jīng)集成到Honeycomb的前端UI中。
3.前端AI用戶(hù)界面，不止是聊天機(jī)器人
目前，聊天機(jī)器人是AI集成到前端的主要方式，但Nakashima表示，在很多地方，這感覺(jué)像是低效的用戶(hù)界面（UI）模式。她表示，她希望前端和網(wǎng)絡(luò)應(yīng)用開(kāi)發(fā)者能提出將AI集成到用戶(hù)界面的其他方法，但她也意識(shí)到，這是程序員們剛剛開(kāi)始探索的領(lǐng)域。
“我今天看到的最令人興奮的事情是，在UI中采用不同的多步驟工作流程，并弄清楚如何從第一步直接跳到第五步，”她說(shuō)。“但我認(rèn)為還有更多創(chuàng)新、視覺(jué)驅(qū)動(dòng)界面的空間?！?/p>
例如，Honeycomb有交互式數(shù)據(jù)可視化功能，可以在屏幕上繪制你的系統(tǒng)地圖。她說(shuō)，這可以通過(guò)AI來(lái)自動(dòng)化。
“我覺(jué)得這類(lèi)功能的開(kāi)發(fā)還處于初期階段。我真的看到人們將實(shí)驗(yàn)重點(diǎn)放在聊天工作流程上，因?yàn)檫@就是他們?cè)谶@些AI工具中看到的，”她說(shuō)?！拔蚁Ｍ芸炷芸吹礁嗟亩鄻有??！?/p>
在Honeycomb，他們實(shí)現(xiàn)這一目標(biāo)的一種方式是通過(guò)查詢(xún)構(gòu)建器UI，在表單字段中輸入文本以生成查詢(xún)。
“有時(shí)可能很難知道如何構(gòu)建該查詢(xún)并鍵入正確的內(nèi)容，因此我們?cè)试S您給出更一般的文本描述，然后點(diǎn)擊，我們就會(huì)為您生成一個(gè)圖表，”她說(shuō)。“您只需說(shuō)顯示所有在我的網(wǎng)絡(luò)應(yīng)用中體驗(yàn)緩慢的用戶(hù)圖表，然后我們就會(huì)為您顯示這些圖表。”
