《前端代碼是怎樣智能生成的》正式上線,帶你揭秘阿裡經濟體前端委員會的四大技術方向之一,前端智能化方向如何解決前端+AI的火花--智能代碼的生成。 https://developer.aliyun.com/topic/download?id=53 獨家下載下傳 《前端代碼是怎樣智能生成的》

背景分析
業界機器學習之勢如火如荼,「AI 是未來的共識」頻頻出現在各大媒體上。李開複老師也在《AI·未來》指出,将近 50% 的人類工作将在 15 年内被人工智能所取代,尤其是簡單的、重複性的工作。并且,白領比藍領的工作更容易被取代;因為藍領的工作可能還需要機器人和軟硬體相關技術都突破才能被取代,而白領工作一般隻需要軟體技術突破就可以被取代。那我們前端這個“白領”工作會不會被取代,什麼時候能被取代多少?
回看 2010 年,軟體幾乎吞噬了所有行業,帶來近幾年軟體行業的繁榮;而到了 2019 年,軟體開發行業本身卻又在被 AI 所吞噬。你看:DBA 領域出現了 Question-to-SQL,針對某個領域隻要問問題就可以生成 SQL 語句;基于機器學習的源碼分析工具 TabNine 可以輔助代碼生成;設計師行業也出了 P5 Banner 智能設計師“鹿班”,測試領域的智能化結合也精彩紛呈。那前端領域呢?
這本書告訴你前端與AI究竟能開出怎樣的火花。
技術方案
我們對現有的 D2C 智能化技術體系做了能力概述分層,主要分為以下三部分:
• 識别能力:即對設計稿的識别能力。智能從設計稿分析出包含的圖層、基礎元件、業務元件、布局、語義化、資料字段、業務邏輯等多元度的資訊。如果智能識别不準,就可視化人工幹預補充糾正,一方面是為了可視化低成本幹預生成高可用代碼,另一方面這些幹預後的資料就是标注樣本,反哺提升智能識别的準确率。
• 表達能力:主要做資料輸出以及對工程部分接入
• 通過 DSL 适配将标準的結構化描述做 Schema2Code
• 通過 IDE 插件能力做工程接入
• 算法工程:為了更好的支撐 D2C 需要的智能化能力,将高頻能力服務化,主要包含資料生成處理、模型服務部分
• 樣本生成:主要處理各管道來源樣本資料并生成樣本
• 模型服務:主要提供模型 API 封裝服務以及資料回流
在整個方案裡,我們用同一套 資料協定規範(D2C Schema)來連接配接各層的能力,確定其中的識别能夠映射到具體對應的字段上,在表達階段也能正确地通過出碼引擎等方案生成代碼。
看阿裡經濟體前端委員會實作設計稿自動生成代碼,他們又遇到了哪些技術難點?
業務落地
在今年的雙十一場景中,我們的 D2C 覆寫了天貓淘寶會場的新增子產品,包括主會場、行業會場、營銷玩法會場、榜單會場等,包含了視圖代碼和部分邏輯代碼的自動生成,在可統計範圍内,D2C 代碼生成占據了 79.34%。目前代碼的人工改動的主要原因有:全新業務邏輯、動畫、字段綁定猜測錯誤(字段标準化情況不佳)、循環猜測錯誤、樣式自适應修改等,這些問題也都是接下來需要逐漸完善的。
願景
未來我們希望能通過前端智能化 D2C 項目,讓前端智能化技術方案普惠化,沉澱更具競争力的樣本和模型,提供準确度更高、可用度更高的代碼智能生成服務;切實提高前端研發效率,減少簡單的重複性工作,不加班少加班,一起專注更有挑戰性的工作内容!
點選此處下載下傳電子書