產品做到一定程度，JavaScript不僅僅需要幾個層面上的重構，而需要將這些合理的、零散的重構集成起來、系統化，最終形成一套適合自己產品的前端框架。
以某套產品的前端框架為例，包含瞭這麼幾個組件：
1、通用工具組件，提供瞭UI組件最基礎的通用能力，包括：日志、緩存、數據共享、數據異步加載、原生對象擴展、Ajax產品定制化等等。
2、共享UI組件，包括：通用彈出框、通用按鈕等。
3、產品基礎模塊，在所有頁面均加載該JS，包括：評論模塊、打分模塊、基本資費模塊、下載模塊、播放模塊等等。
4、擴展產品模塊，僅在特定頁面加載該JS，包括：播放器組件、直播頻道組件等等。
5、關聯常量預置模塊，這部分主要是一些系統常量無法在JavaScript中確定下來，需要外部傳值進去。
（依賴關系：5->1->2->3->4）
上述JS在開發過程中需要細化，並且需要嚴格限定互相之間的依賴關系，但在發佈時，使用腳本或者JS聚合壓縮工具整合到特定的一個或幾個JS文件中。
UI模型和業務模型：
這部分可以說是框架的核心，包括模型的定義和模型數據的存儲，所有的接口都是圍繞模型制定的。
產品框架實施中遇到的幾個典型問題：
1、頁面JavaScript腳本對於不同語種下需要保持的差異：
譬如阿拉伯語是從右至左排的，那麼對於操縱DOM的腳本來說，很可能和英文下有不同的差異，通常語種引起的差異可以用問題抽象和語種歸類的辦法化解：
比如語言文字從右向左排列和從左向右排列是造成某些展示不同的根本原因，那麼在關聯常量預置模塊中設置好語種，涉及到的語種和左右排列方向的對應關系應當存放在代碼中，最後在JavaScript代碼中區分對待就可以瞭。
2、頁面上的一些非通用的DOM操縱密切相關的代碼和頁面展示耦合緊密，這部分代碼是不宜置入框架中的，置入後反而不便於產品定制，需要明確這個框架內外的分界線是什麼。
3、結合開發團隊技能情況制定詳細的產品框架實現方案。
比如開發團隊成員普遍缺乏JavaScript面向對象能力，這時候就不應當把框架做得太厚，應該對框架外的JavaScript使用適當放寬限制，同時做好命名規約。
4、API接口把關。
需要由有經驗的程序員對於框架發佈的接口把關，保證接口設計的合理性。
作者“四火的BLOG”