高級前端架構師

課程背景
前端團隊的開發(fā)效率和系統的整體運行效率，是前端架構師需要關注的核心問題。然而，要真正解決這些問題，并非易事。為此，培訓中心特邀請了國內某著名互聯網公司的前端架構師，全面剖析大型系統的前端架構思考、實踐和創(chuàng)新過程，分享多種前端架構問題的解決方法，讓學員們能夠掌握并運用這些問題的思考過程和經驗，為前端團隊積累特有的智力財富，為企業(yè)做出更大的貢獻。
培訓具體通知如下：
 
培訓目的：
本次課程在幫助大家利用業(yè)內先進工具快速搭建前端基礎架構的同時，從大型系統的前端架構實踐和經驗出發(fā)，找尋進一步提高前端開發(fā)效率和提升系統整體運行效果的方法。通過學習，掌握分析問題和解決問題的思路及方法，進一步提高大家的前端架構設計技巧。

培訓要點：
前端設計已經成為近年來軟件系統設計的重要方面，為了給用戶提供更好的體驗，正在向著更加復雜和更加智能化的方向發(fā)展。當前端開發(fā)復雜到一定程度時，前端架構就應運而生了。提高前端團隊的開發(fā)效率和系統的運行效率，是前端架構師需要關注的兩大核心問題。雖然借助于現有的開源工具和經驗，前端架構師們能夠快速實現企業(yè)對前端架構的基本要求，但是當基本的基礎設施遇到“開發(fā)調試效率有待提升”、“歷史遺留問題對架構構成挑戰(zhàn)”、“系統性能有待提高”等諸多不利因素時，適應變化的環(huán)境，對架構進行合理的調整，是前端架構師們經受考驗、走向優(yōu)秀的必由之路，也是企業(yè)對前端架構師的更高要求。
本課程首先著重分析前端架構目前面臨的問題，尋找解決方案。為了避免重復制造工具，課程將帶領大家一起學習現有的業(yè)內領先工具，分析每款工具的特點，便于大家選擇使用。然后，根據現有工具存在的缺陷，和學員一起搭建一個比較合理的前端架構基礎設施。
架構并非一勞永逸，當我們從開發(fā)效率和系統性能兩方面審視前端架構時，原來我們引以為豪的出色的架構設計，也很難完美無瑕。因此，本課程將從某大型系統開發(fā)過程的實際架構經驗出發(fā)，給出該系統在前端架構過程中遇到的八個比較典型的問題。然后，我們將沿著“問題的提出、思考、解決和總結”過程，引導大家進入思考和解決前端架構問題的正確節(jié)奏，最終，給出問題的合理解決方案。在此基礎上，總結類似問題的思考過程和經驗，以指導今后的前端架構實踐，真正達到“授之以漁”的效果。

培訓內容：
（一）前端與架構
       1、前端已不是那個前端
       2、百花齊放的前端
       3、前端與后端
       4、前端架構與前端架構師
       5、前端開發(fā)面臨的阻力
       6、前端架構需要解決的問題
（二）利用業(yè)內先進工具搭建前端基礎設施
1、業(yè)內先進工具品鑒
開發(fā)框架和工具類
          代碼規(guī)范與標準類
          代碼編譯發(fā)布類
          單元測試工具類
          版本控制工具類
2、一個合理的前端基礎架構設計
       前端基礎編寫框架jQuery+Bootstrap
       JS模板引擎的引入
       模塊化程序設計與按需加載SeaJS
       動態(tài)CSS：LESS
       編譯發(fā)布：Grunt
       版本控制：GIT
       單元測試：QUnit和jsTestDriver
       代碼規(guī)范：JSLint和CSSLint
       代碼壓縮：UglifyJS和CKstyle
3、前端架構并非一勞永逸！
4、前端架構經常遇到的挑戰(zhàn)
       框架水土不服
       推廣困難
       時間對框架的磨損
    5、解決問題的思路與注意事項
（三）打通任脈——進一步提高開發(fā)和調試效率
       1、深入前端開發(fā)流程
       前端開發(fā)的一般流程
       找出流程中的絆腳石
       進一步解放生產力
       2、問題與現狀
       3、提高開發(fā)效率
       API轉換器jxn
       自動刷新工具noF5
    4、提高調試效率
       初始化精簡工具devflags
       IE調試工具ietools
       5、效果
（四）打通督脈­——進一步提高網站運行效率
       1、網站性能分析
       頁面加載時間
       頁面操作響應時間
       內存和CPU占用情況
       2、問題與現狀
3、常見的性能優(yōu)化方案與工具
       4、進一步提升網站的加載速度
          從字符串拼接的優(yōu)化到網站加載性能提升
比YUICompressor更好的CSS壓縮方式
5、進一步提升網站的使用體驗
從“返回頂部”和“名片卡”優(yōu)化到網站響應性提升
          資源加載順序的優(yōu)化與使用體驗提升
       6、效果