作者 | D2 前端技術論壇
狼叔和卓風即將在第十五屆 D2 前端技術論壇上（12月19日）做《前端智能化實踐：P2C 從需求文檔生成代碼》主題分享。這個 Topic 是 D2 多樣化專場中最具有爭議的，也是所有評委最想聽的。據說在預審階段，10 位評委中有 9 位給這個分享投了票。在試講階段，也得到了現場評委的認可，表示這個主題非常前沿，具有一定的前瞻性。
那麼，為什麼這個 Topic 具有如此大的吸引力呢？小編以為有以下幾點。
- 有 2 位嘉賓共同一起演講，他們的分工是怎樣的？
- P2C （PRD to Code）是什麼？這個事兒好像業界第一次聽說，真的有用嗎？
- P2C 有什麼可提前爆料的黑科技沒？
- P2C 和之前的 Imgcook 主張的 D2C（Design to Code）有啥差別？同一個團隊，這 2 個概念之間是顛覆還是繼承關係？
- 狼叔之前一直活躍於 Node/Serverless 社區，現在轉戰智能化領域，是什麼原因？有怎樣的思考？
下面我們提前採訪一下狼叔和卓風，先介紹一下這兩位分享嘉賓。
（左：狼叔 右：卓風）
狼叔，Node.js 技術佈道者，Node 全棧公眾號運營者，曾就職於去哪兒、新浪、網秦，做過前端、後端、數據分析，是一名全棧技術的實踐者。已出版《狼書(卷1) 更了不起的 Node.js》《狼書(卷2) Node.js Web 應用開發》。入職阿里的三年時間，主要是在優酷 PC/H5 端從 0 到 1 的落地 Node.js 全棧，使用 SSR 對 Web 頁面進行優化和重構，建設 SSR 應用的容災、發佈、灰度等能力，是集團內第一大 QPS 的 SSR 應用。在支撐好業務的同時，與組內同學一起孵化出開源框架 egg-react-ssr。2020 年到淘寶技術部，開啟前端智能化的旅程，目前負責 P2C，和卓風是搭檔。
卓風，入職阿里的八年時間，主要是在淘寶負責天貓、聚划算大促及日常營銷業務產品的落地，曾負責面向天貓、淘寶、聚划算等商家的搭建產品建設和淘系智能 UI 體系建設和業務落地，相關產品和體系已陸續在向集團落地。近 1 年投身到前端智能化領域，致力於 Service to Code 體系建設，推動服務端智能出碼的落地，目前相關體系具備一定雛形，在團隊內業務範圍進行閉環試驗。
專訪內容
Q1：雙嘉賓的分工
有 2 位嘉賓共同演講，你們的分工是怎樣的？
2 個人一起演講是因為在 P2C 過程中，需要由多個部分組成，而這些組成部分分別由狼叔和卓風負責，二人以交互式的演進方式，一是希望降低理解成本，二是 D2 大會也希望能有一些新的創新形式。二位嘉賓都是愛說愛笑的，應該會大家呈現一場不一樣感受的分享，非常值得期待。
Q2：P2C 的定位：需求即代碼
P2C 是什麼？這個事兒好像業界第一次聽說，真的有用嗎？
在前端智能化的探索過程中，甄子提出了 P2C，即 PRD to Code。站在整個研發鏈路上，集合現有優勢，做到需求即代碼的這個最終目標。通過我們近一年的探索，證實這套方案在頻道業務上是可以落地的。
- 我們需要了解 PD 的痛點。
- PD 的目標是什麼？
- PD 要做什麼？是頻道，頁面，模塊，會場，還是啥？
- PD 要將做的東西投放到哪裡，典型的業務場景有哪些？
OKR 的核心目標分解和關鍵結果。圍繞目標進行拆解，並及時反饋，所以 OKR 才被認為是一種高效的協作方式。那麼 PD 圍繞的業務目標是什麼？PD 出的需求方案是否有傳承或複用？PD 是否能夠更簡單的工作，降低溝通成本，省出時間，做更多商業模式上的創新？
這是一張核心的 P2C 大圖。P2C 的最終目標是需求即代碼，其中 2 個拆解目標分別如下。
- 1）讓 PD 能夠做 0 標註，找到標註過程中樣本。
- 2）讓開發做到 0 投入，在 AI 和邏輯點提高出碼準確率。
這 2 個核心目標論證是可行的，P2C 背後設計的技術體系也非常龐大的，從業務能力接入到研發能力到商業化、 Pipcook 基建等分層上，其複雜度也是可想而知的。
這裡面還有很大的探索空間。未來針對於流量場，是否有定式？能否成為商業 OS，也是非常值得期待的。裡面有D2C、S2C、P2C、C2C 等這些概念，先不細講，留在分享中。
Q3：爆料“以圖搜圖”黑科技
P2C 有什麼可提前爆料的黑科技沒？
這裡先放一個以圖搜圖，一個極小但非常實用的功能。從圖片或設計稿出碼，大家見得多了，那麼能不能通過相似性來快速生成呢？
P2C 站在 PD 的視角，已經解決了很多問題。我舉個例子，以圖搜圖是 P2C 的一個工具功能。大家只要有圖就能搜索到對應模塊。搜到模塊，就能找到對應的開發者，對應業務來說是很方便的。
這還只是工具。假設你去截任意活動的一張頁面圖片，假定你的模塊庫裡有相似模塊，通過以圖搜圖可以直接生成具體頁面，是不是很酷？PD 如果想仿製，貼一個競品頁面地址就搞定了，它可以讓前端打開無數想象。放這個目的是為了讓大家能夠有點體感，即使是很小的一個功能也能解決很多問題。
但是，挖掘 PD 腦子中的業務邏輯，做需求即代碼，需求即生成，這才是更高級的做法，具體 P2C 方案會在第十五屆 D2 前端技術論壇（12月19日）上做分享《前端智能化實踐：P2C 從需求文檔生成代碼》。
Q4：P2C vs D2C，為什麼做 P2C ？
P2C 和之前的 Imgcook 主張的 D2C（Design to Code）有啥差別？同一個團隊，這 2 個概念之間是顛覆還是繼承關係？
Imgcook 是目前業內最好的利用 D2C（Design to Code，即設計稿出碼）能力智能出碼的工具，它使用計算機視覺、深度學習等智能化手段，可以一鍵根據設計稿進行代碼生成。
2019 年 Imgcook 藉助核心的 D2C（Design to Code，即設計稿出碼） 能力，將模塊智能出碼水平提升到 79%，而分析發現未能智能出碼的部分均是從視覺稿中獲取不到代碼信息的，比如多態邏輯、交互邏輯、數據服務邏輯，需要藉助分析 PD（產品經理） 的原始 PRD（產品需求文檔）才能獲取到這部分代碼信息，於是提出了 P2C（PRD to Code） 概念，希望通過 PRD、視覺稿（Design）結合的方式，來進一步提升出碼水平。本次分享通過詳細講解 P2C 的整個探索和產研過程，希望為大家在前端智能化領域的開拓創新起到一個參考。
今年雙十一會場承接了 90.4% 的新模塊代碼智能生成，代碼可用率達到 79.26%（對比去年升級設計稿智能檢查能力，視覺稿無需人工輔助調整）。得益於 D2C 的研發提效，今年並沒有出現往年借調資源投入會場開發的情況。相比傳統模塊開發模式，使用設計稿生成代碼技術後編碼效率（模塊複雜度和研發耗時比值）提升 68%，固定人力單位時間模塊需求吞吐量增加約 1.5 倍。
最新文檔請查收：
使用 Imgcook 開發天馬模塊：https://www.imgcook.com/docs?slug=tianmAImgcook.private
使用 Imgcook 開發天馬組件：https://www.imgcook.com/docs?slug=tianma-component.private
使用 Imgcook 生成無障礙屬性：https://www.imgcook.com/docs?slug=accessible.private
使用 Imgcook 支持自定義組件：https://www.imgcook.com/docs?slug=comp-to-code
更多請查看官方文檔：https://www.imgcook.com/tutorial
從研發效率上看，Imgcook 已經做得非常好了。它是提效，不是無開發。這點是需要注意的。AI 是要用機器替代人工，否則 AI 是做得不夠的。
本身 D2C 解決的是設計師和開發者之間的提效。能夠讓 AI 通過設計稿生成代碼，這是減少了開發者的工作量。但有很多業務邏輯其實是在 PD 腦子裡的，如果想讓需求快速交付，就需要站到整個研發鏈路上看，從需求到生成代碼，能否縮短交付時間，甚至是需求即代碼？
從純前端的角度講，單一角色確實很難解決這個問題。我們可以看到前端智能化是 AI 和前端的融合，在全鏈路的思考裡，是融合多個職能角色的。在做 D2C 的時候，甄子團隊整合了 AI 和前端，在做智能 UI 的時候，甄子團隊整合了算法，在做設計系統的時候，甄子招了設計，在做 AI 基建時，甄子招了知名大佬 Yorkie。目前整個團隊橫跨多個角色，是最適合做這種創新型探索項目的。
Q5：狼叔因何“出圈”？
狼叔之前一直活躍於 Node/Serverless 社區，現在轉戰前端智能化領域，是什麼原因？有怎樣的思考？能行麼？
在今天，Node/Serverless 已經不能不放到一起談了。Node.js 在十一年的穩定增長後，已經變成了主流選擇。所有云計算廠商都愛 Node.js，也就導致在 Serverless 大潮中，Node.js 依然是寵兒。我們能看到的是語言慢慢的被基建取代，已不再有往日的重要地位，並且 Serverless 端渲染等新生物，解決實際問題，但這部分其實已經劃歸了基礎架構組來做。它能夠拿到成績，未來幾年也會持續落地和增長。
對狼叔而言，開源 ykfe/egg-react-ssr 和 ykfe/ssr，已經完成了 Serverless 端渲染相關的探索，他需要更多的探索空間，這時候選擇前端智能化也是必然的。AI 目前能夠解決的問題確實是有限的，廣義問題確實不適合 AI 來接，但針對特定場景，具備特徵和 Pattern 的是可以替代人工的。從目前的實踐來看，確實也是做到了的。
到前端智能化團隊，狼叔最大的挑戰有 2 個，1）掌握 AI 能做什麼，2）站在產研鏈路上去看待 P2C。這其實是很有挑戰的，之前做的事兒無非是提效，搞來搞去還是前端的某一個領域，做深或做廣。今天要跨角色去思考提效，這個事兒對格局要求明顯是很高的，這其實才是最吸引狼叔的點。
狼叔表示，雖然一把年紀，但還是能夠堅持學習，在一個多樣化的團隊裡，跟不同職位的小夥伴們一起成長，一起創造、探索，是非常快樂的事兒。不確定一定能夠顛覆什麼，但折騰的過程一定是值得享受的，對每個人的成長都是極為有利的。預告一下，《狼書（卷3）：Node.js 高級技術》預計年前可以出版，今年5 月份已交付，已經在走出版流程。
專訪小結
關於前端智能化，狼叔曾說過：”面對未知我們太弱了，是思維方式的束縛，是事推事的磨礪，是無比強大的內心。能看出趨勢很難，能找對方法很難，能帶著一群人去瘋狂更難。方向對了，還怕路遠嗎？“
最後，狼說和卓風說要致敬前端智能化的領路人，前端世界摸爬滾打 20 年，最早的騰訊 3-3，創過業當過CEO/CTO，到今天成為行業（前端智能化）領導者和開拓者。他就是了不起的甄焱鯤（花名：甄子）。
歡迎大家來觀看第十五屆D2前端技術論壇，來聽狼叔和卓風的分享，一起來領略前端智能化的無限可能。
關注「Alibaba F2E」
把握阿里巴巴前端新動向