前端每周清单: Safari支持Service Worker, 2017 前端大事件

前端每周清单专注前端领域内容，以对外文资料的搜集为主，帮助开发者了解一周前端热点；分为新闻热点、开发教程、工程实践、深度阅读、开源项目、巅峰人生等栏目。欢迎关注【前端之巅】微信公众号（ID: frontshow），及时获取前端每周清单。

大家圣诞节快乐，本期是 2017 年的最后一期，不知不觉陪伴大家已经一年了；非常感谢所有阅读过清单的同学的支持，山高水远，来年再见~

国内国外，前端最新动态

Safari 支持 Service Worker 了！ : 在昨天发布的 Safari 46 技术预览版里，发布了一个重大更新，在新的桌面版 Safari 里将默认打开 Service Worker，这意味着苹果正在逐步接受 PWA，我们将进入 PWA 的时代。早在今年 7 月份，就有人问过 WebKit 团队是否将支持 Service Worker，当时他们的回答是正在考虑，后来在 8 月份变成“In development”，现在终于正式发布了。PWA 的另一个核心特性 Web App Manifest，苹果表示也正在开发中，按开发进度可能几个月后就能与我们见面。

GraphQL.js 0.12.0 发布 : 该版本包含了很多的新特性与提升，将之前部分实验特性进行了规范化适应，显著地提升了 Flow 类型的质量。开发者在升级到该版本时需要仔细评估其对于现有系统的影响，特别是对于那些依赖 GraphQL.js 的构建工具等，更多详细的版本特性介绍请查看原文。

Webpack Cli 2.0.0 发布 : Webpack CLI 是 Webpack 辅助构建工具，能够将应用构建所需要的配置代码交由命令行工具去创建，尽量减少开发者所需要的操作。在 2.0 版本中 Webpack CLI 进一步优化了易用性，允许在配置中使用 ES6 等语法，添加了 v8 编译缓存，同时允许开发者更方便地反馈问题与启动本地服务器。

步步为营，掌握基础技能

TypeScript 实战教程 : 本文通过实例来学习 TypeScript 的基础特性，首先介绍了如何搭建配置 TypeScript 开发环境，以及主要的编译选项的含义；然后依次讨论了 TypeScript 的语言特性，包括变量、模块、类与对象、接口、装饰器、迭代器等等。更多 TypeScript 教程参考现代 JavaScript 开发：语法基础与工程实践。

基于 Mobx-state-tree 的应用状态管理 : 本课程是 Mobx 的作者 Michel Westrate 发布在 egghead 上的，详细介绍 Mobx-state-tree 基本使用的系列视频课程。开发者能够在该课程中学习到如何声明数据模型、如何管理数据模型的生命周期等等，并最终能够使用 MST 中开箱即用的异步 Action、Patch、Snapshot、Middleware 等特性来编写健壮可扩展的现代应用。更多 MobX 相关教程参考现代 Web 应用架构与性能调优。

浏览器 user-agent 简史 : 很多人都知道浏览器的 user-agent 字符串，服务器端通过这个字符串进行客户端的浏览器、操作系统、加密等级、浏览器语言、渲染引擎和版本信息的识别。从 1993 年 NCSA 发布首款浏览器 Mosaic 以来，这个字符串经历了纷繁复杂的变化，本文即是介绍 user-agent 字符串的演变简史。更多 DOM 相关教程参考现代 Web 开发基础。

立足实践，提示实际水平

NetSPI SQL 注入指南 : 本 Wiki 致力于提供针对数据库管理系统（DBMS）的， SQL 注入攻击的识别、漏洞利用、提权等全流程的完整教程。本教程主要分为五大步骤，依次介绍了注入点分析、DBMS 识别、注入类型、注入技巧、攻击型查询载荷等内容；更多 Web 安全相关资料参考这里。

Node.js 中的 CPU 密集操作 : Node.js 是典型的基于事件循环的单线程架构，其在处理 CPU 密集型任务的时候不可避免地会碰到瓶颈；本系列文章即是探讨如何在 Node.js 中处理 CPU 密集型代码。首篇文章模拟了密集型处理环境，使用 fork 来创建子进程处理任务，不过这种方式效率较低，并且会带来较大的资源占用；第二篇文章则介绍了基于 Redis 的 Kue 消息队列，如何利用 Kue 来异步多节点地处理任务等。更多 Node.js 教程参考深入浅出 Node.js 全栈架构。

React Native 事件机制探究 : React Native 在某种程度上可以简单看做 Javascript-Java-Xcode 转换器，因此 Raect 代码与原生代码之间的事件交互无疑是非常重要的部分；本文即是详细分析了 React Native 中的事件机制。本文首先介绍了 Device Event Emitter 的设计与单例模式，然后讨论了 RCTDeviceEventEmitter, RCTEventEmitter 等 JavaScript 与原生代码之间的桥梁；接下来本文以简单的原生组件为例介绍了如何完成原生与 JavaScript 之间的事件传递，最后还分析了为何 RN 中没有冒泡机制。更多 React Native 相关资料参考这里。

使用 Apollo Client 进行状态管理的未来 : 随着应用体积的增加，其状态管理的复杂性也会大幅度提升；而目前 Apollo Client 已经能够帮助开发者处理远程数据交互，本地的状态数据则依然由 Redux、MobX 这样的状态管理工具负责。本文则是介绍如何利用 Apollo Link 来实现一致性的本地状态管理，统一了远程数据查询与本地状态操作；更多 GraphQL 相关资料参考这里。

深度思考，升华开发智慧

React 与 Vue.js 的异同 : 一年来 React 与 Vue.js 都发生了巨大的变化，取得了长足的发展；本文则是在年末的时候对二者进行了一次深度盘点。本文依次从性能、模板与 JSX 的语法、CSS、生态系统、状态管理等多个角度进行了分析；更多 React 相关资料参考这里。

对于 REST is the new SOAP 的回应 : 上周的清单中，我们推荐了 Rest is the new SOAP 这篇文章，其列举了诸多 REST 的不足；而本文即是 Phil Sturgeon 的辩驳回应。本文对于 Rest is the new SOAP 几乎是逐字逐句地进行了反驳，对比着看也是能够加深对于 REST 的理解；更多 REST 的讨论参考这里服务端应用程序开发基础。

2017 前端领域发生的重大事件盘点 : 年末多盘点，本文则是根据 Github, Google Trends, Stack Overflow, NPM 等站点的统计数据，对 2017 年前端领域发生的重大事件进行了盘点。包括了前端框架、ECMAScript、WebAssembly、包管理器、样式、TypeScript、状态管理、GraphQL、NapaJS 等方面；此外，在上周的清单中我们推荐了 2017 JavaScript Survey，本周作者则从统计的数据中提取出了十条要点。

乐于分享，共推前端发展

Boardgame.io