FEX 技術周刊 - 2016/04/04 · FEX 技術周刊

## 深閱讀 **What if we had a great standard library in JavaScript?** [https://medium.com/@thomasfuchs/what-if-we-had-a-great-standard-library-in-javascript-52692342ee3f](https://medium.com/@thomasfuchs/what-if-we-had-a-great-standard-library-in-javascript-52692342ee3f) [Micro.js](http://microjs.com/)?發起者對 JS 生態思考。A standard library would make it a lot easier to write JavaScript by eliminating the need to come up with similar or same solutions to small issues. **Babel 6 - useless by default - a lesson in how NOT to design software.** [http://fourlightyears.blogspot.com/2016/03/babel-6-useless-by-default-lesson-in.html](http://fourlightyears.blogspot.com/2016/03/babel-6-useless-by-default-lesson-in.html) Babel 6 采用了默認啥也不做，完全通過配置的方式，這樣可以做到非常靈活 **展望2016，REACT.JS 最佳實踐** [http://insights.thoughtworkers.org/react-js-best-practices-for-2016/](http://insights.thoughtworkers.org/react-js-best-practices-for-2016/) 之前發過原版，這是翻譯版本 **npm Package Hijacking: From the Hijackers Perspective** [https://medium.freecodecamp.com/npm-package-hijacking-from-the-hijackers-perspective-af0c48ab9922#.5sdog7uv4](https://medium.freecodecamp.com/npm-package-hijacking-from-the-hijackers-perspective-af0c48ab9922#.5sdog7uv4) 作者趁上周那個 unpublish 事件搶注了其中 238 個模塊，npm 這種完全開放式的方式暴露出了許多問題，一有壞人就悲劇了 **一個支付寶木馬的分析溯源之旅** [http://drops.wooyun.org/papers/14103](http://drops.wooyun.org/papers/14103) 看看如何人肉搜索出想當黑客的高中小朋友 **Dive into React Native performance** [https://code.facebook.com/posts/895897210527114/dive-into-react-native-performance/](https://code.facebook.com/posts/895897210527114/dive-into-react-native-performance/) 對 React Native 的性能分析及建議 **當EventBus遇上RxJava** [http://www.easydone.cn/2016/03/29/](http://www.easydone.cn/2016/03/29/) 接觸過 EventBus 和 RxJava 的都知道，可以用 RxJava 來實現 EventBus，網上隨便一搜，就可以拿得到代碼。但是究竟為什么可以這么做？卻沒有類似的文章作進一步的深度解析。（本文假定讀者都已經了解 EventBus 和 RxJava 是什么，可以做什么。） **重用的邊界** [http://www.jianshu.com/p/916222393523](http://www.jianshu.com/p/916222393523) 復用什么、怎么復用是碼農職業生涯始終要去思考的問題。 **ES7 Decorator 與函數變換** [http://blog.h5jun.com/post/decorator-functional.html](http://blog.h5jun.com/post/decorator-functional.html) 在ES7的眾多新特性中，我個人最喜歡的特性除了廣為人知的 async/await 外，就數Yehuda Katz提出的decorator。 decorator 是什么？decorator 的概念來源于 Python 的decorator，也類似于 Java 的 Annotation。它實際上是一個 wrapper ，作用于一個函數或者對象，對目標函數或對象進行一系列變換，然后返回一個新的函數或對象。另附月影大神的?[從本質認識JavaScript的原型繼承和類繼承](http://blog.h5jun.com/post/inherits.html) **background系列之你不知道的background-position** [http://blog.doyoe.com/2016/03/28/css/background%E7%B3%BB%E5%88%97%E4%B9%8B%E4%BD%A0%E4%B8%8D%E7%9F%A5%E9%81%93%E7%9A%84background-position/](http://blog.doyoe.com/2016/03/28/css/background%E7%B3%BB%E5%88%97%E4%B9%8B%E4%BD%A0%E4%B8%8D%E7%9F%A5%E9%81%93%E7%9A%84background-position/) 我今天要聊的 background-position 應該已經被大家玩得色彩斑斕了。尤其是 CSS Sprites 流行的這些年，background-position 基本上是被應用最多的屬性之一。 **Writing good code: how to reduce cognitive load** [http://chrismm.com/blog/how-to-reduce-the-cognitive-load-of-your-code/](http://chrismm.com/blog/how-to-reduce-the-cognitive-load-of-your-code/) I believe it’s possible to construct a simple mental framework that can be used with any language or library and which will lead to good quality code by default. There are five main concepts I will talk about here. Keep them in mind and writing good code should be a breeze. **The Unbelievable History of the Express JavaScript Framework** [http://thefullstack.xyz/history-express-javascript-framework/](http://thefullstack.xyz/history-express-javascript-framework/) If you’ve used NodeJS at any point during the last 5 years, you’ve most likely used Express as well. It’s the most starred NodeJS related package on GitHub, and averages over a million downloads every week. That’s why a recent shock-wave in the project’s progress caught me by surprise. **The Elevator Pitch for React** [http://developer.telerik.com/featured/elevator-pitch-react/](http://developer.telerik.com/featured/elevator-pitch-react/) Simply stated, the value of React rests upon the fact that it provides a simple and maintainable pattern for creating a tree of UI components. Imagine how simple programming a UI could be by defining the entire interface of your application using React components alone. 另附，來自簡聊一位同學的 React 實踐經驗?[React 的問題和我在試驗的 Respo](https://segmentfault.com/a/1190000004853782) **京東-前端工程化在電商首頁中的實踐** [http://mp.weixin.qq.com/s?__biz=MjM5MTA1MjAxMQ==&mid=402635309&idx=1&sn=813af82b996448a2d3821765281eb6ff](http://mp.weixin.qq.com/s?__biz=MjM5MTA1MjAxMQ==&mid=402635309&idx=1&sn=813af82b996448a2d3821765281eb6ff) 講了京東前端工具、架構、性能優化等方面的實踐。 **面試感悟—-一名3年工作經驗的程序員應該具備的技能** [http://www.cnblogs.com/xrq730/p/5260294.html](http://www.cnblogs.com/xrq730/p/5260294.html) 挺實在的一篇總結文。 **我是一個線程** [http://mp.weixin.qq.com/s?__biz=MzAxOTc0NzExNg==&mid=416915373&idx=1&sn=f80a13b099237534a3ef777d511d831a](http://mp.weixin.qq.com/s?__biz=MzAxOTc0NzExNg==&mid=416915373&idx=1&sn=f80a13b099237534a3ef777d511d831a) 形象生動的科普文。 **三種解密 HTTPS 流量的方法介紹** [https://imququ.com/post/how-to-decrypt-https.html](https://imququ.com/post/how-to-decrypt-https.html) Web 安全是一項系統工程，任何細微疏忽都可能導致整個安全壁壘土崩瓦解。拿 HTTPS 來說，它的「內容加密、數據完整性、身份認證」三大安全保證，也會受到非法根證書、服務端配置錯誤、SSL 庫漏洞、私鑰被盜等等風險的影響。很多同學認為只要訪問的網站地址前有一把小綠鎖就絕對安全，其實不然。本文通過介紹三種最常規的 HTTPS 流量解密方法及原理，淺談一下 HTTPS 的安全風險。 **React vs Angular2: The fight rages on** [http://tech.evojam.com/2016/03/31/react-vs-angular2-the-fight-rages-on/](http://tech.evojam.com/2016/03/31/react-vs-angular2-the-fight-rages-on/) 對比得挺仔細的 **A Beginner’s Guide to npm — the Node Package Manager** [http://www.sitepoint.com/beginners-guide-node-package-manager/](http://www.sitepoint.com/beginners-guide-node-package-manager/) 科普 npm ## 新鮮貨 **changes to npm’s unpublish policy** [http://blog.npmjs.org/post/141905368000/changes-to-npms-unpublish-policy](http://blog.npmjs.org/post/141905368000/changes-to-npms-unpublish-policy) we’ve seen a lot of discussion about why unpublish exists at all. Similar discussions happen within npm, Inc. There are important and legitmate reasons for the feature, so we have no intention of removing it, but now we’re significantly changing how unpublish behaves and the policies that surround it. These changes, which incorporate helpful feedback from a lot of community members, are intended to ensure that events like Tuesday’s don’t happen again. **Introducing Safari Technology Preview** [https://webkit.org/blog/6017/introducing-safari-technology-preview/](https://webkit.org/blog/6017/introducing-safari-technology-preview/) ECMAScript 6; B3 JavaScript JIT compiler; Improved IndexedDB implementation; Shadow DOM; **A Super Tiny Compiler, Written in JS** [https://github.com/thejameskyle/the-super-tiny-compiler](https://github.com/thejameskyle/the-super-tiny-compiler) This is an ultra-simplified example of all the major pieces of a modern compiler written in easy to read JavaScript. Reading through the guided code will help you learn about how most compilers work from end to end. **WebStorm 2016.1 版本發布** [http://www.jetbrains.com/webstorm/whatsnew/](http://www.jetbrains.com/webstorm/whatsnew/) [http://weibo.com/ttarticle/p/show?id=2309403958429365475590](http://weibo.com/ttarticle/p/show?id=2309403958429365475590) 本次更新的亮點有：ECMAScript 6 和 TypeScript 支持上的改進；增強 Angular2 支持；支持調試異步客戶端代碼、ES6中的箭頭函數(arrow function)、 Web Worker 以及 Service Worker；在 WebStorm 內直接連到 Vagrant box 或遠程機上運行并調試 Node.js 應用程序。 **GitLab Runner 1.1 with Autoscaling** [https://about.gitlab.com/2016/03/29/gitlab-runner-1-1-released/](https://about.gitlab.com/2016/03/29/gitlab-runner-1-1-released/) Over the last year, GitLab Runner has become a significant part of the GitLab family. We are happy to announce that GitLab Runner 1.1 is released today; a release that brings major improvements over its predecessor. There is one feature though that we are excited about and is the cornerstone of this release. **iOS資源大全中文版** [https://github.com/Lafree317/iOS](https://github.com/Lafree317/iOS) 基于 awesome-ios 整理的各種庫 **Build Web Application with Golang** [https://astaxie.gitbooks.io/build-web-application-with-golang/content/en/index.html](https://astaxie.gitbooks.io/build-web-application-with-golang/content/en/index.html) Because I’m interested in web application development, I used my free time to write this book as an open source version. It doesn’t mean that I have a very good ability to build web applications; I would like to share what I’ve done with Go in building web applications. **Mozilza Sweet.js, the Macro System for JavaScript, Reaches 1.0** [http://sweetjs.org/](http://sweetjs.org/) [https://medium.com/@disnet/announcing-sweet-js-1-0-e7f4f3e15594](https://medium.com/@disnet/announcing-sweet-js-1-0-e7f4f3e15594) Sweet brings the hygienic macros of languages like Scheme and Rust to JavaScript. Macros allow you to sweeten the syntax of JavaScript and craft the language you’ve always wanted. Macros allow you to build the language of your dreams. Sweeten JavaScript by defining new syntax for your code. **簡聊開源版** [https://github.com/jianliaoim/talk-os](https://github.com/jianliaoim/talk-os) 前端是 React + Flux + CoffeeScript **Airbnb open-sources Caravel: data exploration and visualization platform** [https://github.com/airbnb/caravel](https://github.com/airbnb/caravel) Caravel is a data exploration platform designed to be visual, intuitive, and interactive. Caravel’s main goal is to make it easy to slice, dice and visualize data. It empowers users to perform analytics at the speed of thought. **Translater.JS** [http://jslite.io/translater.js/](http://jslite.io/translater.js/) This is a use of HTML comments page translation solution. For a small amount of static pages, this solution is more simple. it has no dependents, Compression only (4KB) **public-apis - A collective list of public JSON APIs for use in web development.** [https://github.com/toddmotto/public-apis](https://github.com/toddmotto/public-apis) ## 產品及其它 **TOMsInsight - 數據生態鏈：魔鬼手中的雙刃劍** [http://mp.weixin.qq.com/s?__biz=MzA3NTcwOTIwNg==&mid=408359100&idx=1&sn=394541c4a5a41693d928b28270e3d37e](http://mp.weixin.qq.com/s?__biz=MzA3NTcwOTIwNg==&mid=408359100&idx=1&sn=394541c4a5a41693d928b28270e3d37e) 數據不是認知，數據更不是真相。在數據生態鏈中，每個環節都有著各種不公開，也不為人知的「內幕」。這些讓「一切由數據說話」的鐵律成為了笑話，也成為特有的「公司內部政治手段」、「門檻工具」以及「x因素」。中國互聯網生態發展至今，數據已經遠遠不是真相，甚至是阻礙真相的干擾。大量低成本的作假，以及無數次反復摻水作假后的數據不斷的流通著混合著，用來指引著我們的方向。 **究竟什么是虛擬，什么是現實？談沉浸式虛擬現實技術和應用** [http://mp.weixin.qq.com/s?__biz=MzA3NTM4NDE2Mw==&mid=401861016&idx=1&sn=6d6c020a73845e5480e4b1d3adab87d7](http://mp.weixin.qq.com/s?__biz=MzA3NTM4NDE2Mw==&mid=401861016&idx=1&sn=6d6c020a73845e5480e4b1d3adab87d7) VR 可能不僅僅只是下一個平臺，因為它能創造出所有的人類體驗，它可能就是人類的終點。當然，現在還有很多碎片沒有拼合上：沒人知道應該如何解決在虛擬現實中的移動問題，沒人有完美的輸入方案，更不要說 VR 電影、社交方式以及人們想在 VR 中玩的游戲了。 **團隊管理中的呆伯特法則** [http://mp.weixin.qq.com/s?__biz=MzA5NDY0ODkxNA==&mid=402473027&idx=1&sn=0887668e2dba101d4a2c100f077b27c9](http://mp.weixin.qq.com/s?__biz=MzA5NDY0ODkxNA==&mid=402473027&idx=1&sn=0887668e2dba101d4a2c100f077b27c9) 一個人在團隊中很皮，但能力很突出，另一人很老實聽話，但能力一般，受其他人喜歡，相處較舒服。你選誰作 Leader 人選？不要考慮什么維護場景，因為誰都不能預見未來業務。你選誰？ **Etsy 研發體系構建** [http://mp.weixin.qq.com/s?__biz=MzA4NTU2MTg3MQ==&mid=406972236&idx=1&sn=08f8b72269513b85ce05d88cd93cf195](http://mp.weixin.qq.com/s?__biz=MzA4NTU2MTg3MQ==&mid=406972236&idx=1&sn=08f8b72269513b85ce05d88cd93cf195) Etsy是美國一個在線銷售手工工藝品的網站，2005年上線，品類包括服飾、珠寶、玩具、攝影作品、家居用品等，核心賣點是原創和手工，更注重商品背后的故事。Etsy公司的四項關鍵性工程技術實踐：代碼審查、持續部署、架構審查以及無責任事后處理。工程技術原則性方針：放權與信任、集體責任、持續學習以及相互督促。 **Google Earth 讓我們看到了過去30年地球表面的變遷** [https://earthengine.google.com/timelapse/](https://earthengine.google.com/timelapse/) [http://mp.weixin.qq.com/s?__biz=MjM5NjAwNzI0MA==&mid=404317504&idx=1&sn=8fff9428afb95987ab200d6f1a546158](http://mp.weixin.qq.com/s?__biz=MjM5NjAwNzI0MA==&mid=404317504&idx=1&sn=8fff9428afb95987ab200d6f1a546158) 每年一幀，地球在谷歌的眼皮底下給人類放著一部部動畫。然而并不是所有人都看得見