QCon2013上海站總結 -- 前端開發

選擇這個專題開始主要有兩個緣由：一是此次會議關於前端開發的內容很少。二是我作過幾年前端開發，這個專題對我來講會容易點：）

此次QCon上海關於前端開發有一個Keynote，一個Javascript專題。另外就是別的專題中順帶到的分享，如前端測試。具體連接以下：

• Javascript生態圈：http://www.qconshanghai.com/node/318
• 前端開發的Keynote：http://www.qconshanghai.com/node/410
• 前端測試：http://www.qconshanghai.com/node/347
• Javascript in Facebook (ReactJS): http://www.qconshanghai.com/node/345 

我聆聽了其中的部分，首先我要強烈推薦來自Facebook前端工程師 Hedger Wang關於前端開發的Keynote。這位來自臺灣的牛人前後在Yahoo、Google、Facebook工做過。他分享了本身對於Web App被Native App全面超越的見解，總結了目前Web App開發所面臨的挑戰。更重要的是他比較仔細的分析了Web App的將來趨勢。 我的以爲他的演講是我在此次Qcon上所聽到中最棒的。若是你對前端開發比較感興趣，我強烈推薦你去看看的他的Slides，也能夠聯繫我一塊聊聊。這裏，我把這個Keynote的要點總結以下：

• Web App主要職責：資料呈現和用戶交互
• Web領域過去10多年最穩定的技術就是HTML（一直就那些標籤而已），這背後主要的緣由是HTML標準關注的語義描述，而不是具體實現，而且夠簡單夠直接。
• Web App將來的趨勢：
• 去框架化（或者叫標準化）：咱們如今有太多的前端框架，如JQuery、YUI、ExtJs，並且它們都不相容，最關鍵的是它們作的不少事情都是相似。這給前端開發帶來了不少沒必要要的麻煩和開發成本。其實Javascript標準ECMAScript已經升級到V6，裏面已經標準化了不少框架作的事情（並且都是最佳實踐），如繼承。前端開發應該儘可能去框架化並擁抱新的ECMAScript標準。面對如今主流瀏覽器都只支持ECMAScript V3的問題，你能夠找到不少開源軟件（如JSTransform, esprima, google traceur-compiler等）把你的JS Codes轉化成如今瀏覽器所能支持的版本去運行。
• 組件化：咱們應該學習HTML標準，把前端的組件邏輯，狀態和它的具體繪製邏輯給分離開。在如今的前端開發中，咱們常常用CSS來表示一個組件的狀態（如用特定的CSS Class來表示一個Tabs組件當前Active Tab，這就是一種典型的利用下層繪製技術來表達組件狀態的例子。這種方式讓組件的邏輯層和它的實現層混合在一塊兒，很是不利於開發，維護和跨平臺。Facebook爲此提出了一套本身的解決方案：ReactJs。你能夠參考上面的連接瞭解更多細節。
• 自適應化：面對如今客戶端的碎片化，前端開發面臨的一個大挑戰就是怎樣在不一樣設備上呈現內容。目前廣泛的作法就是針對每種終端重作一份。Hedger認爲這種方案並非最佳的（須要額外的開發人員，不一樣終端上的功能不一樣步），咱們應該在組件化的基礎上實現組件的自適應化。讓各個不一樣終端共用統一組件邏輯，而讓組件自身可以自適應它所運行的終端。如今Facebook已經開始這樣作了。
• 聲明化：聲明化應該是針對傳統咱們的命令式編程方法而言。它強調的是對問題自身的描述，而不是怎樣經過命令式的邏輯流去解決一個問題。SQL就是一種典型的聲明式語言。這個應該是最近開發語言的一個主要發展方向（如函數編程）。關於它怎樣運用到前端開發，本人仍是理解很少~~
• 並行化：傳統的瀏覽器一直是單線程模式，它極大的限制了Web App的表現能力。如今Google從WebKit中分支出本身的Blink項目，一個很是重要的功能就是給瀏覽器添加並行化運行的能力。一旦這個作成了（並且成功的可能性很是大，畢竟Google有本身的瀏覽器和牛逼的人），前端WebApp的表現能力將會有很大改善。

總體而言，Hedger仍是很是看好前端的發展，而且認爲前端開發正在進入一個新的嶄新階段。另外我很是佩服Hedger作技術講座的能力，他可以把一個問題的先後邏輯用很是簡單、直觀的方式表現出來。等他的視頻在QCon上面出來後建議你們去看看。此次QCon的一個感受就是技術人員的技術表達能力有時候會比他的內容還重要。

 

另外，我聽了兩個關於Web前端測試的講座。我選擇這個領域是由於幾年前咱們作前端開發的時候，對於Web測試一直都沒有很好的解決方案，尤爲是Web前端測試的穩定性一直是困擾前端QA的頭等麻煩。這兩個講座都是關於Web前端測試穩定性的內容，但側重點有所不一樣。

• 順勢而爲的Web自動化測試：這個講座主要是關注怎樣保證測試用例的穩定性。其基本思想是從用戶的行爲角度來設計測試用例，並用XML的方式表達它，而後利用專門的工具把XML測試用例翻譯成能夠在前端頁面上運行的測試用例並運行。這樣就隔離了測試用例和具體DOM Tree的實現，從而保證了測試用例的穩定性。
• totoro - 簡單易用、穩定的前端單元測試工具：這個講座主要是從測試環境的角度去保證測試的穩定和高效。該講座分享了支付寶是怎樣創建一個高效、穩定、支持多瀏覽器的測試環境。該環境大大提升了前端開發人員的效率並保證了前端的質量。我的以爲是一個不錯的分享，值得前端團隊學習一下。