阿里雲前端周刊 - 第 39 期

02-04

1. Safari 支持 Service Worker 了！

https://mp.weixin.qq.com/s/gqNjFzRhurLLYTdWjIKpXg

在昨天發布的 Safari 46 技術預覽版里，發布了一個重大更新，在新的桌面版 Safari 里將默認打開 Service Worker，這意味著蘋果正在逐步接受 PWA，我們將進入 PWA 的時代。早在今年 7 月份，就有人問過 WebKit 團隊是否將支持 Service Worker，當時他們的回答是正在考慮，後來在 8 月份變成「In development」，現在終於正式發布了。PWA 的另一個核心特性 Web App Manifest，蘋果表示也正在開發中，按開發進度可能幾個月後就能與我們見面。

2. GraphQL.js 0.12.0 發布

https://github.com/graphql/graphql-js/releases/tag/v0.12.0

該版本包含了很多的新特性與提升，將之前部分實驗特性進行了規範化適應，顯著地提升了 Flow 類型的質量。開發者在升級到該版本時需要仔細評估其對於現有系統的影響，特別是對於那些依賴 GraphQL.js 的構建工具等，更多詳細的版本特性介紹請查看原文。

3. Webpack Cli 2.0.0 發布

https://github.com/webpack/webpack-cli/releases/tag/v.2.0.0

Webpack CLI 是 Webpack 輔助構建工具，能夠將應用構建所需要的配置代碼交由命令行工具去創建，盡量減少開發者所需要的操作。在 2.0 版本中 Webpack CLI 進一步優化了易用性，允許在配置中使用 ES6 等語法，添加了 v8 編譯緩存，同時允許開發者更方便地反饋問題與啟動本地伺服器。

其它

1. 你需要了解的關於 Parcel 的一切

https://medium.freecodecamp.org/all-you-need-to-know-about-parcel-dbe151b70082

Parcel 是新近開源的零配置、高性能的 Web 構建工具，其相較於 Webpack 更為簡單易用；Parcel 內置了開箱即用的開發伺服器，其會自動分析依賴、監測文件變化，並且完成線上熱替換。本文即是對於 Parcel 用法的介紹，首先分析了 Parcel 的優勢，然後具體討論了現代 Web 開發中常見的技術棧的集成方式，包括 React、Vue、TypeScript 等等

2. TypeScript 實戰教程

https://auth0.com/blog/typescript-practical-introduction/

本文通過實例來學習 TypeScript 的基礎特性，首先介紹了如何搭建配置 TypeScript 開發環境，以及主要的編譯選項的含義；然後依次討論了 TypeScript 的語言特性，包括變數、模塊、類與對象、介面、裝飾器、迭代器等等。

3. 基於 Mobx-state-tree 的應用狀態管理

https://egghead.io/courses/manage-application-state-with-mobx-state-tree

本課程是 Mobx 的作者 Michel Westrate 發布在 egghead 上的，詳細介紹 Mobx-state-tree 基本使用的系列視頻課程。開發者能夠在該課程中學習到如何聲明數據模型、如何管理數據模型的生命周期等等，並最終能夠使用 MST 中開箱即用的非同步 Action、Patch、Snapshot、Middleware 等特性來編寫健壯可擴展的現代應用。

4. 瀏覽器 user-agent 簡史

https://parg.co/U47

很多人都知道瀏覽器的 user-agent 字元串，伺服器端通過這個字元串進行客戶端的瀏覽器、操作系統、加密等級、瀏覽器語言、渲染引擎和版本信息的識別。從 1993 年 NCSA 發布首款瀏覽器 Mosaic 以來，這個字元串經歷了紛繁複雜的變化，本文即是介紹 user-agent 字元串的演變簡史。

5. React 與 Vue.js 的異同

https://javascriptreport.com/how-is-react-different-from-vue/

一年來 React 與 Vue.js 都發生了巨大的變化，取得了長足的發展；本文則是在年末的時候對二者進行了一次深度盤點。本文依次從性能、模板與 JSX 的語法、CSS、生態系統、狀態管理等多個角度進行了分析

6. React Native 事件機制探究

https://levelup.gitconnected.com/react-native-events-in-gory-details-what-happens-on-the-way-to-listeners-2cee6c55940c

React Native 在某種程度上可以簡單看做 Javascript-Java-Xcode 轉換器，因此 Raect 代碼與原生代碼之間的事件交互無疑是非常重要的部分；本文即是詳細分析了 React Native 中的事件機制。本文首先介紹了 Device Event Emitter 的設計與單例模式，然後討論了 RCTDeviceEventEmitter, RCTEventEmitter 等 JavaScript 與原生代碼之間的橋樑；接下來本文以簡單的原生組件為例介紹了如何完成原生與 JavaScript 之間的事件傳遞，最後還分析了為何 RN 中沒有冒泡機制。