前端每周清單第2期：Vue 2.2發布，React在GitHub突破6萬star
新聞熱點
國內國外，前端最新動態
《Vue 2.2.0 發布》：該版本包含了 22 個開發者提交的 31 個 PR，除了更新vue核心包體之外，還需要更新vue-template-compiler以及vue-loader。該版本並未進行公共 API 的更新，不過有部分內部的文檔未提及的 API 發生了變化，詳情可以參考官方文檔。
《React 在 GitHub 上突破 60 000 Star》：近日，React ，這個專註於界面層的小而美的前端庫在 Github 上突破了 60 000 Star。
《Node.js v7.6.0 發布》：Node.js 7.6.0 版本正式發布，可以使用 nvm 等工具進行安裝。此版本最大的亮點在於其默認支持 async/await 語法，而不需要 --harmony-async-await 等命令行參數。Reddit 討論區中大家對於 Koa2 的進一步流行充滿了期待。不過 Twitter 上也有人提醒到，過度使用 await 反而可能帶來性能問題，應該適時地使用 Promise.all()。
《TypeScript 2.2 發布》: TypeScript 基於 ECMAScript 標準構建，並且添加了額外的類型檢測的支持。TypeScript 2.2 能更好地與 VSCode 相結合，提供更加友好的語法提示。除此之外，TypeScript 2.2 還引入了很多新特性，可以查看原文獲取更多信息。
《Chrome開始集成圖形識別 API》：最近，Chrome團隊嘗試在Chrome中集成了一套與圖形識別相關的API，使得圖形識別這種以前只在原生應用中存在，或者在瀏覽器上，要藉助其他難用的外部庫才能實現的功能，現在只要少量代碼即可實現。這些API包括人臉識別，條形碼/二維碼識別和文本識別，基本上覆蓋了當前互聯網應用的大部分場景。
《Yarn 發布其中文網站》：近日， Yarn 中文站正式發布。Yarn 是Facebook開源的，針對存儲在npm或Bower註冊表中的JavaScript模塊的一個代理包管理器，旨在提供更快，更可靠，更安全的包管理。參考資料：《Facebook開源JavaScript包管理器Yarn》。
《Meteor 1.4.3 發布》: Meteor 1.4.3 帶來了一系列的性能提升，特別是對於大型應用的重構建耗時的優化；同時核心包體的版本也都進行了更新，npm 更新到了 4.x 版本。
開發教程
步步為營，掌握基礎技能
《Learn Angular 2 with Me》：該系列視頻介紹 Angular 2 的環境搭建與部分工程實例，包括 Angular CLI 的使用、Angular 模塊基礎、構建註冊表單、動態表單，等等。
《3 步學習 D3 與 Canvas》：此系列教程介紹了 D3.js 與 Canvas 的基本使用，包含了數據綁定、元素繪製以及允許用戶交互這幾個部分。
《全棧開發者學習指南》：全棧開發者即是那些能夠同時負責後端開發、前端開發以及伺服器部署的開發人員，而該系列文章即著眼於介紹成為全棧開發者所必備的那些技能知識。
《基於 React 與 Redux Sagas 的許可權驗證應用開發教程》：此文中作者深入地介紹了如何利用 Redux、Redux Saga、Redux Form、React Router 這些工具開發常見的許可權驗證應用。單獨地使用某個工具似乎沒啥難度，但是在工程應用中將它們較好地組合在一起卻不是件容易事。而此文則是作者從自身工程實踐的角度進行了介紹。
《基於 ReactNative 與 MobX 的 Imgur 應用開發教程》：此文中作者結合 ReactNative 與 MobX 開發一個展示 Imgur 中圖片的應用，涉及到了如何使用 MobX 進行狀態管理、如何與 RESTful API 進行交互、如何在 ListView 中渲染全屏圖片以及如何監聽設備狀態等。
工程實踐
立足實踐，提示實際水平
《2017 Web 發展的 5 個趨勢》：此文討論了 2017 年 Web 發展的 5 個趨勢，包括 Progressive Web App 的崛起、Web 技術棧的日趨穩定與選擇更加靈活、函數式編程繼續風行、以 GraphQL 為代表的數據查詢方式以及面向人工智慧的設計等等。
《在 React 中構建微交互動畫》：微交互能夠更好地引導用戶，提升用戶體驗，而文本則是基於 CSS Transitions、react-motion、react-animations 構建可交互的搜索框。
《理解 JavaScript 中的作用域》：JavaScript 中的作用域、閉包以及上下文綁定一直是令人凌亂的知識，此文作者詳細地從函數作用域、塊作用域、詞法作用域、閉包等進行詳細闡述，值得一讀做個梳理。
《實際項目中 HTTP/2 性能測試與分析》HTTP/2 – A Real-World Performance Test and Analysis：HTTP/2 相較於 HTTP/1 提供了很多的新特性，包括二進位流、多路復用、服務端推送以及消息頭壓縮，從而帶來了顯著的性能提升。此文作者則是基於真實項目對於 HTTP/1 與 HTTP/2 性能表現進行了測試與分析，給出了 HTTP/2 實踐中應該注意的要點建議。
《基於 Webpack 2 的渲染代碼分割》：Webpack 2 對其文檔與使用規範帶來了極大的提升，而 Webpack 2 中對於代碼分割相較於 Webpack 1 也有所變化。此文作者則是從自身項目中的實踐出發介紹代碼分割、包體體積審視與控制以及壓縮等等內容。
《掌握 CSS Animation》: 利用 Keyframes 以及各種各樣的動畫屬性：timing、delay、play state、animation-count、iteration count、direction、fill mode、will change 來構建交互動畫。
《2017 年 React 與 Redux 學習建議》: 此文是作者數年來學習與使用 React 以及 Redux 的感悟，不一定適合純初學者，不過對於有一定基礎概念的很推薦一看。
深度閱讀
深度思考，升華開發智慧
《ECMAScript 2017 and beyond》：這是 Axel Rauschmayer 的演講總結，討論了自從 ECMAScript 2016 以來添加的各種新特性，以及 ES2017 的最終發布版會包含的特性，最後還討論了 ES2017 之後會被加入到標準中的特性。
《async/await 並非萬能，適時使用 Promise》：ES2017 中正式加入了 async/await 特性，這讓我們可以寫出更加優美的非同步代碼。然而，過度地使用 async/await ，特別是在使用 Babel 將其編譯為舊版本瀏覽器支持代碼的情況下，反而會帶來性能損耗。我們應該適時地使用 Promise.all() 等類似方法來提升性能。
《Google宣布攻破SHA-1，從此SHA-1不再安全！》：SHA-1等加密散列函數可謂加密學家手中的瑞士軍刀，距離SHA-1的最初發布已經過去了十年，Google 以及 CWI 正式公布第一套可實現碰撞的實用性技術方案。Linus Torvalds 也對這件事情發表了看法，他表示不需要過分擔心目前 Linux 的安全機制收到影響，畢竟 SHA1 更多的只是校驗而非加密，不過這件事也有助於促進 Linux 代碼的更迭。
《Node.js 社區的發展之道：質量與速度並重》: Node.js 社區的核心目標之一就是在快速迭代的同時保證代碼質量，新發布的版本務必與之前的版本保持相同的穩定性，避免造成生產環境下應用的崩潰。Node.js 社區並沒有一味的尋求妥協，而是不斷突破自己，從而在保證變更速度的同時達成較高的質量要求。此文則是 Node.js 社區對於他們發布版本、變更流程以及自動化測試、性能測試等多方面的介紹。
《Twitter Redux Store 探秘》：複雜應用的 Store 設計一直是開發中的難點，而作為大型內容社交軟體 Twitter 之前宣布 Web 移動端逐步遷移到 Node.js、Express、React PWA 架構，此文就是對於 Twitter 的 Redux Store 設計分析與探秘。
開源項目
樂於分享，共推前端發展
《開源在線代碼演示網站 Dwitter 發布 》：Dwitter 是類似於 CodePen 這樣的，不過專註於 JavaScript 代碼片演示的網站，已經有很多開發者在上面貢獻了奇妙的基於 JavaScript 的動畫或者小程序。
《基於 div 與 純 CSS 實現的載入動畫》：Web 開發中，當我們需要用戶等待某個非同步操作完成，譬如網路請求或者表單提交時，我們應當給予用戶友好的提示。而 CSS Loader 就是僅基於 div 與 CSS3 動畫的載入提示庫，其並不像 GIF 這樣需要額外的圖片請求，並且具有相當好的可維護性與自定義性。
《僅有 500 bytes 的 fetch polyfill》：unfetch 支持 IE8 及以上瀏覽器，提供了完整的 fetch API 的子集，其最大優勢在於壓縮之後的尺寸非常的小。
《AR.js》: AR.js 是高性能的面向 Web 的增強現實的工具庫，它在移動端能達到 60fps。感興趣的可以在手機瀏覽器中打開這裡，然後掃描這個標誌，你會發現一些奇妙的東西。
《Webpack offline 插件》：該插件可以為基於 Webpack 構建的項目添加離線體驗支持，它底層依賴於 ServiceWorker 以及 AppCache 。我們只需要簡單地將插件添加到webpack.config中，然後在客戶端腳本中動態地執行runtime.install()就可以自動緩存所有 Webpack 編譯之後的資源。可以查看這篇博客獲取詳細使用詳解或者參考這個示範項目。
巔峰人生
一覽眾山，聆聽巔峰故事
- 《關於技術選型的那些事兒》：杜歡是滴滴出行的技術總監，負責滴滴小巴業務的技術管理工作。在互聯網領域已經有十年工作經驗，曾就職於微軟、百度，也曾自主創業兩次，來到滴滴之後也經歷過很多項目和業務的變化，是一個「什麼都懂」工程師，對前端、客戶端、服務端、運維等方面都有不少實戰經驗。此文是他在大咖說中的分享整理而成。
回顧杜歡往期分享：
- 2011年在QCon上的主題演講(《HTML5遊戲探索之路》；
- 2016年接受採訪《滴滴杜歡：高歌猛進中的滴滴如何解決架構上的陣痛？》；
- 杜歡為《架構師》2016年8月刊撰寫的卷首語《重構的時機》。
今日薦文
前端每周清單第1期：PWA 將與安卓原生平起平坐
視野拓展
如何用人工智慧的方法實現 App 測試的高度自動化？如何才能有效的進行容量計劃與性能瓶頸分析？如何打造打造一個可靠、快速、互動性更好的 PWA 應用？如何幫助開發和測試人員節省時間？Google 、Airbnb、NimbleDroid、LinkedIn、騰訊、阿里、百度、360等公司一線技術大咖將在 QCon 北京 2017 為您揭秘。點擊這裡，了解更多。
前端之巔
「前端之巔」是InfoQ旗下關注前端技術的垂直社群，加入前端之巔學習群請關注「前端之巔」公眾號後回復「加群」。投稿請發郵件到editors@cn.infoq.com，註明「前端之巔投稿」。
前端之巔最新活動：
推薦閱讀：
※Less的安裝,編譯以及高亮
※前端開發中，多個項目使用的公共組件如何存放？
※Airbnb CSS / Sass 指南
※名人堂 | W3CPlus中國創始人大漠：前端路上的旅行
※CSS布局十八般武藝都在這裡了