快捷導(dǎo)航

前端開發(fā)使用Ant Design項(xiàng)目評價

更新時間：2022年08月12日 10:29:29 作者：欲三更

這篇文章主要為大家介紹了前端開發(fā)使用Ant Design項(xiàng)目評價，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪

好的方面

作為前端開發(fā)使用 Ant Design 1年多了，想說幾句。

先說好的方面——

它提供的大量功能比較全面且UI風(fēng)格統(tǒng)一的組件，能幫助開發(fā)者快速搭建通用場景下的應(yīng)用界面。這大概是得益于螞蟻金服業(yè)務(wù)線上極為廣泛的應(yīng)用場景，驅(qū)動了 Ant Design 團(tuán)隊(duì)通過對使用情況的觀察匯總，整理出來了這么一個組件庫。他們的經(jīng)驗(yàn)積累如此之豐富，足以讓這個庫支持大部分其他前端開發(fā)者的需要。

其設(shè)計團(tuán)隊(duì)給出的設(shè)計規(guī)范相當(dāng)詳細(xì)且經(jīng)得起推敲，令許多其他團(tuán)隊(duì)獲益匪淺。

不好的方面

但我更想吐槽幾個不好的方面，都是針對其開發(fā)團(tuán)隊(duì)的——

它“過于智能”，常常畫蛇添足。比如 Button 內(nèi)容為兩個漢字時會自動在其間加上空格分隔，比如表單驗(yàn)證消息模版中，如果不提供 %s ，它會自動將 %s 的對應(yīng)內(nèi)容添加到尾部，仿佛在說“你忘了寫 %s，我?guī)湍阕詣蛹由狭耍挥弥x我喲！”。于是我想要在某個表單字段展示“此處必填”消息的時候，就會被迫變成“此處必填 field-name”。
維護(hù)者常常意氣用事。除了之前廣為人知的圣誕彩蛋事件，隨手翻閱一下該項(xiàng)目在 GitHub 的 issues ，就能看到類似的發(fā)言。“愛用用，不用gun”的交流方式，并不能幫助這個庫變得更好。

3. 部分組件設(shè)計不合理，且長期未進(jìn)行優(yōu)化。最顯著的是 Form 組件，使用過它的朋友一定體會過其 getFieldDecorator API 的微妙感覺以及 Form.create API 的詭異體驗(yàn)。甚至上面的截圖里也吐槽了 Form。值得一提的還有 Modal 組件，提供了一個 Modal.confirm 接口。讓我仿佛回到十年前那個寫 jQuery 的時代。維護(hù)者對 React 的掌握不夠純熟，對于一些深度 bug 甚至不能充分理解，比如 Upload 組件的這個 bug 。

4. TypeScript 支持欠佳。有的朋友可能會說，”這個庫明明有 TS 支持，在編輯器里也有自動提示，你不要亂黑“。我的意思是 Ant Design 的 TS 支持與它的量級不協(xié)調(diào)。這個 Star 數(shù)萬的庫，對于范型等TS的強(qiáng)力功能發(fā)揮甚少，還常常在諸如應(yīng)該寫為 'a' | 'b' | 'c' 的地方看到一個粗暴的 string ，甚至 any。

5. 社區(qū)反哺困難。讀過源碼的朋友應(yīng)該都發(fā)現(xiàn)了，antd 之下還有一套 rc-*的組件庫，一個功能簡單的 antd 組件，往往需要通過極為冗長的代碼來實(shí)現(xiàn)，當(dāng)你讀到尾部，又發(fā)現(xiàn)它用了一個來自 rc-* 的組件。如此種種，使得當(dāng)使用者想幫助修復(fù)一些簡單的bug時，會望而卻步。

更新@2020

剛才因?yàn)橐S護(hù)一個使用了 antd 的老項(xiàng)目去官網(wǎng)看文檔，有些新發(fā)現(xiàn)。

剛打開首頁時大部分交互都沒有反饋（默認(rèn)進(jìn)入最新的 4.0 版，而我想切換到 3.x 版本的，點(diǎn)擊沒反應(yīng)），很納悶。打開 DevTools 看到某個巨大的 JS 仍在加載，最終花了我將近 2 分鐘才好。聽說 Ant Design - The world's second most popular React UI framework 是托管在 GitHub pages 的，大概是流量太大被限速了吧。當(dāng)我準(zhǔn)備瀏覽一番，卻發(fā)現(xiàn)非常卡頓。通過 FPS meter 發(fā)現(xiàn) FPS 只有 10~12，我那沉默已久的風(fēng)扇呼地一聲轉(zhuǎn)了起來，我猜是開發(fā)人員的電腦配置都比較好才沒發(fā)現(xiàn)這個問題。

單就新首頁的體驗(yàn)來說，有點(diǎn)差，不知道這次發(fā)布的 4.0 版本身變化有多大，是不是解決了我之前吐槽過的點(diǎn)，改天研究一下再來更新。

更新@2022

沒想到上面的“改天”這一改就是700多天。最近終于有機(jī)會使用了 Ant Design 4，對照原回答里的問題更新一下感受。

在最近的使用中沒有遇到“過于智能”的問題，但最近的使用深度也不如以往，基本只用到最常規(guī)最基礎(chǔ)的場景，希望維護(hù)團(tuán)隊(duì)是真的已經(jīng)避免了這個問題。
現(xiàn)在重新審視 @afc163 在原回答截圖中的回復(fù)，我似乎比之前更能理解他的本意一些——大概是勸用戶改變使用方式，默認(rèn)了 Ant Design 的 Form 在設(shè)計上略有缺憾的意思。但我還是堅持認(rèn)為這個表述方式不能令我滿意。我最近因?yàn)椴檎乙恍┦褂蒙系膯栴}，有去翻 GitHub issue，沒有翻到比較新的回復(fù)。希望是改善了吧。
有看到 Form 組件已經(jīng)被優(yōu)化過了，粗看示例代碼里沒再看到 getFieldDecorator，但總體上感覺還是不那么美好，比較難受的是看到了通過對 form 的 ref 引用來進(jìn)行數(shù)據(jù)操作。然后 Upload 組件的問題似乎還是存在的？
TypeScript 支持改善了很多，現(xiàn)在 Ant Design 比較全面地使用 TypeScript 進(jìn)行了實(shí)現(xiàn)。補(bǔ)全效果是及格的，枚舉類型希望能更多一些，目前還是太多 string，估計是受限于更底層的 rc-* 的 TS 化進(jìn)度。
社區(qū)反哺依舊很困難，不知道這個問題還要拖累這個庫多久？

另外這次淺嘗過程中發(fā)現(xiàn)一個挺無語的小問題——我試著去調(diào)整 Tooltip 的動效，通過類型提示得知與動效相關(guān)的 transition 的 API 在底層的 rc-tooltip 已經(jīng)被廢棄了，應(yīng)該用新的 motion API，但是上層的 Tooltip 又幾乎寫死了 motion API，用戶只能用 transitionName 有限地調(diào)整 motion。