資訊專欄INFORMATION COLUMN
摘要：前端單元測試，推薦淘寶開源的工具，簡單易用，支持眾多測試框架，也支持調試。這些也是設計前端框架時需要權衡的重要方面。最后，其實大型網站不一定要設計自己的前端框架，完全可以選用現有的框架。
有人在知乎上提問“如何設計大型網站的前端 JavaScript 框架”，有不少回答，其中得贊較多的兩個回答如下：
相對大型的項目在前端 JS 方面有幾個需要達成的目標：
1. 代碼邏輯分層
2. 便于多人協作開發
3. 各部分代碼模塊化，可以按需加載
4. 保持全局變量的清潔
5. 可進行單元測試
馬驍
簡單說下，首先是模塊化開發，方便多人合作，減少代碼沖突，多使用繼承接口思路來取代if else，另外做一些監控能定位模塊運行狀態，必要時盡量考慮one-page模式，減少對服務器的請求同時也能提高頁面加載速度（可參考bigPipe或者bigRender模式）。
雷雨
這兩個答案中提到的模塊化、代碼邏輯分層、便于多人協作開發、保持全局變量清潔、使用繼承接口思路、可進行單元測試等要點，其實適用于所有大型項目。
模塊的按需加載，常用的解決方案是 require.js 和 sea.js。兩者的簡單對比可以看《RequireJS與SeaJS模塊化加載示例》。此外，可以參考《淺談 JavaScript 模塊化編程》和《淺談模塊化加載的實現原理》，了解模塊化加載的原理。
前端單元測試，推薦淘寶開源的totoro工具，簡單易用，支持眾多測試框架，也支持調試。
雷雨提到“必要時盡量考慮 one-page 模式，減少對服務器的請求同時也能提高頁面加載速度”。其實 one-page 模式并不適合所有站點，特別是內容為主的站點并不適合 one-page 模式，詳見 《客戶端JavaScript框架的五大痛點》。
除此以外，大小和依賴也是設計框架需要考慮的方面。通常而言，尺寸越小、依賴越少，框架的性能就越好。而尺寸越大、依賴越多，框架的特性就越多，兼容性也越好。同時，尺寸較小的框架往往更容易集成到現有的項目，而大型框架為你做更多的事，但是不容易和其他項目配合。這些也是設計前端框架時需要權衡的重要方面。
還要向大家推薦司徒正美的《JavaScript框架設計》，這是國內第一本講述前端框架架構的書。
最后，其實大型網站不一定要設計自己的前端框架，完全可以選用現有的框架。;-)
編撰 SegmentFault
文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。
轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/78100.html
摘要：可能很多人和我一樣首次聽到前端架構這個詞第一反應是前端還有架構這一說呢在后端開發領域系統規劃和可擴展性非常關鍵因此架構師備受重視早在開發工作啟動之前他們就被邀請加入到項目中而且他們會跟客戶討論即將建成的平臺的架構要求使用還什么技術棧內容類型 可能很多人和我一樣, 首次聽到前端架構這個詞, 第一反應是: 前端還有架構這一說呢? 在后端開發領域, 系統規劃和可擴展性非常關鍵, 因此架構師備...
閱讀 1442·2023-04-25 17:18
閱讀 1882·2021-10-27 14:18
閱讀 2123·2021-09-09 09:33
閱讀 1839·2019-08-30 15:55
閱讀 2016·2019-08-30 15:53
閱讀 3439·2019-08-29 16:17
閱讀 3429·2019-08-26 13:57
閱讀 1730·2019-08-26 13:46
