【編者按】11月21日，為期三天的 SDCC2015中國軟體開發者大會成功閉幕，主辦方總計邀請了95餘位演講嘉賓，為參會者奉獻了10個主題演講，9大技術專場論壇（80餘場技術演講），另外還有5場特色活動。另外，據官方統計參會人數高達1067名（不含工作人員）。
其中20日的前端開發專場，現場聽講人數一度爆滿，而沒有機會親臨現場的童鞋們，我們特邀請了業內專家、與會者分享他們的聽課感受及他們眼中的前端專場。以下是來自AdMaster前端高級工程師劉越凡參加前端開發專場的聽課札記，以饗讀者。
以下是劉越凡的聽課札記：
Facebook前端工程師ShihChi Huang(黃士旗)：Why React matters/scale
來自Facebook的 ShihChi Huang(黃士旗)分享的內容更側重於知識普及，從幾個核心技術要點講解了一些內容。
UI = f(state)React 的 render() 函數便是其中的 f，將state渲染成Virtual DOM，Virtual DOM被React渲染成真正的DOM。我們不需要再關心DOM是如何變更的，我們只需要將我們想渲染的東西告訴 React，然後重新渲染Virtual DOM，它會自動幫你把UI的改變渲染到真正的DOM上。 Predictable同樣的input應該返回同樣的output。UI在相同state的條件下，應該渲染出相同的界面。 ImmutableVirtual DOM會小限度的修改DOM，但是有時候還是不夠，通過在 shouldComponentUpdate 階段比較 state，我們可以更精細的控制component 是否渲染，但是這樣就遇到一個問題，javascript 中對比兩個對象有先天性不足，React 社區得到 clojure 的啟發，引入了 immutable 數據，即函數式編程中的不可變數據，我們就放心的對對象進行任意操作，進行簡單對比就可以判斷出 state 有沒有發生變化，是否需要渲染。React 吸收了很多函數式編程的思想，組件的形式也是函數式的用法。 Flux最後還提到了flux ，單向數據流，官方的flux還比較簡陋，只提供了思想，有很多不錯的第三方實現，其中 Redux 目前比較受歡迎。
Strikingly CTO、聯合創始人郭達峰 ： React.js in Strikingly
Strikingly的CTO 郭達峰，之前在論壇上有過一些交流，這次終於見到真人了。
達峰分享的側重點在於實踐，分享了很多 Strikingly 使用 React 過程中積累的經驗。
React 與 第三方庫的融合使用 React 的時候會遇到一個問題，有現成的 jQuery 的插件，但是不確定是否能使用在 React 中，用 React 重新實現的話可能又要花費大量的精力。達峰用一個 jQuery 插件 Sortable 舉例，將其封裝成了一個 React component，使用時不僅能修改 DOM 也會更新 state 。感覺他對於 React 的態度比較理性，不是原旨主義，不追求所有的東西一律 React 化，而是去融合，這一點我很贊同。 Lazy load component利用 webpack 的特性實現 js 文件的按需加載，達到的最終效果是需要渲染某個 component 時，才去請求對應的 js 文件這一點對於被 SPA js 文件過大困擾的人很有誘惑力。grunt 和 gulp 現在的問題是需要自己組裝大量的插件，插件的質量也是參差不齊，插件不好用的時候，自己就要去折騰，去砍樹之前，需要自己做把刀。webpack 配合 React Hot Loader 還能實現代碼熱插拔，開發效率上也能提高很多，有時候等 browserify 編譯其實也挺痛苦的。 Container component劃分特定用途的 component，之前有類似的使用，但是沒有接觸過這樣明確的概念behaviour Container => Sortable component 動作UI Layout Container => SplitPane component 布局Data Container => 為 pure component 提供 state Global state object這是我最感興趣的一個，可以用 Global state object 將頁面完全還原，前端開發中 debug 是個很糾結的問題，有些 bug 很難重現出來，但是如果能複製出一摸一樣的頁面，這個問題就簡單多了，當測試人員/用戶遇到問題時，自動將當時的 state 發送給開發人員，開發人員利用 state 還原現場，非常有助於定位 bug。
美團技術終端組高級工程師呂偉 ：前端分布式編譯系統的設計
呂偉分享的內容是前端分布式編譯系統，有種鳥槍換大炮的感覺。
大型系統的分布式編譯挺常見，但前端代碼倒真是第一次聽說，目前開發的產品用的是grunt + browserify， 雖然代碼並不是很多，但也會有個不長不短的編譯時間， 也是有點難受。同時我非常好奇美團的前端代碼究竟是有多少，都到了分布式編譯的地步。 核心思想還是共享運算資源，具體原理沒有細聽，目的是取代webpack 和 browserify， 正式投產後會完全開源，github見。
餓了麼資深前端架構師兼大前端團隊負責人林建鋒 ：ELE.ME是如何運行的
來自餓了麼的林建鋒也就是sofish魚哥分享的內容是餓了麼在前段工程化上的一些實踐。
前後端分離這個不需要解釋。Rest API，Nginx 託管靜態資源。 開發與發布構建了一套成熟的開發/發布體系，而且封裝成了簡單的命令，甚至還做了一個界面化的 nginx 配置，不過手寫 nginx 配置應該算是前端的必備技能了吧？ 優化使用了 Rest api batch 的做法，將一批請求包括多個API調用合併成一個HTTP請求，減少 HTTP 連接數，有人質疑到合併後會不會影響到頁面的分步渲染速度，但據說並不會，因為瀏覽器對同一域下並發連接數是有限的，一次太多的 http 請求過去也是4個4個的走，所以影響並不大。
百度EFE團隊資深工程師，百度ECharts產品工程師喬剛：前端數據可視化實踐
Echarts團隊的喬剛分享的內容是數據可視化的一些案例和 echarts v3.0 的一些新特性。
目前的產品中正在使用 echarts，可以說真的是非常熟悉， 算是一個挺不錯的圖表庫，簡單易用，圖表種類繁多， 雖然不是 svg 但也支持很多交互事件，之前文檔組織的不夠清晰， 但自從有了那個配置參考之後方便了很多，當然也存在一些不足， 我比較看重的是移動端展現的問題，幾乎擠成一團，移動端的產品只好換成 chartjs 展現，希望能在接下來的 v3.0 中有所改善。
百姓網資深前端工程師賀師俊：如何制定和實施ES6+代碼風格和質量標準
百姓網的賀師俊，也就是前端圈內的老司機hax，他提到了coding style 的制定和實施，確保實施的關鍵點在於工具，這一點很有體會， 如果團隊裡的開發工具都是千奇百怪的，coding style 的統一就更難保證了。我們的團隊在開發工具的統一上做的比較好，統一使用 Vim，連接到遠端機器編寫代碼， 只要手裡有一臺有鍵盤、能聯網的機器，就能進行開發。
賀老一直在力推ES2015，這次還分享了一些使用中的一些疑難問題，
arrow VS function， async VS generator， const VS let， template VS 安全，
已經開始使用 ES2015 的同學應該都有一些自己的體會。快結束的時候還不忘引發聖戰，SPACE VS TAB。
騰訊網際網路增值業務前端團隊負責人鍾鵬飛 ：Hybrid模式的深度融合
騰訊的鐘鵬飛分享的內容是騰訊手機QQ H5優化與監控自動化建設。這部分由於臨時有事，只聽了一部分，有些遺憾。hybrid 也是最近很火的一個話題， 具有native app 的系統福利，又有 web app 的開發效率。 由於之前這方面接觸的不多，學習到了一個新的知識，hybrid app 啟動中 Webview 的耗時佔比很大。
總結
說實話，這次參會主要還是奔著React 來的，然後還看到了很多前端工程化方面的實踐， 收穫頗豐，解決了之前的一些疑惑， 也看到了一些方向。
React 打開了前端開發的新的思路， Virtual DOM，組件化，State 數據流，函數式編程；webpack 使代碼編譯變得更加簡單； 美團的分布式編譯讓人覺得前端開發正在向客戶端開發靠攏；其實前端開發的演化也是在不斷借鑑客戶端開發的經驗， 畢竟我們在開發的已經不是一個單調的 page，而是一個功能豐富的 application。
也許有一天，當前端把客戶端走過的路再走一遍的時候，前端工程體系會變得成熟完善， 我們能把更多的時間集中在真正的開發中。
作者簡介：AdMaster前端高級工程師劉越凡
（責編/夏夢竹，關注程式語言和資料庫領域，尋求報導或者投稿請發郵件xiamz@csdn.net）