FEX 技术周刊 - 2015/10/12 · FEX 技术周刊

## 深阅读 **Using ES2016 Decorators to Publish on an Event Bus** [http://jonathancreamer.com/using-es2016-decorators-to-publish-on-an-event-bus/](http://jonathancreamer.com/using-es2016-decorators-to-publish-on-an-event-bus/) We can use ES2016 decorators to attach behavior to methods on a class. With this we can do things like publishing to an event bus when a method is invoked. **《十二万个漏洞》 - by 乌云方小顿** [http://v.youku.com/v_show/id_XMTM0NjgxMzE1Mg==.html](http://v.youku.com/v_show/id_XMTM0NjgxMzE1Mg==.html) “发现微信的一个漏洞，我可以一天给自己刷100万，也可以选择把它报告给腾讯，然后修复它。后面这种人，也是在我们平台上玩的这种人，叫白帽子。这些人很特别，他的整个思维，他看问题的角度，全部是黑客角度。” 非盈利组织@乌云-漏洞报告平台创始人方小顿「十二万个漏洞」 **程序员可能常犯的 6 个错误** [https://linux.cn/article-6329-1.html](https://linux.cn/article-6329-1.html) 相信大家都不陌生： - 对XX技术/工具不熟悉 - 在一开始就考虑的太多 - 学习语法，而不是编程 - ... **The Art of Visualising Software Architecture** [https://leanpub.com/visualising-software-architecture/read](https://leanpub.com/visualising-software-architecture/read) This book focusses on the visual communication of software architecture. This book doesn’t present a formalised, standardised method to communicate software architecture, it does provide a collection of ideas and techniques that thousands of people across the world have found useful. **The Greatest Regex Trick Ever** [http://www.rexegg.com/regex-best-trick.html](http://www.rexegg.com/regex-best-trick.html) 史上最棒的正则表达式技巧。 **关于单页面应用一些随想** [http://segmentfault.com/a/1190000003811700](http://segmentfault.com/a/1190000003811700) 文中指出的这几个不变量还是挺实在的：单页面背后的数据库原理, 数据界面方案, 编程语言底层。另附近期挖坟挖出来的关于云龙和xufei 关于单页应用的讨论 [https://github.com/xufei/blog/issues/5#issuecomment-136962500](https://github.com/xufei/blog/issues/5#issuecomment-136962500) 。做前端一定要警惕的是：很多曾经的金科玉律或者结论，随着技术进步往往会不适用，所以得去分析很多问题背后不变的东西，结合现状得出靠谱的结论。 **We Love SVG** [https://github.com/icons8/welovesvg](https://github.com/icons8/welovesvg) [https://icons8.com/welovesvg](https://icons8.com/welovesvg) We Love SVG is like Google Fonts but for icons. It makes it quick and easy to insert icons into web pages. It contains 9,769 icons from 30 popular icon packs. **Data first, not code first-One Weird Trick to Write Better Code** [http://etodd.io/2015/09/28/one-weird-trick-better-code/](http://etodd.io/2015/09/28/one-weird-trick-better-code/) We'll cover some standard tips and tricks here, but we're not really interested in those. We're looking for the One Weird Trick to rule them all. Hopefully each trick we encounter brings us closer to coding Mecca. **BazaarJS: our criticisms of Angular** [http://www.leanpanda.com/blog/2015/09/20/our-criticisms-of-angularjs/](http://www.leanpanda.com/blog/2015/09/20/our-criticisms-of-angularjs/) 一篇对 Angular 的吐槽 **Inlining Critical CSS for Dynamic Web Apps** [http://ponyfoo.com/articles/inlining-critical-css](http://ponyfoo.com/articles/inlining-critical-css) 这个技巧在一些展示类应用中还是很有效的，百度搜索结果页一直以来都采用这种做法。 **Go Native - Calling C++ From NodeJS** [http://sagivo.com/post/130207525903/nodejs-addons](http://sagivo.com/post/130207525903/nodejs-addons) Sometimes you want to use your existing C++ code directly from your Node app, and you can, using nan and node-gym, as shown here. **Learning About Node Streams** [http://tokyoincode.com/2015/09/27/learning-about-node-streams/](http://tokyoincode.com/2015/09/27/learning-about-node-streams/) The purpose of this blog post is to explain what a stream is in the simplest way possible. There are already many articles and videos online about this topic; however, I wanted to explain it in the simplest way that I could. This is how I would explain Node streams to a five year old. **The Evolution of a Software Engineer** [https://medium.com/@webseanhickey/the-evolution-of-a-software-engineer-db854689243](https://medium.com/@webseanhickey/the-evolution-of-a-software-engineer-db854689243) 非常形象 **OMG STREAMS** [http://pselle.github.io/omgstreams/#1](http://pselle.github.io/omgstreams/#1) 介绍使用 Node Streams 的相关知识，为何要使用它，以及相关的库及工具。 **ESLint: The Next-Generation JavaScript Linter** [http://www.smashingmagazine.com/2015/09/eslint-the-next-generation-javascript-linter/](http://www.smashingmagazine.com/2015/09/eslint-the-next-generation-javascript-linter/) 大神 Nicholas C. Zakas 对 ESLint 的解读。 **A cartoon guide to Flux** [https://medium.com/code-cartoons/a-cartoon-guide-to-flux-6157355ab207](https://medium.com/code-cartoons/a-cartoon-guide-to-flux-6157355ab207) Flux is both one of the most popular and one of the least understood topics in current web development. This guide is an attempt to explain it in a way everyone can understand. **Customizing ES6 via well-known symbols** [http://www.2ality.com/2015/09/well-known-symbols-es6.html](http://www.2ality.com/2015/09/well-known-symbols-es6.html) In ECMAScript 6, the object Symbol has several properties that contain so-called well-known symbols (Symbol.iterator, Symbol.hasInstance, etc.). These let you customize how ES6 treats objects. This blog post explains the details. **JavaScript 就要统治世界了** [http://segmentfault.com/a/1190000003767058](http://segmentfault.com/a/1190000003767058) 这篇文章，当 JS 科普还是挺不错的。 **软件产品&工程团队5个变革理论；** [http://mp.weixin.qq.com/s?__biz=MjM5MDE0Mjc4MA==&mid=209265940&idx=1&sn=448ad502ed467a374199980d95a19560&scene=0#rd](http://mp.weixin.qq.com/s?__biz=MjM5MDE0Mjc4MA==&mid=209265940&idx=1&sn=448ad502ed467a374199980d95a19560&scene=0#rd) 这几个观点不错：－技术是构建它的文化的产物 - 你可以通过全球范围内的优化而不是本地优化建立学习的文化 - 软件开发应该被看作是不断学习和提升的循环，而不是从开始到结束的过程，或者是对正确性的搜寻 **如何设计类似微信的多终端数据同步协议** [http://mp.weixin.qq.com/s?__biz=MzAwMDU1MTE1OQ==&mid=210831113&idx=1&sn=0ec9729684478575e264a98370027b34&scene=0#rd](http://mp.weixin.qq.com/s?__biz=MzAwMDU1MTE1OQ==&mid=210831113&idx=1&sn=0ec9729684478575e264a98370027b34&scene=0#rd) Grouk是一个创业团队，面向团队通讯的主打产品应用刚开始公测，因此我们也需要实现类似微信的多端数据同步功能，下面我主要从技术和产品的结合场景进行一些心得分享，感觉我们在这方面的探索还是值得和大家探讨的，这种需求业界也没有非常成熟的公开解决方案。 ## 新鲜货 **clipboard.js** [http://zenorocha.github.io/clipboard.js/](http://zenorocha.github.io/clipboard.js/) 体积仅占2k，主要面向现代浏览器的剪切板库，不依赖Flash，不依赖Flash，不依赖Flash，因为很重要，所以说三遍。在现代浏览器逐步开始对Flash动刀的今天，这样的类库会更凸现其重要性。 **Github Integrations Directory** [https://github.com/integrations](https://github.com/integrations) Github官方推出协作工具清单，列出所有可以与Github配合的工具。另附： GitHub supports Universal 2nd Factor authentication ：[https://github.com/blog/2071-github-supports-universal-2nd-factor-authentication](https://github.com/blog/2071-github-supports-universal-2nd-factor-authentication) u2f 这种认证方式挺新颖的。 **AMP HTML** [https://github.com/ampproject/amphtml](https://github.com/ampproject/amphtml) Google 联合许多出版商推出的 HTML 子集，感觉是类似 asmjs 的思路，提供一个功能受限的 HTML，从而保证了高性能。 **React v0.14** [http://facebook.github.io/react/blog/2015/10/07/react-v0.14.html](http://facebook.github.io/react/blog/2015/10/07/react-v0.14.html) 这版将 rect-dom 分离出去了，为在 Web 与 React Native 共享代码打下了基础。 **仙剑奇侠传的web移植版** [https://github.com/LiuJi-Jim/h5pal](https://github.com/LiuJi-Jim/h5pal) [http://jimliu.net/2015/09/30/h5pal-release/](http://jimliu.net/2015/09/30/h5pal-release/) **可视化Promise的工作机制** [http://bevacqua.github.io/promisees/](http://bevacqua.github.io/promisees/) **clipboard.js** [http://zenorocha.github.io/clipboard.js/](http://zenorocha.github.io/clipboard.js/) A modern approach to copy text to clipboard No Flash. No dependencies. Just 2kb **HTML5 & CSS3 Fundamentals: Development for Absolute Beginners** [https://channel9.msdn.com/Series/HTML5-CSS3-Fundamentals-Development-for-Absolute-Beginners](https://channel9.msdn.com/Series/HTML5-CSS3-Fundamentals-Development-for-Absolute-Beginners) 来自微软MSDN 第9频道的开发绝对初学者教程：HTML5/CSS3 基础，总共21个教学视频。 **Debugging Webpack applications in WebStorm** [http://blog.jetbrains.com/webstorm/2015/09/debugging-webpack-applications-in-webstorm/](http://blog.jetbrains.com/webstorm/2015/09/debugging-webpack-applications-in-webstorm/) In this blog post we actually won’t dive into how to get started with Webpack, as lots of great tutorials are available in the Webpack documentation. Instead we’d like to focus on debugging applications built with Webpack in WebStorm 11 EAP **Google fixes nearly decade old Linux kernel TCP bug** [http://bitsup.blogspot.jp/2015/09/thanks-google-tcp-team-for-open-source.html](http://bitsup.blogspot.jp/2015/09/thanks-google-tcp-team-for-open-source.html)[https://github.com/torvalds/linux/commit/30927520dbae297182990bb21d08762bcc35ce1d](https://github.com/torvalds/linux/commit/30927520dbae297182990bb21d08762bcc35ce1d) 谷歌开源TCP小组修复了潜藏了10年之久的Linux内核的TCP缺陷，他们提供的补丁：解决了立方拥塞控制的问题，这是大多数Linux发行版的确实算法。这将对互联网带的性能和效率带来巨大影响 **Attach files to comments** [https://github.com/blog/2061-attach-files-to-comments](https://github.com/blog/2061-attach-files-to-comments) Github 评论支持拖拽上传了。 **美国政府发布官网新设计标准** [https://medium.com/@USDigitalService/introducing-u-s-web-design-standards-aff21383afd6](https://medium.com/@USDigitalService/introducing-u-s-web-design-standards-aff21383afd6)[http://www.cnbeta.com/articles/434541.htm](http://www.cnbeta.com/articles/434541.htm) 美国的首席信息官（CIO）理事会日前发布了一套新的指导方针和开源组件，为其他政府机构网站提供了一些简洁、与时俱进的设计。重新设计的政府机构网站也将帮助人们迅速找到需要的信息。期待我大天朝这方面的快速进步。 **Brotli** [https://github.com/google/brotli/](https://github.com/google/brotli/) Google 开源的新压缩格式，号称比 LZMA 及 bzip2 的压缩率都要高 **Træfɪk** [http://traefik.github.io/](http://traefik.github.io/) 一个七层反向代理服务，优点是能更好地动态调整配置，还有支持 Docker、Mesos 等后端的自动配置 **ScyllaDB: world's fastest NoSQL column store database** [http://www.scylladb.com/](http://www.scylladb.com/) 号称与 Cassandra 兼容又有十倍吞吐量的数据库，它用到了许多高性能的技巧，比如基于 DPDK 在在用户态实现了 TCP 协议。 **Firefox 41 can screenshot a single DOM element** [https://hacks.mozilla.org/2015/09/trainspotting-firefox-41/](https://hacks.mozilla.org/2015/09/trainspotting-firefox-41/) 将一个 DOM 元素以图片的形式保存下来，这个小功能挺有用的。 **他们黑了几乎所有的苹果，还黑了几乎所有的安卓** [http://mp.weixin.qq.com/s?__biz=MjM5NzA1MTcyMA==&mid=209614266&idx=1&sn=535ae7641253fb698fce04117f541053&scene=0#rd](http://mp.weixin.qq.com/s?__biz=MjM5NzA1MTcyMA==&mid=209614266&idx=1&sn=535ae7641253fb698fce04117f541053&scene=0#rd) 近期发生的苹果手机XcodeGhost病毒事件继续发酵，截止至今，已有四千多款iOS应用感染此病毒，相当一部分还在苹果商店上挂着。后来，安卓也要挂了。而这背后利益链，令人咋舌。 **humans.txt** [http://www.humanstxt.org.cn/#](http://www.humanstxt.org.cn/#) 相当有爱：这是一个普通文本文件，包含了参加该网站创建人员的信息，如团队成员、感谢和站点的技术信息。通过该文本文件，我们可以快速了解该网站背后的团队信息以及他们的故事。 **Switch to Swift.** [http://iswift.org/](http://iswift.org/) 一个收费的工具，可以将 Objective-C 的代码转成 Swift 语言，方便进行迁移。 **calipers** [https://github.com/lob/calipers](https://github.com/lob/calipers) 一个 Node 的图片及 PDF 高宽读取库，完全基于 Node 实现，速度比调用 ImageMagick 命令快很多。 **N1** [https://github.com/nylas/N1](https://github.com/nylas/N1) 一个基于 Electron 及 React 写的开源桌面邮箱程序，看起来基于 Electron 开发桌面应用已经很靠谱了。 ## 产品及其它 **七十六年后，哪些哈佛人经历了成功人生？** [http://songshuhui.net/archives/93322](http://songshuhui.net/archives/93322) 揭示影响一个人成功的最大因素是什么，居然是。。。 **几缕代码与闲思 - by 玉伯** [https://github.com/lifesinger/lifesinger.github.io/issues/223](https://github.com/lifesinger/lifesinger.github.io/issues/223) 关于技术团队的管理，关于 Tech Leader 的自我突破，关于骑车，关于怎样过好这乱糟糟又蛮有趣的生活。赞这几个心得： - 技术团队最大的危机，经常来自 Leader 的老去。 - 技术人员的发展，最难的是突破自己的迷障。 - 管理是搭台子，是造环境，是让在环境中的每一个人，都能发挥出最大的价值。 **web框架模块设计三国演义** [http://mp.weixin.qq.com/s?__biz=MjM5MTA1MjAxMQ==&mid=207820768&idx=1&sn=4bd773f1063f27d7154345d5d0893c1d&scene=0#rd](http://mp.weixin.qq.com/s?__biz=MjM5MTA1MjAxMQ==&mid=207820768&idx=1&sn=4bd773f1063f27d7154345d5d0893c1d&scene=0#rd) 用三国人物来介绍框架的各个模块，非常生动形象。 **一个创业者怎么看待读书和写作** [http://mp.weixin.qq.com/s?__biz=MzA4Nzg5Nzc5OA==&mid=207869599&idx=1&sn=965b3d40670d91f94d7b3f1d17bf9535&scene=0#rd](http://mp.weixin.qq.com/s?__biz=MzA4Nzg5Nzc5OA==&mid=207869599&idx=1&sn=965b3d40670d91f94d7b3f1d17bf9535&scene=0#rd) 码农其实可以算半个作家（写程序）和阅读家（看源码），但看书和写点文字对我们也非常重要。 **程序员真正的价值** [http://mp.weixin.qq.com/s?__biz=MzA3NTIzMzIxNQ==&mid=208980068&idx=1&sn=2cd142b54e744930b2d9f3b1ec765bff&scene=2&srcid=10036xgJVlZUWFcAE5pAnTHe&from=timeline&isappinstalled=0#rd](http://mp.weixin.qq.com/s?__biz=MzA3NTIzMzIxNQ==&mid=208980068&idx=1&sn=2cd142b54e744930b2d9f3b1ec765bff&scene=2&srcid=10036xgJVlZUWFcAE5pAnTHe&from=timeline&isappinstalled=0#rd) 赞 mac 君的这个答案：以最小的代价解决问题