系統級前端開發總結

頁面風格

• 使用less或sass全局統一CSS樣式
• 禁止頁面內聯樣式
• 清晰頁面板式結構，樣式結構
• 合理的註釋

交互方式

表單驗證

• 文本兩邊去掉空格
• 數值類型，嚴格限定長度大小，步長 *下拉列表，設置默認值，統一API
• 圖片類型，文件大小，垃圾回收
• 日期類型，本地化
• 複選框，布爾型
• 多選，數組類型JSON(stringify, parse)
• 富文本類型輸出(ng-bind-html,strip_tags), 長度
• 操做：提交前，驗證數據是否合法

數據交互

• 新建，提交前驗證
• 修改，提交，鎖定，解鎖
• 刪除，先提示，後刪除，再確認
• 異常，捕捉異常

頁面加載

• 頁面，輕量加載主頁面，延遲加載輔助頁面
• 彈窗，先彈出，後加載
• 請求，減小沒必要要的請求
• 緩存，緩存公用資源

代碼風格

• 語義化標籤
• 規範註釋
• 格式化，模塊化代碼
• 組件化，高複用，易擴展

性能

• 合併壓縮緩存CSS，JS文件
• 字體代替圖標，合併圖標，減小請求
• CDN靜態資源