前端周刊第59期：选 Flow 仍是 TypeScript？

共 2015 字，读完需 4 分钟。周末是时隔两月的家人团聚，而每次内容的准备平均须要我集中精力工做 3 小时，因此第 59 期的内容今早才准备好，对不住你们了。本期的引子是“选 Flow 仍是 TypeScript”，缘起于去年末的 JS 调查报告展现 39% 的程序员据说过会准备采用 TypeScript，你是其中一份子么？从想用到真正开始用缺的就是实践。而笔者也是最近才开始拥抱 TypeScript。下面是本周精选内容，请享用。

文章教程

架构师必读：开源软件的架构

英文系列名为《The Architecture of Open Source Applications》，这个系列文章强烈推荐有志于成为架构师的同窗阅读，里面介绍了很多开源软件的设计理念，全套分四册，彻底开源，覆盖的开源软件有上古神器，也有黑马新秀，若是你没有思考过这些司空见惯的东西究竟是怎么设计的，相信这里面的文章会给你很多启发。最新的系列叫作《500 Lines or Less》，用 500 行代码能作什么？比较有意思。

util.promisify 用法详解

Node.js 8 增长的新特性，让你把各类基于回调的函数方便的转成 Promise，这样就能够在 async/await 上下文使用了，这篇文章介绍了基本用法。

对比 Flow 和 TypeScript

主标题：JS 中的类型系统，原做者也是蛮拼的，JS 中类型系统的对比作了屡次分享，早期对比了 Flow 和 TypeScript 1.x，后来对比了 Flow 和 TypeScript 2.x，最后还把 ELM 加入到对比里面。这是中篇的连接，对比的风格更学术化，若是你想对选用 Flow 仍是 TypeScript 作出很是严谨的选择，这篇是不得不看的。

从 Flow 到 TypeScript

做者在使用 React 开发的早些时候，由于 TypeScript 还不够完善，遂所有采用 Facebook 开源的静态检查方案 Flow，时过境迁发现 TypeScript 更能知足需求，虽然标题里有 vs 字眼，可是明显倾向于 TypeScript，而且给出了从 Flow 到 TypeScript 的基本步骤。TypeScript 是 2016 年 JS 调查报告中 39% 的开发者据说过而且缘由试用的技术，你还在徘徊犹豫么？

React Native 渐进式图片加载思路

WEB 和 APP 领域的不少东西都是通用的，对于多图的应用，图片加载的优化必不可少，这篇文章介绍了在 React Native 中实现图片渐进式加载的方案，而且有实际的代码示例。

开发工具

Lighthouse：让 Dev Tools 如虎添翼

Google 官方出品，目前已经内置在 Chrome Dev Tools 中，能够用来对你的网页，尤为是 H5 作全面的诊断，给出的报告涵盖 PWA、性能、可访问性、最佳实践等方面，不得不说，一份报告就有太多值得学习的地方。而且 Lighthouse 还提供了命令行工具，能够很好的与你的 CI 流程结合。

ZangoDB：浏览器中的 MongoDB

ZangoDB 是基于 HTML5 中 IndexedDB 的相似于 MongoDB 的数据库封装库，若是你熟悉 MongoDB 的各类语法，那么在浏览器中书写 MongoDB 的代码来作数据过滤、分页、投影、排序、更新和聚合已经不是什么难事。

代码框架

FastImage：高性能的 React Native 图片组件

这周对公司 APP 作图片加载优化，调研时找到了 CachedImage 和 FastImage，其中 FastImage 更新，可是容许开发者对图片加载的调度有更大的自主权，二者都支持 Placeholder、文件系统缓存。你能够根据本身的须要选用。

FeatherIcon：美观的开源图标库

社区中能找到的图标库愈来愈多，选择的时候你会考虑哪些要素？是否开源、图标的种类、版权、受欢迎程度、添加新图标的难度？Feather Icon 使用 MIT 受权，主维护者也比较勤奋，使用者很多，设计风格比较简洁，你也能够看看。

找找灵感

学会作任何事情

你会教人如何使用筷子么？看起来很简单的事情，貌似找到他的关键，而且讲解给别人就没有那么容易了。wiki-how 里面有各类如何作 XXX 的教程，当你学一个新的东西时候，写个新教程的时候是否是能够参考呢？

程序员应该访问的最佳网站

已经有人在掘金发过了，里面收录了程序员工做生活可能涉及到的各类网络资源的列表，好比怎么准备面试、去哪里看新闻、哪里有不错的视频教学、有哪些不错的 Youtube 频道、免费的编程书等等，若是你想练习提升本身的英文，这里的每一个连接均可为你所用。

动画渐变函数图示

恰到好处的动画能让你的应用体验更加流畅，谈到动画，不得不提到渐变函数（即 easing functions），渐变函数基本决定了动画的视觉效果，每种不一样的渐变函数究竟是怎样的曲线？这里用图示法给你生动的解释。

视频教程

学习 Recompose 中的高阶组件和函数式组件

来自 egghead.io，若是你使用了 React 至关长的时间，好比说一年，可是还不知道函数式组件、高阶组件是啥，这个视频教程当属于敲黑板系列了，若是说 《React Best Practice and Design Patterns》是文字版的，那么这个就是视频版的，虽然基于 Recompose 讲解，可是不少模式即便不用它也能够本身实现。

egghead.io：60 分钟学会 ES6

是 egghead.io 上为数很少的多人合做的视频课程，经过实际的编码演示了 ES6 中的各类新特性，若是你只是看了 ES6 的各类新语法、结构，可是仍是羡慕别人的代码为啥写的那么溜，能够来看看这个，固然，最好的办法是本身跟着练。

精彩问答

如何使用 Git 管理大文件？

如何使用 Git 管理诸如 PSD、二进制文件、数据库文件等的大文件？这里给出了详细的步骤，有版本的东西就好追溯，软件演化周期的各类资源都是同样的，而 Git 在作这种记录的时候有着自然的优点。

如何使用 JS 格式化货币数字？

可能很多同窗会想到去找个库，若是你的需求很简单，何不本身尝试写个呢？这是个正则的解法，注意答案被讨论的比较多，谨慎采用（仔细看文档老是有好处的）。

One More Thing

本文做者王仕军，商业转载请联系做者得到受权，非商业转载请注明出处。若是你以为本文对你有帮助，请点赞！若是对文中的内容有任何疑问，欢迎留言讨论。想知道我接下来会写些什么？欢迎订阅个人掘金专栏或知乎专栏：《前端周刊：让你在前端领域跟上时代的脚步》。

Happy Hacking