FEX 技术周刊 – 2016/01/25
最后更新于：2022-04-01 00:04:31
## 深阅读
**从有到优：百度前端接入技术的升级之路**
[http://www.infoq.com/cn/news/2016/01/baidu-frontend-optimization](http://www.infoq.com/cn/news/2016/01/baidu-frontend-optimization)
介绍了百度在 golang、https、速度优化等方面的工作
**React.js Best Practices for 2016**
[https://blog.risingstack.com/react-js-best-practices-for-2016/](https://blog.risingstack.com/react-js-best-practices-for-2016/)
2015 was the year of React with tons of new releases and developer conferences dedicated to the topic all over the world. The most interesting question for 2016: How should we write an application and what are the recommended libraries?
**Reactive Data Flow in Angular 2**
[http://blog.lambda-it.ch/reactive-data-flow-in-angular-2/](http://blog.lambda-it.ch/reactive-data-flow-in-angular-2/)
Angular 2 prescribes no architecture for data flow. In comparision, a data flow architecture is a core concept of Cycle.js, and Cycle.js has opened my eyes to the possibility of implementing an Observable-based reactive data flow architecture in Angular 2\. I would encourage people to spend time looking at multiple frameworks and to promote the cross-pollination of ideas.
**The [real] problem with JavaScript**
[https://medium.com/unhandled-exception/the-real-problem-with-javascript-6b78cad97b6e](https://medium.com/unhandled-exception/the-real-problem-with-javascript-6b78cad97b6e) [https://medium.com/@wob/the-sad-state-of-web-development-1603a861d29f](https://medium.com/@wob/the-sad-state-of-web-development-1603a861d29f)
讨论 JS 、Web 开发、前端生态，起因是第2篇文章，观点挺偏激的，引发了激烈的讨论，不过的确指出了 Web 生态圈面临的一些问题。第1篇文章比较中肯，指出了关键点在于：选择和集成成本太高，作者也在试图建立一个知识库来解决技术选型问题，这是他采集信息的一个调研： [Should I Use](https://alterx.typeform.com/to/ASrKf9)。这两个文章还引申出两个有意思的东西：[Magpie Developer](http://blog.codinghorror.com/the-magpie-developer/)、[The programming language cycle](http://quoderat.megginson.com/2006/03/06/programming-languages-of-distinction/)。
相比之下，最近由 [真阿当-当我说前端基础时，我在说什么](http://weibo.com/p/1001603933000810243086) 引发的国内前端界大讨论就平和多了：
- [知乎-如何评价-当我说前端基础时...](https://www.zhihu.com/question/39659757) - [Vue.js 作者-谈谈前端新技术](http://weibo.com/p/1001603934708609234550) - [为这几天前端方向所撕的逼做个大总结](http://weibo.com/ttarticle/p/show?id=2309403934449430569795) -[http://weibo.com/1693534972/DeAL1tRvy](http://weibo.com/1693534972/DeAL1tRvy) 前端是一个年轻的生态，我们的路还很长，怀着敬畏和谦逊之心、脚踏实地去解决路上的各种问题才是正道。
**Why React/Redux is an inferior paradigm**
[http://staltz.com/why-react-redux-is-an-inferior-paradigm.html](http://staltz.com/why-react-redux-is-an-inferior-paradigm.html)
Today after two years, I needed to write a large application using React and Redux, because I was targetting React Native, and Cycle Native is still experimental and doesn’t support things such as navigation/routing. I had hopes Redux would make React not so unwieldy, but now I can confirm React/Redux is an inferior paradigm compared to Cycle or Elm.
**从无到有：微信后台系统的演进之路**
[http://www.infoq.com/cn/articles/the-road-of-the-growth-weixin-background](http://www.infoq.com/cn/articles/the-road-of-the-growth-weixin-background)
写得非常详细，都是干货，有很多值得借鉴的地方
**微信Android客户端架构演进之路**
[http://www.infoq.com/cn/articles/wechat-android-app-architecture](http://www.infoq.com/cn/articles/wechat-android-app-architecture)
微信客户端如何一步步成长起来的
**从技术细节看美团的架构**
[http://mp.weixin.qq.com/s?__biz=MzA5Nzc4OTA1Mw==&mid=408215395&idx=1&sn=cc49792ef0948a140c37d99306363774](http://mp.weixin.qq.com/s?__biz=MzA5Nzc4OTA1Mw==&mid=408215395&idx=1&sn=cc49792ef0948a140c37d99306363774)
第一部分给大家介绍美团的技术架构，架构是如何演变的。第二部分讲一讲美团的业务架构，在业务方面如何做一些业务流程的优化。最后第三部分介绍O2O技术，如何实现线上和线下都用技术来做优化贯通的。另附： - [看看 Medium 的开发团队用了哪些技术](http://mp.weixin.qq.com/s?__biz=MzA5Nzc4OTA1Mw==&mid=408155245&idx=1&sn=fd1025c984dc209b8109a49b8514ddff) - [各大互联网公司架构演进之路汇总](http://www.hollischuang.com/archives/1036)
**Introduction to Computer Graphics**
[http://math.hws.edu/graphicsbook/](http://math.hws.edu/graphicsbook/)
一本免费的图形学书
**Using V8 code caching to minimize app load time on Android**
[https://www.nativescript.org/blog/using-v8-code-caching-to-minimize-app-load-time-on-android](https://www.nativescript.org/blog/using-v8-code-caching-to-minimize-app-load-time-on-android)
NativeScript 使用 V8 的代码缓存功能来明显提升第二次加载的性能
**Enable Node.js to run with Microsoft's ChakraCore engine**
[https://github.com/nodejs/node/pull/4765](https://github.com/nodejs/node/pull/4765)
Characore 刚开源就有微软的大神给 Node.js 提 MR 让 node.js 支持 ChakraCore 了
**我们用多一点点的辛苦，来交换多一点点的幸福——我的2015年终总结**
[https://mp.weixin.qq.com/s?__biz=MzIwMTQwNTA3Nw==&mid=401373614&idx=1&sn=acff0881673f465d6e20757e4e4c6f3f](https://mp.weixin.qq.com/s?__biz=MzIwMTQwNTA3Nw==&mid=401373614&idx=1&sn=acff0881673f465d6e20757e4e4c6f3f)
一个 iOS 工程师的年度总结，做出了非常多的成绩
**The Issue With Global Node Packages**
[https://www.smashingmagazine.com/2016/01/issue-with-global-node-npm-packages/](https://www.smashingmagazine.com/2016/01/issue-with-global-node-npm-packages/)
npm, which is bundled with Node.js, made this even easier by giving us quick and easy access to tools that others have created, which we install on our machines to access from wherever we are in our system. JavaScript was finally a “real” programming language. But with these new capabilities came a lot of best practices that needed to be discovered, because there were many new scenarios that wouldn’t be found in the browser. In particular, I’d like to discuss a practice that has been on my mind a lot lately that I think much of the community needs to evaluate.
**JavaScript web apps considered valuable**
[http://molily.de/javascript-web-apps/](http://molily.de/javascript-web-apps/)
Recalling best practices for web applications that make heavy use of client-side JavaScript. The solution for bad JavaScript web apps is not to abandon them altogether, but to make better ones. We need to stop excluding JavaScript apps from “the web as it was intended”. JavaScript apps are “on the web” just like other sites. The potential of the web is enormous and we have just started.
**Why I Left Gulp and Grunt for npm Scripts**
[https://medium.com/@housecor/why-i-left-gulp-and-grunt-for-npm-scripts-3d6853dd22b8](https://medium.com/@housecor/why-i-left-gulp-and-grunt-for-npm-scripts-3d6853dd22b8)
Did I really need Gulp? It turns out I didn’t. I decided to try using just npm scripts on my new open source project. The surprising thing is, I now prefer working with npm scripts over Gulp. Here’s why.
**Enumify: better enums for JavaScript**
[http://www.2ality.com/2016/01/enumify.html](http://www.2ality.com/2016/01/enumify.html)
In this blog post, I present enumify, a library for implementing enums in JavaScript. The approach it takes is inspired by Java’s enums.
**为Java说句公道话**
[http://www.yinwang.org/blog-cn/2016/01/18/java/](http://www.yinwang.org/blog-cn/2016/01/18/java/)
王垠在点评各种语言，看看就就好，别当真。作为适应场景最广、普及度最高的语言，在很多场景下 Java 不失为一个相对比较稳妥的选择。就像这两个文章所言：[Java for Everything](http://www.teamten.com/lawrence/writings/java-for-everything.html) [Java at 20: How it changed programming forever](http://www.infoworld.com/article/2923773/java/java-at-20-how-java-changed-programming-forever.html)
**一位Google程序员的算法学习之路**
[https://mp.weixin.qq.com/s?__biz=MjM5NzMyMjAwMA==&mid=402578780&idx=1&sn=76686a4e824acc2e009141f734645c62](https://mp.weixin.qq.com/s?__biz=MjM5NzMyMjAwMA==&mid=402578780&idx=1&sn=76686a4e824acc2e009141f734645c62)
对算法有兴趣的同学可以参考。
**JS 一定要放在 Body 的最底部么？聊聊浏览器的渲染机制**
[http://segmentfault.com/a/1190000004292479](http://segmentfault.com/a/1190000004292479)
科普 JS 在页面中的引入机制相关知识。
**Everything I know about responsive web typography with CSS**
[http://www.zell-weekeat.com/responsive-typography](http://www.zell-weekeat.com/responsive-typography)
I had to write complex code and I found myself struggling to create responsive websites under tremendous time pressure.Now, after months of hacking, I’ve finally created a solution that I’m happy to share with you. It’s called Typi.Typi is great because it allows me to use the practices I’ve learned, and at the same time solves most of the problems I’ve encountered in 3 simple steps. Let me explain these three steps by walking you through the practices I use when working with responsive typography.
**Why you should consider Koa instead of Express with Node.js**
[https://medium.com/@nil1ambda/why-you-should-use-koa-with-node-js-7c231a8174fa#.jf91mpuno](https://medium.com/@nil1ambda/why-you-should-use-koa-with-node-js-7c231a8174fa#.jf91mpuno)
KOA 你值得拥有。
**The State Of Meteor**
[https://www.discovermeteor.com/blog/the-state-of-meteor-part-1-what-went-wrong/](https://www.discovermeteor.com/blog/the-state-of-meteor-part-1-what-went-wrong/)
[https://www.discovermeteor.com/blog/the-state-of-meteor-part-2-what-happens-next/](https://www.discovermeteor.com/blog/the-state-of-meteor-part-2-what-happens-next/)
It’s no secret that Meteor is in a state of flux right now. Blaze is being threatened by React. Meteor’s homegrown package system might be replaced by NPM. And there’s even rumors that Tracker and Minimongo might eventually disappears as well. So it’s fair to ask: what does Meteor’s future look like?
**HTML5实现APP和原生方式有多大差距，多少坑**
[http://www.zhihu.com/question/36158085](http://www.zhihu.com/question/36158085)
这个话题过段时间就会被拉出来讨论。
## 新鲜货
**GT**
[https://github.com/TencentOpen/GT](https://github.com/TencentOpen/GT)
腾讯开源的 APP 上性能测试及调试工具，可以方便随时监控 APP 的各种参数
**WebGL Off the Main Thread**
[https://hacks.mozilla.org/2016/01/webgl-off-the-main-thread/](https://hacks.mozilla.org/2016/01/webgl-off-the-main-thread/)
Firefox 44 开始可以使用 Web Workers 渲染 WebGL
**Web Pages Will Soon Load Even Faster in Google Chrome**
[http://www.omgchrome.com/brotli-http-compression-coming-to-chrome/](http://www.omgchrome.com/brotli-http-compression-coming-to-chrome/)
[https://www.chromestatus.com/feature/5420797577396224](https://www.chromestatus.com/feature/5420797577396224)
[http://google-opensource.blogspot.fr/2015/09/introducing-brotli-new-compression.html](http://google-opensource.blogspot.fr/2015/09/introducing-brotli-new-compression.html)
采用一种叫 Brotli [https://github.com/google/brotli](https://github.com/google/brotli) 的压缩技术来提升资源传输效率，Brotli (shortname "br") is used in WOFF 2.0 web fonts with great success. This is about making it available as an HTTP content-encoding method (e.g. Accept-Encoding: br). Advantages of Brotli over gzip: - significantly better compression density - comparable decompression speed。
**Coworkers**
[https://github.com/tjmehta/coworkers](https://github.com/tjmehta/coworkers)
基于 RabbitMQ 的 Node 微服务框架
**J2ObjC 1.0**
1.0 正式发布了，不再是 beta 版
**OpenFace**
[http://cmusatyalab.github.io/openface/](http://cmusatyalab.github.io/openface/)
一个基于深度学习的开源图像识别库
**Farbfeld**
[http://tools.suckless.org/farbfeld/](http://tools.suckless.org/farbfeld/)
一个简单的图片文件格式，可以方便用程序进行处理，然后再转成其它图片
**React Web**
[https://github.com/taobaofed/react-web](https://github.com/taobaofed/react-web)
兼容 React Native 的 Web 版本，方便代码复用，但不清楚目前有多成熟
**Desktop Neo**
[https://www.desktopneo.com/](https://www.desktopneo.com/)
一个桌面界面及交互的原型，突破了传统窗口及文件夹的限制，看起来挺不错的
**码农 22 期·码农论剑**
[http://www.ituring.com.cn/book/1798](http://www.ituring.com.cn/book/1798)
世界上最好的编程语言是什么？相信每个程序员都有自己的答案。这期围绕编程语言展开。
**Cocos Creator**
[http://cocos.com/creator/](http://cocos.com/creator/)
[https://mp.weixin.qq.com/s?__biz=MjM5ODAxNTM2NA==&mid=409587224&idx=1&sn=86b2285860f950157ce0a3390c70b052](https://mp.weixin.qq.com/s?__biz=MjM5ODAxNTM2NA==&mid=409587224&idx=1&sn=86b2285860f950157ce0a3390c70b052)
Cocos Creator 是以内容创作为核心的游戏开发工具，在 Cocos2d-x 基础上实现了彻底脚本化、组件化和数据驱动等特点，它是基于 Electron 开发的。
**Teach Yourself Deep Learning with TensorFlow and Udacity**
[http://googleresearch.blogspot.com/2016/01/teach-yourself-deep-learning-with.html](http://googleresearch.blogspot.com/2016/01/teach-yourself-deep-learning-with.html)
[http://blog.udacity.com/2016/01/putting-deep-learning-to-work.html](http://blog.udacity.com/2016/01/putting-deep-learning-to-work.html)
为了帮助工程师和数据科学家们更好地使用深度学习，谷歌在网站Udacity上推出了深度学习课程，由谷歌首席科学家Vincent Vanhoucke亲自教授，而且完全免费。该课程包括4次讲座，旨在解决从图像识别到文本分析等问题。
**神秘的 W3C TAG Specification Reviews**
[https://github.com/w3ctag/spec-reviews](https://github.com/w3ctag/spec-reviews)
TAG，全名W3C技术架构组，是独立于所有技术领域、由Tim Berners-Lee亲自带领的神秘小组，不过现在都公开在GitHub上了O网页链接。TAG只有9人，成员每年公开海选，职责是从不同角度（安全数据性能等）审阅W3C的技术规范。
**10 Years of Web Inspector**
[https://webkit.org/blog/5718/10-years-of-web-inspector/](https://webkit.org/blog/5718/10-years-of-web-inspector/)
To commemorate the past 10 years of Web Inspector, we put together this timeline of major events and past blog posts for posterity.
**Feature.js, a feature detection library in 1kb**
[http://featurejs.com/](http://featurejs.com/)
[https://github.com/viljamis/feature.js/](https://github.com/viljamis/feature.js/)
A Fast, simple and lightweight browser feature detection library written in plain JavaScript.
**CMS.js - The Javascript Site Generator**
[http://cdmedia.github.io/cms.js/](http://cdmedia.github.io/cms.js/)
CMS.js is fully client-side, Javascript site generator in the spirit of Jekyll that uses plain ol' HTML, CSS and Javascript to generate your website. It takes your content, renders Markdown and delivers a complete website in Single-Page App fashion...without the aid of server-side scripting (no Node.js, PHP, Ruby, etc.).
**es6-cheatsheet**
[https://github.com/DrkSephy/es6-cheatsheet](https://github.com/DrkSephy/es6-cheatsheet)
A cheatsheet containing ES2015 [ES6] tips, tricks, best practices and code snippet examples for your day to day workflow.
**2^74207281-1 is Prime**
[http://www.mersenne.org/primes/?press=M74207281](http://www.mersenne.org/primes/?press=M74207281)
目前发现的最大的素数
**这十二行代码是如何让浏览器爆炸的**
[http://www.freebuf.com/articles/terminal/93807.html](http://www.freebuf.com/articles/terminal/93807.html)
**Making ReactJS Realtime With Websockets**
[https://blog.pusher.com/making-reactjs-realtime-with-websockets/](https://blog.pusher.com/making-reactjs-realtime-with-websockets/)
This quick tutorial will lead you through building a basic, group chat app
## 产品及其它
**7年 创业路，美丽说的无奈与宿命**
[http://36kr.com/p/5042595.html](http://36kr.com/p/5042595.html)
**Why I Quit my Dream Job at Ubisoft**
[http://gingearstudio.com/why-i-quit-my-dream-job-at-ubisoft](http://gingearstudio.com/why-i-quit-my-dream-job-at-ubisoft)
作者是 Ubisoft 的软件架构师，离开稳定工作去做独立游戏的故事
**阿朱：从50到5000，从技术到人**
[http://segmentfault.com/a/1190000004343120](http://segmentfault.com/a/1190000004343120)
**WeKan-The open-source Trello-like kanban**
[https://wekan.io/](https://wekan.io/)
**管理的本质是激发每一个人的善意**
[http://mp.weixin.qq.com/s?__biz=MzA3Mjc3NTQxMQ==&mid=401563903&idx=2&sn=9ced9bbe3ded34a02ca65c95224f6466](http://mp.weixin.qq.com/s?__biz=MzA3Mjc3NTQxMQ==&mid=401563903&idx=2&sn=9ced9bbe3ded34a02ca65c95224f6466)
管理的本质，其实就是激发和释放每一个人的善意。对别人的同情，愿意为别人服务，这是一种善意；愿意帮人家改善生存环境、工作环境，也是一种善意。领导力本身的定义是有人跟随，有人跟随你，你就是领导。最重要的，就是你把人领导到什么方向上。
**赚钱的事与值钱的事**
[http://mp.weixin.qq.com/s?__biz=MjM5OTM5OTAyMQ==&mid=403244373&idx=1&sn=5045446fc7605b655b9523c195a118a8](http://mp.weixin.qq.com/s?__biz=MjM5OTM5OTAyMQ==&mid=403244373&idx=1&sn=5045446fc7605b655b9523c195a118a8)
赚钱的事，难在收手。好似股票要抛出，才能论输赢。而做值钱的事，难在，看清存在于未来时空运作的新产业结构，然后全力以赴，以最快的速度把它搭建出来。定战略、配资源，说服、说服、坚持、坚持、整合、整合，死扛到结构开始运作并全量覆盖的那一天。