【51CTO.com原創稿件】2017年12月01日-02日，由51CTO主辦的WOTD全球軟件開發技術峰會將在深圳中州萬豪酒店隆重舉行。本次峰會以軟件開發為主題，數十位專家級嘉賓將帶來多場精彩的技術內容分享。屆時，餓了么高級技術經理張龍先生將在前端開發實戰分會場與來賓分享"餓了么前端基礎設施的建設"主題演講，為大家詳細闡述餓了么團隊打造前端基礎設施的歷程，以及在實踐中獲得的一些經驗和思考。51CTO誠邀您蒞臨大會，與我們共享技術帶來的喜悅。

51CTO記者對即將參加大會演講的張龍老師進行了專訪，讓我們先睹為快，探聽一下他是如何解讀前端基礎設施建設的。

同時服務于開發團隊和用戶

當今，軟件開發技術日新月異，其中，前端基礎設施的建設意義重大：一方面在于獲得更好的用戶體驗，從而留存用戶，另一方面是為了加快開發速度，提高開發效率，為公司創造更大的價值。

當一個公司的前端工程師超過 50 人之后，如果沒有一個團隊提供工具和服務來提高效率，就會造成一定程度的資源浪費。因為每個前端開發小團隊都會有公共的需求，如果有專業的團隊來支持這樣的公共需求，就比每個小團隊做這些重復的工作要高效的多。另外，基礎設施的性能和穩定性也會影響終端用戶的體驗，更需要專業團隊的開發和維護。

為服務型的平臺保駕護航

“餓了么”是中國知名的在線外賣訂餐平臺，已覆蓋中國數百個城市，數千萬用戶，聚集了數十萬家餐飲商戶，為中國廣泛地區的用戶提供豐富多樣的便捷生活服務。在餓了么高級技術經理張龍老師看來，作為一個服務性的平臺，餓了么前端基礎設施建設服務的***對象是用戶，其次才是前端開發者。對于終端用戶，前端基礎設施的建設可以保證出色的用戶體驗，例如訪問速度的改善以及服務的穩定，讓用戶感受到產品的魅力。對于開發者，前端基礎設施的建設可以為他們提供一些配套的工具或服務，以提高他們的開發效率，更好的與他人溝通合作。

餓了么前端基礎設施的建設之路

據張龍老師介紹，在他剛加入餓了么的時候還沒有大前端這個部門，只有一些代碼及協作規范。大前端部門成立之后，他帶領架構與機動組解決團隊的一些痛點需求。

首先要解決的就是開發不重復勞作的問題。張龍老師帶領團隊研發了兩款基于 Vue.js 的組件庫 Element(PC 端)、Mint UI (移動端)，并對外開源，在開源社區取得了一些影響力。

之后要解決的問題就是上線簡單且自動化，于是餓了么大前端團隊開發了一套發布系統，這套發布系統提供不同的測試環境和生產環境，可以將前端業務的靜態資源發送到不同的環境。測試環境供開發人員自測或者測試人員根據 PRD 進行測試，生產環境供終端用戶使用。通過這套系統，發布時間從原先的7天縮短到了如今的5分鐘。

接下來要解決的問題是想要更快的訪問速度。于是餓了么大前端團隊拋棄了原先配置繁碎的 CDN 服務，在發布服務的基礎上推出了一個可以直接拉取 Github、Gitlab、NPM 資源的 CDN 服務，大大簡化了 CDN 的使用流程。

***，為了保證服務的穩定可靠，針對頁面性能、報錯、Nginx 以及 CDN 層面都做了監控，以確保終端用戶的使用。

在餓了么前端基礎設施的建設之路上，張龍老師和他的團隊遇到了很多困難，張龍老師簡單介紹了他們今年遇到的一個比較大的問題：“發布系統”的穩定性。

餓了么服務鏈路中的某一個環會在運行一段時間后莫名其妙的掛掉，然而當一個產品所依賴的服務愈發龐大時，就很難定位到產品問題的根源。雖然這個產品僅供內部前端開發者使用，但是問題得定位和解決占用了大量時間，極大地影響了開發者的使用體驗。因此，痛定思痛之后，餓了么大前端團隊做了兩件事：

1. 事前預防：把所有的服務都加上監控，在用戶報問題之前，可以主動的發現問題。

2. 事后恢復：為關鍵服務加入災備，當出現故障時可以迅速切換到正常的服務上，并根據梳理好的服務架構、文檔對事故服務進行快速恢復。

發布服務構架

發布服務流程

穩定為王

***，張龍老師表示，純粹的前端基礎設施工作并不多，因為前端、移動端、后端的基礎設施建設的思路大同小異。張龍老師認為“穩定”是決定一個服務是否被用戶接受的重要因素。“你要想清楚三點：為什么我的服務會掛?服務掛了我怎么定位?定位到了怎么恢復?保證了穩定性你就已經贏在了起跑線上了。”

【講師簡介】

[[207856]]

張龍，工作近 10 年，現任餓了么大前端部高級研發經理。在加入餓了么之前，有 5 年的時間負責一款商業產品的前端組件研發工作。15 年初加入餓了么大前端，擔任架構與機動組負責人，帶領團隊研發了兩款基于 Vue.js 的組件庫 Element(PC 端)、Mint UI (移動端)，并對外開源，在開源社區取得了一些影響力。除此之外，還帶領團隊創建了一些前端基礎設施，提升了前端項目的開發、部署的效率。

使用優惠碼[2017WOTDSZ]，和我一起去WOTD全球軟件開發技術峰會。8折優惠，僅限72小時!詳情點擊wot.51cto.com

【51CTO原創稿件，合作站點轉載請注明原文作者和出處為51CTO.com】