FEX 技術周刊 - 2016/01/18 · FEX 技術周刊

## 深閱讀 **國內Nodejs 2015總結** [https://cnodejs.org/topic/5696e43e6272216e51bff67e](https://cnodejs.org/topic/5696e43e6272216e51bff67e) 有不少優質資源，在 Node 正在走向大規模應用的過程中，想在 16 年在自己的產品用 Node 的話，這個文章是個非常好的參考。 **Parallel JavaScript with ParallelJS** [http://www.sitepoint.com/parallel-javascript-with-paralleljs/](http://www.sitepoint.com/parallel-javascript-with-paralleljs/) [http://adambom.github.io/parallel.js/](http://adambom.github.io/parallel.js/) In this article I’m going to discuss why multi-threading is important and how to implement it in JavaScript with ParallelJS. Parallel.js is a tiny library for multi-core processing in Javascript. It was created to take full advantage of the ever-maturing web-workers API. **iOS 架構模式–解密 MVC，MVP，MVVM以及VIPER架構** [http://ios.jobbole.com/83727/](http://ios.jobbole.com/83727/) 回顧一些流行的架構，并且在理論和實踐上對它們進行比較。 **Miscorsoft - ChakraCore** [https://github.com/Microsoft/ChakraCore](https://github.com/Microsoft/ChakraCore) ChakraCore is the core part of Chakra, the high-performance JavaScript engine that powers Microsoft Edge and Windows applications written in HTML/CSS/JS. ChakraCore supports Just-in-time (JIT) compilation of JavaScript for x86/x64/ARM, garbage collection, and a wide range of the latest JavaScript features. **深入理解CSS中的層疊上下文和層疊順序** [http://www.zhangxinxu.com/wordpress/2016/01/understand-css-stacking-context-order-z-index/](http://www.zhangxinxu.com/wordpress/2016/01/understand-css-stacking-context-order-z-index/) 要理解網頁中元素是如何“論資排輩”的，就需要深入理解CSS中的層疊上下文和層疊順序。我們大家可能都熟悉CSS中的z-index屬性，需要跟大家講的是，z-index實際上只是CSS層疊上下文和層疊順序中的一葉小舟。 **如何評價 Microsoft Edge 瀏覽器** [https://www.zhihu.com/question/29985708](https://www.zhihu.com/question/29985708) 了解下微軟最新的瀏覽器，另附：主流瀏覽器內核介紹?[http://www.cnblogs.com/zichi/p/5116764.html](http://www.cnblogs.com/zichi/p/5116764.html) **CSS Modules?—?Solving the challenges of CSS at scale** [https://medium.com/@tomcornilliac/css-modules-solving-the-challenges-of-css-at-scale-85789980b04f#.9hsr219il](https://medium.com/@tomcornilliac/css-modules-solving-the-challenges-of-css-at-scale-85789980b04f#.9hsr219il) [http://glenmaddern.com/articles/css-modules](http://glenmaddern.com/articles/css-modules) CSS Modules solve them all and add much needed structure to our projects: Global Scope、Overqualified Selectors、Refactoring。另附：[Variables: The Backbone Of CSS Architecture](https://www.smashingmagazine.com/2016/01/variables-in-css-architecture/) **Understanding Garbage Collection and Hunting Memory Leaks in Node.js** [http://blog.codeship.com/understanding-garbage-collection-in-node-js/](http://blog.codeship.com/understanding-garbage-collection-in-node-js/) In this post, I’ll cover how Node.js manages memory and how to trace down memory-related problems. Unlike platforms like PHP, Node.js applications are long-running processes. While this has lots of positive implications such as allowing database connections to be set up once and then reused for all requests, this may also cause problems. **Node.js Buffer knows everything** [https://github.com/ChALkeR/notes/blob/master/Buffer-knows-everything.md](https://github.com/ChALkeR/notes/blob/master/Buffer-knows-everything.md) [https://github.com/nodejs/node/issues/4660](https://github.com/nodejs/node/issues/4660) 關于 buffer 的討論 **A Little Architecture** [http://blog.cleancoder.com/uncle-bob/2016/01/04/ALittleArchitecture.html](http://blog.cleancoder.com/uncle-bob/2016/01/04/ALittleArchitecture.html) 架構師做什么？決定用什么框架什么數據庫？不是的，這些都是不重要的決定，那什么重要呢，自己看吧。 **React with C++: Building the Quip Mac and Windows Apps** [https://medium.com/@btaylor/react-with-c-building-the-quip-mac-and-windows-apps-c63155c1531b#.yzgtho636](https://medium.com/@btaylor/react-with-c-building-the-quip-mac-and-windows-apps-c63155c1531b#.yzgtho636) Quip 如何基于 React 開發 Mac 和 Windows 桌面應用 **[譯]基于 Webpack 和 ES6 打造 JavaScript 類庫** [https://github.com/cssmagic/blog/issues/56](https://github.com/cssmagic/blog/issues/56) 兩個月前，我曾發布了一篇基于 webpack 的 React 起步教程。你眼前的這篇文章跟那一篇差不多，只不過不包含 React 那一塊。這篇教程稍微簡單一些，但仍然會有一些棘手的部分。因此，我特意建了一個全新的代碼倉庫 webpack-library-starter，把創建一個 JavaScript 類庫所需的所有素材都放了進去。 **[譯]Mixin 已死，Composition 萬歲** [http://efe.baidu.com/blog/mixins-are-dead-long-live-the-composition/](http://efe.baidu.com/blog/mixins-are-dead-long-live-the-composition/) 為什么要用 mixin？mixin 解決了什么問題？我們是否可以換一種無繼（Tong）承（ku）的方式去解決這些問題？ **研究首屏時間？你先要知道這幾點細節** [http://www.alloyteam.com/2016/01/points-about-resource-loading/](http://www.alloyteam.com/2016/01/points-about-resource-loading/) 雖然說目前在 PC 端大多數產品應該都不用 Care 性能問題了，但作為一名技術人員，性能還是值得去關注的話題。 **Docker for Beginners** [http://prakhar.me/docker-curriculum/](http://prakhar.me/docker-curriculum/) Docker 是一個值得去實踐的技術，能解決開發環境、應用部署和運維等很多問題。 **Stiff 對九位卓越程序員的采訪** [http://mp.weixin.qq.com/s?__biz=MjM5NTg2NTU0Ng==&mid=405852643&idx=1&sn=52aecedfc552924cb77c55d661b4c316](http://mp.weixin.qq.com/s?__biz=MjM5NTg2NTU0Ng==&mid=405852643&idx=1&sn=52aecedfc552924cb77c55d661b4c316) 如何學的編程？程序員最應該擁有什么樣的技能?覺得數學和物理對程序員重要嗎？等話題，看看大神們怎么回答吧。有趣的是：大神們對 Web 和 JS 還是很有興趣的。 **需求決定架構 —— 萌Mark的架構升級之路** [http://m.blog.csdn.net/article/details?id=50491265](http://m.blog.csdn.net/article/details?id=50491265) 可以算“按需架構”的一個Good Case。另附： * [微信后臺系統的演進之路](http://mp.weixin.qq.com/s?__biz=MjM5MDE0Mjc4MA==&mid=402340325&idx=1&sn=5b7bf6025b1a83a0e529e630fc95ae28) * [你的架構是如何一步步腐化的](http://mp.weixin.qq.com/s?__biz=MzA5Nzc4OTA1Mw==&mid=407873012&idx=1&sn=f29f7bf688eb4666e5b82826227f071f) ## 新鮮貨 **Echarts 3.0發布** [http://echarts.baidu.com/](http://echarts.baidu.com/) **lodash v4.0.0** [https://github.com/lodash/lodash/releases/tag/4.0.0](https://github.com/lodash/lodash/releases/tag/4.0.0) With v4 we’re breaking free from old projects, old environments, & dropping old IE < 9 support! 4 kB Core、More ES6 、More Modular **10th Anniversary of jQuery** [http://ejohn.org/blog/10th-anniversary-of-jquery/](http://ejohn.org/blog/10th-anniversary-of-jquery/) 10 年的生命周期，著實不易。作為一個老牌類庫，雖然風頭不在，但在很多場景下 JQ 仍不失為一個好選擇。同時 jQuery 3.0 發布[http://blog.jquery.com/2016/01/14/jquery-3-0-beta-released/](http://blog.jquery.com/2016/01/14/jquery-3-0-beta-released/) **Wukipedia 15周年** [https://15.wikipedia.org/](https://15.wikipedia.org/) 一個偉大的產品，這個頁面 banner 處的動畫設計挺有特點的。贊頁面中的：知識是愉悅的。 **Ant UX - 讓設計師與程序員一起改變世界** [http://ux.ant.design/](http://ux.ant.design/) Ant UX 是 Ant Design 系列的一個工具, 用來制作頁面邏輯的素材庫, 適用于 OmniGraffle , 我們提供的組件可以幫助你, 快速制作一個產品的頁面邏輯，以及業務流程圖。能在產品設計初期，更好的了解整個架構。 **warp-ctc** [https://github.com/baidu-research/warp-ctc](https://github.com/baidu-research/warp-ctc) 百度深度學習研究院開源了一個用于深度學習的算法組件 **Front End Newsletter** [http://frontendnewsletter.com/](http://frontendnewsletter.com/) The free, weekly newsletter of the best Front End related news, articles, projects, and more.JavaScript, React, Angular, Ember, Polymer, Meteor, RxJS, Elm, and more. **Matrix-Reveal.js based slides lab for users to create and share slides** [https://github.com/akira-cn/matrix](https://github.com/akira-cn/matrix) 大神月影新近整的東東，比較適合寫不咋復雜的ppt的懶家伙使用。類似產品?[https://github.com/ksky521/nodePPT](https://github.com/ksky521/nodePPT) **Gathering statistics on JavaScript projects since 2015** [https://stats.js.org/](https://stats.js.org/) The table shows statistics and a ranking of the 10k most popular JavaScript projects on GitHub. The normalized values are calculated by the given number of stars and forks of a project. **微信web開發者工具** [http://mp.weixin.qq.com/wiki/10/e5f772f4521da17fa0d7304f68b97d7e.html](http://mp.weixin.qq.com/wiki/10/e5f772f4521da17fa0d7304f68b97d7e.html) 為幫助開發者更方便、更安全地開發和調試基于微信的網頁，我們推出了 web 開發者工具。它是一個桌面應用，通過模擬微信客戶端的表現，使得開發者可以使用這個工具方便地在 PC 或者 Mac 上進行開發和調試工作。 **動畫開發者福音？白鷺時代DragonBones** [http://mp.weixin.qq.com/s?__biz=MzA4Mzk1ODYzMw==&mid=402718712&idx=1&sn=17e113d4ee8776d8d4e4e085b4f044a4#rd](http://mp.weixin.qq.com/s?__biz=MzA4Mzk1ODYzMw==&mid=402718712&idx=1&sn=17e113d4ee8776d8d4e4e085b4f044a4#rd) 作為游戲動畫設計師或移動游戲開發者，你在利用工具制作動畫的過程中最關注的是什么？是時間軸、可視化制作、豐富骨骼動畫模板；還是工具擁有豐富的程序支持；抑或是工具本身的易用性、低準入門檻、完善的中文支持和服務？沒錯，DragonBones足夠滿足大家的需求和希望。 **Superpowers, a collaborative HTML5 2D and 3D game maker, is now open-source** [http://superpowers-html5.com/index.en.html](http://superpowers-html5.com/index.en.html) 開源 HTML5 游戲制作工具 **Awesome npm resources and tips** [https://github.com/sindresorhus/awesome-npm](https://github.com/sindresorhus/awesome-npm) **Tonic-a better REPL for Node.js** [https://tonicdev.com](https://tonicdev.com/) What is Tonic? Think of it as a better REPL（Read-Evaluate-Print-Loop,） for Node.js, or a scrapbook for your code. **JavaScript Promise迷你書** [http://liubin.org/promises-book/](http://liubin.org/promises-book/) 對 Promise 還不熟的同學趕緊看看了，16 年必須得學會 ES6 **使用RxJS做一個Pull-to-Refresh的例子** [http://jimliu.net/2016/01/15/building-a-pull-to-refresh-demo-with-rxjs/](http://jimliu.net/2016/01/15/building-a-pull-to-refresh-demo-with-rxjs/) RxJS （Reactive Extensions for JavaScript）是一種新的編程模型，這是一個例子，感興趣的同學可以看看。 **[譯]Angular2開發指南** [https://github.com/gf-rd/blog/issues/21](https://github.com/gf-rd/blog/issues/21) beta 剛發，就已經有人默默的給 angular 布道了 ## 產品及其它 **善良比聰明重要** [https://github.com/lifesinger/blog/issues/227](https://github.com/lifesinger/blog/issues/227) 2010 年，亞馬遜 CEO 杰夫·貝佐斯（Jeff Bezos）在母校普林斯頓大學的畢業典禮上，勉勵年輕人，善用自己的天賦，做出對的選擇。因為，「人生到頭來，我們的選擇，決定了我們是什么樣的人。」 **Google帝國原力覺醒：2016將征戰哪些新疆域** [http://mp.weixin.qq.com/s?__biz=MzI3MTA0MTk1MA==&mid=401834768&idx=1&sn=7fddacd2ed6831deb016250718ef9a25](http://mp.weixin.qq.com/s?__biz=MzI3MTA0MTk1MA==&mid=401834768&idx=1&sn=7fddacd2ed6831deb016250718ef9a25) 圍觀下 Google 的黑科技吧。另附一篇關于硅谷的有意思的文章：[失去靈魂的卓越：什么正在吞噬硅谷](http://tech.qq.com/a/20160117/008101.htm)?核心觀點：” 我們擔心你正在失去靈魂。請接收值得你去做、需要你去做的挑戰，那需要你的熱情、名聲、財富、專注、信念和價值——而不僅僅是市場需要的那些。你是這個時代的建造者；但這并不夠，這個時代還需要你來領導”。發現 Google 才是典范。 **張小龍首次公開演講：4大價值觀揭示微信未來模樣** [http://v.qq.com/cover/a/a7v5hfc9umds0c9.html?vid=s0019dietdc](http://v.qq.com/cover/a/a7v5hfc9umds0c9.html?vid=s0019dietdc) [https://mp.weixin.qq.com/s?__biz=MzA3NDEyMDgzMw==&mid=402863630&idx=1&sn=b4752274767244f8bb28c80fe1483815](https://mp.weixin.qq.com/s?__biz=MzA3NDEyMDgzMw==&mid=402863630&idx=1&sn=b4752274767244f8bb28c80fe1483815) 一切以用戶價值為依歸、讓創造發揮價值、好的產品應該用完即走、讓商業化存在于無形之中。另附：[張小龍和喬布斯的產品境界](http://mp.weixin.qq.com/s?__biz=MjM5OTM5OTAyMQ==&mid=402887168&idx=1&sn=3a7d431bdb23a75835c80ebc42f96299) **微信應用號來了，你自己的 app 該怎么辦？** [http://36kr.com/p/5042147.html](http://36kr.com/p/5042147.html) 分析了 Native app 的問題，以及如何應對 **[TOMsInsight]底層用戶生態：互聯網傳銷蠱惑** [http://mp.weixin.qq.com/s?__biz=MzA3NTcwOTIwNg==&mid=405554671&idx=1&sn=09c109c85937050896bb1a0f04d35fb9](http://mp.weixin.qq.com/s?__biz=MzA3NTcwOTIwNg==&mid=405554671&idx=1&sn=09c109c85937050896bb1a0f04d35fb9) 解讀互聯網的另一面。 **你那些招人的方法都是錯的** [http://weibo.com/p/2309353931558322038041](http://weibo.com/p/2309353931558322038041) 文中提到的這幾點相當重要：自驅、好奇心、品性