3.2
前端每周清单第54 期: SwiftNIO, 自定义vue-router, Web 缓存与GraphQL 必知必会
作者：王下邀月熊 编辑：徐川
前端每周清单专注大前端领域内容，以对外文资料的搜集为主，帮助开发者了解一周前端热点；分为新闻热点、开发教程、工程实践、深度阅读、开源项目、巅峰人生等栏目。欢迎关注【前端之巅】微信公众号
新闻热点
国内国外，前端最新动态
-
苹果开源了
Swift 版Netty ：SwiftNIO: 近日，苹果开源了一款基于事件驱动的跨平台网络应用程序开发框架SwfitNIO ，它有点类似Netty ，但开发语言使用的是Swift 。苹果称SwfitNIO 的目标是帮助开发者快速开发出高性能且易于维护的服务器端和客户端应用协议。SwfitNIO 并不会提供类似Web 框架那样的解决方案，而是致力于为上层框架提供底层的构建块。在开发Web 应用程序时，大部分开发者不会直接使用SwfitNIO ，他们会从Swift 生态系统众多的Web 框架中选择一个。不过，这些框架中的大部分都使用了SwfitNIO 。 -
Chrome 65 新特性介绍: 本文是对即将发布的Chrome 65 版本的新特性进行介绍，主要包 含CSS Paint API, Server Timing API 以及CSS display: contents 属性。其中CSS Paint API 允许以Canvas 那样编程绘制的方式设置元素的background-image 或者border-image 属性，Server Timing API 允许服务端在返回的响应头中设置性能相关信息，以方便客户端完整的性能度量。而display: contents 属性则能够忽略中间元素，适合于Flexbox 等场景。 -
Node v8.10.0 (LTS) & v9.8.0 (Current)
: 本周Node.js v8.10.0 (LTS) 与v9.8.0 发布，继续带来了一系列的特性更新与优化，包括V8, libuv, ICU 等方面。
开发教程
步步为营，掌握基础技能
-
2018 GraphQL 必知必会: 大部分开发者都了解如何构建REST API ，也感受过它的红与黑；本文则是对API 领域的新星，GraphQL 进行介绍与讨论。GraphQL 经常被称作是面向前端的API 技术方案，因为它允许前端开发者以更简单灵活的方式进行数据请求。该特性也正是弥补了传统REST API 的一个不足：无法为不同的客户端返回定制化数据；而GraphQL 的另一个优势在于，能够将原本需要向多接口发起的请求仅向单接口请求。更多相关资料参考 GraphQL Reference。 -
从零构建
Redux : 很多Redux 的初学者可能会受困于繁多的Redux 库，不过Redux 的核心思想却是非常直观与易于理解的。如果你首先理解了Redux 的构建思想，再去将其应用在React 等实际的界面开发场景中，或许更能洞若观火，得心应手。本教程即是在从零构建Redux 核心库的过程中，循序渐进地讲解Redux 的设计思想；更多相关内容参考 现代Web 开发–架构优化篇。 -
JavaScript 面试算法题之Glob Matching : 数据结构与算法相关的问题，往往是面试重要的组成；从作者自身的经验来看，也有越来越多的公司考虑让开发者以JavaScript 实现某些算法题目。本系列文章都是关注于如何使用JavaScript 来实现常见的算法，本文则关注于字符串匹配中常见的Glob Matching ；更多相关内容参考数据结构与算法基础。
工程实践
立足实践，提示实际水平
-
React 开发中的项目组织与组件命名: 作为界面库，React 并未过多的介入到我们前端项目的代码组织与编排中。这个特性保证了React 的独立与灵活性，并且允许开发者能够根据自身项目的特性来个性化编排；不过这也会导致一些初学者无所适从。本文中，作者为我们展示了他的项目组织与命名偏好，这些方法并不是重新造轮子，而是希望能够更好地组合它们。更多相关内容参考 React DevOps Reference。 -
构建自定义的
Vue Router : vue-router 是Vue.js 官方的路由框架，其也为我们提供了完整的将组件映射到不同浏览器路由的功能。不过，本文作者觉得在一些简单的应用中我们并不一定需要vue-router 这样功能完备的库，而可能只需要些许特性；因此作者从零构建了应用于Vue.js 的简单自定义客户端路由库。本文首先介绍了客户端路由的基本特性与要求，然后以Pokemon 为例，循序渐进地介绍该库的具体实现。更多相关内容参考 现代Web 开发–Vue.js 篇。 -
Web 缓存: 缓存能够帮助我们优化应用的处理速度，譬如缓存前一次的抓取数据或者计算结果。本文即是对于缓存体系的完整介绍，从浏览器，到Web 服务器，最后到磁盘与CPU ；本文以自底向上的顺序介绍了不同层次缓存的特性与机制，着眼于数据的存储点而非如何去缓存。更多相关内容参考服务端应用程序开发基础。
深度阅读
深度思考，升华开发智慧
-
React 16 之上：Time Slicing 与Suspense API : 本文是对于近日公布的React 未来新特性，Time Slicing 以及Suspense API 进行讲解。Time-Slicing 允许运行在React Fiber 之上的React ，将对子组件的更新计算切割为不同的块操作，并且在不同的帧中异步执行；而Suspense API 则允许ReactJS 将界面的更新推迟到数据抓取完毕，从而提高更好的用户体验与编程模型。更多相关内容参考 现代Web 开发–React 篇。 -
利用
Web 打造超级计算机: 目前已经有了很多关于使用加密数字货币等基于区块链的技术方案，来挖掘访问网页的客户端的计算潜力，实现去中心化的计算。本文同样尝试去将无数的Web 浏览器客户端调和打造为超级计算机，不过其未使用区块链等技术，而是利用WebSocket ，从零构建完整的技术方案。本文依次讨论了如何最大化利用节点的计算力，如何在多节点间分发任务并且获取任务结果等内容；更多相关内容参考 DistributedSystem CheatSheet。 -
React 中条件渲染的不同实现: JSX 是不错的用来定义UI 组件的JavaScript 扩展，不过其目前并不直接支持循环或者条件表达式；本文即是用不同的方法去实现该需求，也是一篇不错的对于React 中设计模式的概览。本文根据不同的使用场景，介绍了不同的条件渲染的办法：If/Else, Prevent rendering with null, Element variables, Ternary operator, Short-circuit operator (&& ), Immediately-Invoked Function Expressions (IIFE), Subcomponents, High Order Components (HOCs)。更多相关内容参考 现代Web 开发–React 篇。
开源项目
乐于分享，共推前端发展
-
Propel
: Propel 为我们提供了基于GPU 的类似于Numpy 这样的科学计算框架。JavaScript 是类似于Python 这样的动态语言，我们认为其同样能够为科研向的开发者构建合适的工作流。Propel 能够运行在浏览器或者服务端的Node.js 环境中，不同的环境中Propel 皆能够使用GPU 硬件来执行计算任务。浏览器环境下Propel 利用了Deeplearn.js 提供的WebGL 接口，而在Node.js 环境下则使用了TensorFlow 的C 接口。 -
mpvue
: mpvue 是一个使用Vue.js 开发小程序的前端框架。框架基于Vue.js 核心，mpvue 修改了Vue.js 的runtime 和compiler 实现，使其可以运行在小程序环境中，从而为小程序开发引入了整套Vue.js 开发体验。其主要特性包括：彻底的组件化开发能力：提高代码复用性, 完整的Vue.js 开发体验, 方便的Vuex 数据管理方案：方便构建复杂应用, 快捷的webpack 构建机制：自定义构建策略、开发阶段hotReload 等。 -
Xray
: Xray 是Atom 团队在四年多的经验总结之上，构建的实验性的基于Electron 的文本编辑器。目前Xray 正处于快速地迭代开发中，希望能够在未来提供高性能的、可协同编辑的、可扩展的，以及多端体验一致的编辑器。 -
scrcpy
: 该应用提供了利用USB 在电脑屏幕上展示与控制Android 设备的功能，它并不需要任何的Root 权限，并且能够作用于GNU/Linux, Windows 以及Mac OS 等多平台。该工具需要先安装adb 命令，开发者可以直接从Android SDK Platform Tools 中获取。
巅峰人生
- 程序媛小姐姐，了解一下？
: 虽说第一个程序员是女性，但现在，这行业早已被男性所“主宰”。Bloomberg( 彭博) 曾给男程序员创造了一个很有男子气概的词语“ Brogrammer ”(“bro”意为“兄弟”“男人”)，一改程序员呆板的极客形象，将他们描述得又酷又时尚。但同时，这也凸显了IT 行业以男性为主导的发展方式，女程序员们都被忽略了。1842 年，人称“数字女王”的阿达- 洛芙莱斯(Ada Lovelace) 编写了历史上首款电脑程序。时间闪回到170 多年后，电脑编程行业却被男性一统天下。一方面，程序员们被外界贴上的各种负面标签所困扰，另一方面，女性程序员的稀缺又总是在程序员群体里被贴上另一些不太友好的标签。
前端之巅
前端之巅是
