# 2017-10-29 前端日报 ## 精选 [【译】图与例解读Async/Await](https://zhuanlan.zhihu.com/p/30500894) [Vue + TypeScript 新项目起手式 ](https://juejin.im/post/59f29d28518825549f7260b6) [React-Router动态路由设计最佳实践](https://segmentfault.com/a/1190000011765141) [Vue2 原理浅谈](https://juejin.im/post/59f2845e6fb9a0451a759e85) [使用合适的设计模式一步步优化前端代码](https://juejin.im/post/59f29fda518825549f7260c9) [The 14 JavaScript debugging tips you probably didn't know](https://raygun.com/javascript-debugging-tips) [What’s the difference between JavaScript and ECMAScript?](https://medium.freecodecamp.org/whats-the-difference-between-javascript-and-ecmascript-cba48c73a2b5) ## 中文 [【第1093期】带你入门 CSS Grid 布局](https://mp.weixin.qq.com/s?timestamp=1509279298&src=3&ver=1&signature=vMYvXvDMlPP6SS0QPuq*a39Fds1G*zKsyxPyfJUaP3zZgX-fIBWMnqzJoBLkeX6xuESgoKEy0CGFILYwbvZjZ9N40OYEMBlETbGIqTH2TKMVCtC-Y2LbWJZohcvYAbiBRhvOe7*HWWUcHnhzuvByBxaOqjvhnsqqV-h94ri-iiY=) [CSS小技巧：font-display: optional](https://mp.weixin.qq.com/s?timestamp=1509279340&src=3&ver=1&signature=vMYvXvDMlPP6SS0QPuq*a5sNyff48zY8dOWr61wEE675mRdLdaDXMQ2-LtSg8-YMStV1bxFUm3*0OKon9zeOnu5X-YoCxCGb8Jk2Tx0-ATaiTZ9jdTAVpbP58bANnA-KlkzZXFsBG0EnzDFUjrxN0j5GiCIW7ao05SWc4jrkftQ=) [CSS小技巧：真不喜欢无样式字体闪现(FOUT)，那就用 font-display: optional 吧，也许会感到轻松点 - 众成翻译](http://www.zcfy.cc/article/if-you-really-dislike-fout-font-display-optional-might-be-your-jam-css-tricks-4457.html?t=new) [ES6模块，Node.js和Michael Jackson Solution](https://mp.weixin.qq.com/s?timestamp=1509279332&src=3&ver=1&signature=vMYvXvDMlPP6SS0QPuq*a3-nBo-M9qGKkpJLMRfK6gw1hAAkxCXJQLvwJqenMkvMvAF2CyRJrcWujt-OGThf8QsDi45INEL-6F-*v80PkscMwXFK3kTjtCHwth7cZaWiH1nYILleRAlYGpeyhtlCyONOQy9O2avHBuLqj7JhNUc=) [JavaScript中的所有循环类型_JavaScript 教程_w3cplus](https://www.w3cplus.com/javascript/all-type-of-loops-in-javascript-a-brief-explanation.html) [output元素_HTML5 教程_w3cplus](https://www.w3cplus.com/html/the-output-element.html) [react 的数据管理方案：redux 还是 mobx？](http://imweb.io/topic/59f4833db72024f03c7f49b4) [Vue响应式原理源码浅析 - 掘金](https://juejin.im/post/59f2cf59f265da431e16022f) [web app 一分钟适配 iPhone X - 掘金](https://juejin.im/post/59f302eb518825550f53d839) [一道面试题引发的对 JS 类型转换的思考](https://mp.weixin.qq.com/s?timestamp=1509279309&src=3&ver=1&signature=vMYvXvDMlPP6SS0QPuq*ayOhsVV16eYjkmyETn6iJZ*jWucLoVKzD5r9VldhcUAsg4viK9CJbPwEDbIheTMGi*IJRf*m-oXYkirovfQLanWU0owA83IUXKNFNMOZbQX3gteWUC-iOzIatYPnqKuBo3suUCOPoN*WU3LJdphdDs4=) [创意艺术编程(Creative Coding)中如何做像素化过滤。作者Hacker Noon - 众成翻译](http://www.zcfy.cc/article/creating-a-pixelation-filter-for-creative-coding-hacker-noon-4463.html?t=new) [只写CSS的禅 - 众成翻译](http://www.zcfy.cc/article/the-zen-of-just-writing-css-4445.html?t=new) [如何使 JavaScript 更高效？](https://mp.weixin.qq.com/s?timestamp=1509279314&src=3&ver=1&signature=vMYvXvDMlPP6SS0QPuq*a*qI0s*lIB5RYq48dhoBGX5zwp3yUkZmDzCkzffjjY3*2TFJ4tAAybi6Q9XfRGQYZOGeRQNn2iHtso94GKgg2LDthEHcduyhZrNE9E2rx27dFtLmtwEOd8EAhdIkSf*goBgCB4cws6CKBE7EdYBxfVM=) [如何用 React 构建前端架构](http://gitbook.cn/books/59ce0be556ea6001a9f10b2a/index.html) [小米直达服务介绍与开发实战](https://mp.weixin.qq.com/s?timestamp=1509280494&src=3&ver=1&signature=d8*kU3mRr3hAI-8j4KFXzMT4oOrOArjMyeEltlQsLm1PWiHmX5*040JDg3xEaP-8qMplQMz1BhAGcWXdBuC6SVaLMCoYRGn*Hsg0bR7TPwR6fdEFYwifEhJ48OEvmL8-AceTYO2HAaZhhINZ87JrRtQkIxF*Q6VpxyiW9Fjo0RU=) [搭建一个多页面的无依赖的工程化项目 - 掘金](https://juejin.im/post/59f338695188255f5c513fb1) [计算机网络概念和结构 - 掘金](https://juejin.im/post/59f489996fb9a0451e3f0d39) ## 英文 [A Guide to Automating & Scraping the Web with JavaScript (Chrome + Puppeteer + Node JS)](https://codeburst.io/a-guide-to-automating-scraping-the-web-with-javascript-chrome-puppeteer-node-js-b18efb9e9921) [Money20/20 Recap ](https://www.w3.org/blog/2017/10/money2020-recap/) [My approach to using z-index – Hacker Noon](https://hackernoon.com/my-approach-to-using-z-index-eca67feb079c) [React Example Apps ](https://www.javascriptstuff.com/react-example-apps/) [SparkPost/heml: HEML is an open source markup language for building responsive email.](https://github.com/SparkPost/heml)
2017-10-29 前端日报
精选
【译】图与例解读Async/Await
Vue + TypeScript 新项目起手式
React-Router动态路由设计最佳实践
Vue2 原理浅谈
使用合适的设计模式一步步优化前端代码
The 14 JavaScript debugging tips you probably didn't know
What’s the difference between JavaScript and ECMAScript?
中文
【第1093期】带你入门 CSS Grid 布局
CSS小技巧：font-display: optional
CSS小技巧：真不喜欢无样式字体闪现(FOUT)，那就用 font-display: optional 吧，也许会感到轻松点 - 众成翻译
ES6模块，Node.js和Michael Jackson Solution
JavaScript中的所有循环类型_JavaScript 教程_w3cplus
output元素_HTML5 教程_w3cplus
react 的数据管理方案：redux 还是 mobx？
Vue响应式原理源码浅析 - 掘金
web app 一分钟适配 iPhone X - 掘金
一道面试题引发的对 JS 类型转换的思考
创意艺术编程(Creative Coding)中如何做像素化过滤。作者Hacker Noon - 众成翻译
只写CSS的禅 - 众成翻译
如何使 JavaScript 更高效？
如何用 React 构建前端架构
小米直达服务介绍与开发实战
搭建一个多页面的无依赖的工程化项目 - 掘金
计算机网络概念和结构 - 掘金
英文
A Guide to Automating & Scraping the Web with JavaScript (Chrome + Puppeteer + Node JS)
Money20/20 Recap
My approach to using z-index – Hacker Noon
React Example Apps
SparkPost/heml: HEML is an open source markup language for building responsive email.