FEX 技术周刊 – 2015/11/02
最后更新于：2022-04-01 00:04:59
## 业界会议
**Geekon 极棒安全峰会**
[http://geekon2015.geekpwn.org/](http://geekon2015.geekpwn.org/)
**2015 架构师大会 10.22-10.24**
[http://sacc.it168.com/about.html](http://sacc.it168.com/about.html)
高端会议，期待资料
## 深阅读
**回归CSS标准之Float**
[http://efe.baidu.com/blog/float/](http://efe.baidu.com/blog/float/)
这篇文章打算通过将目前一些成文的浮动元素的特点与CSS规范中的具体描述对应，来加深大家对float属性原理的理解。并在后面通过一个bug实例，说明使用这个属性时要注意的问题。
**[ISUX转译]iOS 9人机界面指南（一）：UI设计基础**
[http://isux.tencent.com/ios9-guideline-ch1.html](http://isux.tencent.com/ios9-guideline-ch1.html)
iOS9 人机界面指南的中文版，英文苦手的同学有福了
**淘宝前端团队（FED）- 官方 Blog 闪亮登场**
[http://taobaofed.org/](http://taobaofed.org/)
已经有几篇精彩文章，欢迎围观。
**Re:work – tools and lessons to make work better**
[https://rework.withgoogle.com/](https://rework.withgoogle.com/)
Practices, research, and ideas from Google and other organizations to put people first.
**Introducing Shadow DOM API**
[https://www.webkit.org/blog/4096/introducing-shadow-dom-api/](https://www.webkit.org/blog/4096/introducing-shadow-dom-api/)
We’re pleased to announce that basic support for the new slot-based shadow DOM API we proposed in April is now available in the nightly builds of WebKit after r190680\. Shadow DOM is a part of Web Components, a set of specifications that were initially proposed by Google to enable the creation of reusable widgets and components on the Web.
**GitHub 漫游指南**
[http://github.phodal.com/](http://github.phodal.com/)
作者写得蛮用心的，通过自身的真实故事像我们介绍了 Github 这个神级产品，值得认真看看。这年头如果你还没用过 Github 或者 Gitlab，真心不好意思说自己是码农。
**互联网式焦虑：莫名其妙优越感**
[http://mp.weixin.qq.com/s?__biz=MzA3NTcwOTIwNg==&mid=401883823&idx=1&sn=dc1b7f30a340e498db044124d340c5ca](http://mp.weixin.qq.com/s?__biz=MzA3NTcwOTIwNg==&mid=401883823&idx=1&sn=dc1b7f30a340e498db044124d340c5ca)
每个人都有不同的选择，都需要尊重。客观的认知，理性的选择，也许我们仅仅不希望后悔，当我们为这个行业挥洒青春与血汗的时候；也许我们仅仅不希望虚无，当我们为这个行业奉献到大部分生命之后。每个人的力量那么的微小，很难左右行业的变迁，而也许我们只能去适应，去努力，去渴望，去等待。
**[译]TypeScript 大法好！**
[https://github.com/techird/blog/issues/1](https://github.com/techird/blog/issues/1)
[https://medium.com/@vivainio/typescript-is-pretty-good-d8fecf80ea0c](https://medium.com/@vivainio/typescript-is-pretty-good-d8fecf80ea0c)
为什么说跟 ES6 比起来，TypeScript 更好呢？现在前端社区开始普遍接受转译的做法了（即把各种语法转换成 JS 执行）。虽然还是有部分 ES5 的死忠粉，但他们之中，有绝大部分在一旦在心里接受了 Crockford 的信仰之后，也会忘掉过往固执的经验并且开始转军接受。另附：与大师面对面 - TypeScript 的现状与未来 [http://www.w3ctech.com/topic/1553](http://www.w3ctech.com/topic/1553)
**What PostgreSQL has over other open source SQL databases**
[https://www.compose.io/articles/what-postgresql-has-over-other-open-source-sql-databases/](https://www.compose.io/articles/what-postgresql-has-over-other-open-source-sql-databases/)
[https://www.compose.io/articles/what-postgresql-has-over-other-open-source-sql-databases-part-ii/](https://www.compose.io/articles/what-postgresql-has-over-other-open-source-sql-databases-part-ii/)
You may be asking yourself "Why PostgreSQL?" There are several choices for open source relational databases out there (we looked at MySQL, MariaDB and Firebird for this article), but what does PostgreSQL have that they don't? PostgreSQL's tag line claims that it's: "The world's most advanced open source database." We'll give you a few reasons why PostgreSQL makes this claim.
**前端优化带来的思考，浅谈前端工程化**
[http://www.cnblogs.com/yexiaochai/p/4901341.html](http://www.cnblogs.com/yexiaochai/p/4901341.html)
性能优化的实践，总结得蛮好的。
**后端开发书架2015 2.0版**
[http://calvin1978.blogcn.com/articles/bookshelf.html](http://calvin1978.blogcn.com/articles/bookshelf.html)
大神 江南白衣 整理的服务端开发书目，随着 Node 的持续推进，前端正风风火火的杀入服务端开发这个领域，问题域的变化使得我们必须储备新知识，这份清单挺有帮助的。
**ReFlux细说**
[http://www.html-js.com/article/3204](http://www.html-js.com/article/3204)
Flux作为一种应用架构（application architecture）或是设计模式（pattern），阐述的是单向数据流（a unidirectional data flow）的思想，并不是一个框架（framework）或者库（library）。Reflux，是另一个实现Flux模式的库，旨在使整个应用架构变得更加简单。准确地说，Reflux是由Facebook Flux演变而来（inspired by Facebook Flux），可以说是它的一个进化版本。这个文章对 Flux ReFlux 的分析非常清晰的，值得对 React 不熟的同学看看。
**Long-running Node processes**
[http://spanningcloudapps.github.io/2015/10/12/Long-running-Node-processes/](http://spanningcloudapps.github.io/2015/10/12/Long-running-Node-processes/)
Node 的一个经典问题，可以了解下这篇文章的经验。
**From REST to GraphQL**
[https://blog.jacobwgillespie.com/from-rest-to-graphql-b4e95e94c26b#.i715zzvky](https://blog.jacobwgillespie.com/from-rest-to-graphql-b4e95e94c26b#.i715zzvky)
对 GraphQL 的详细介绍，这个协议很适合移动端应用。
**React Native For Android 架构初探**
[http://mp.weixin.qq.com/s?__biz=MzI1MTA1MzM2Nw==&mid=207782506&idx=1&sn=3ff6b03c0d59fbda406f64739d9272cf&scene=1&srcid=1009Q3qo6mLeT2ydjdzUwLQ7&from=groupmessage&isappinstalled=0#rd](http://mp.weixin.qq.com/s?__biz=MzI1MTA1MzM2Nw==&mid=207782506&idx=1&sn=3ff6b03c0d59fbda406f64739d9272cf&scene=1&srcid=1009Q3qo6mLeT2ydjdzUwLQ7&from=groupmessage&isappinstalled=0#rd)
分析了 React Native Android 是如何实现的。
**Five Things Old Programmers Should Remember**
[https://medium.com/@garywiz/five-things-old-programmers-need-to-remember-e78caf0b0973#.noc8x7fk2](https://medium.com/@garywiz/five-things-old-programmers-need-to-remember-e78caf0b0973#.noc8x7fk2)
对于老程序员的建议
**The Stack That Helped Medium Drive 2.6 Millennia of Reading Time**
[https://medium.com/medium-eng/the-stack-that-helped-medium-drive-2-6-millennia-of-reading-time-e56801f7c492#.e92opawl7](https://medium.com/medium-eng/the-stack-that-helped-medium-drive-2-6-millennia-of-reading-time-e56801f7c492#.e92opawl7)
详尽介绍了 Medium 中所使用的技术，主要是基于 Node 和 DynamoDB
**漫谈Web前端的『组件化』**
[http://leeluolee.github.io/fequan-netease/#/1](http://leeluolee.github.io/fequan-netease/#/1)
来自网易前端的经验。
**腾讯防刷负责人：基于用户画像大数据的电商防刷架构**
[http://mp.weixin.qq.com/s?__biz=MzAwMDU1MTE1OQ==&mid=400931866&idx=1&sn=b96873fc9f726e5705b2653968f1d992](http://mp.weixin.qq.com/s?__biz=MzAwMDU1MTE1OQ==&mid=400931866&idx=1&sn=b96873fc9f726e5705b2653968f1d992)
**HTTP/2 头部压缩技术介绍**
[https://imququ.com/post/header-compression-in-http2.html](https://imququ.com/post/header-compression-in-http2.html)
我们知道，HTTP/2 协议由两个 RFC 组成：一个是 RFC 7540，描述了 HTTP/2 协议本身；一个是 RFC 7541，描述了 HTTP/2 协议中使用的头部压缩技术。本文将通过实际案例带领大家详细地认识 HTTP/2 头部压缩这门技术。
**The Art of Debugging**
[https://remysharp.com/2015/10/14/the-art-of-debugging](https://remysharp.com/2015/10/14/the-art-of-debugging)
This is the accompanying article for my Art of Debugging talk that I first gave at Fronteers in Amsterdam in 2015\. TL;DR: learn every tool that's available to use, use them as you need them, enjoy bug bustin' - it's certainly more fun pounding the keyboard and working on a 6 month feature drive.
**Do you know how much your computer can do in a second?**
[http://computers-are-fast.github.io/](http://computers-are-fast.github.io/)
Let's find out how well you know computers! All of these programs have a variable NUMBER in them. Your mission: guess how big NUMBER needs to get before the program takes 1 second to run.
**58同城沈剑：好的架构是进化来的，不是设计来的**
[http://ws.oneapm.com/shenjian-oneapm-course/](http://ws.oneapm.com/shenjian-oneapm-course/)
对很多创业公司而言，随着业务的增长，网站的流量也会经历不同的阶段。从十万流量到一百万流量，再从一百万流量跨越到一千万甚至上亿的流量，网站的架构需要经历哪些变化？我们一起听听 58 同城的技术委员会执行主席沈剑在 OneAPM 技术公开课上的演讲。
## 新鲜货
**Babel 6.0.0 Released**
[https://babeljs.io/blog/2015/10/29/6.0.0/](https://babeljs.io/blog/2015/10/29/6.0.0/)
**weui**
[https://github.com/weui/weui](https://github.com/weui/weui)
微信官方设计团队推出的前端 UI 库，可以用于微信页面的开发，保持风格统一。
**React Desktop**
[https://github.com/gabrielbull/react-desktop](https://github.com/gabrielbull/react-desktop)
可以用来做 Mac 和 Windows 桌面应用的 React UI 库。
**WebGL 版 BMW i8**
[http://playcanv.as/p/RqJJ9oU9?overlay=false](http://playcanv.as/p/RqJJ9oU9?overlay=false)
基于 playcanvas，渲染效果不错。
**Sketch 3.4**
[http://blog.sketchapp.com/](http://blog.sketchapp.com/)
**参加SF.GG黑客马拉松项目技术要点总结**
[http://f2e.souche.com/blog/2015-hackathon-summary/](http://f2e.souche.com/blog/2015-hackathon-summary/)
玩 Hackathon 的果然是各种新技术，很潮。
**Guide To Using WebP Images Today: A Case Study**
[http://www.smashingmagazine.com/2015/10/webp-images-and-performance/](http://www.smashingmagazine.com/2015/10/webp-images-and-performance/)
They say a picture is worth a thousand words. But online, a picture can be worth a thousand kilobytes or more! HTTP Archive shows that images make up 64% of a web page’s total size on average. Given this, image optimization is key, especially considering that many users will abandon a request if it doesn’t load within a few seconds.
**VMD - preview markdown files**
[https://github.com/yoshuawuyts/vmd](https://github.com/yoshuawuyts/vmd)
Preview markdown files in a separate window. Markdown is formatted exactly the same as on GitHub.
**CSSgram**
[http://una.im/CSSgram/](http://una.im/CSSgram/)
A tiny (<1kb gzipped!) library for recreating Instagram filters with CSS filters and blend modes.
**Walkthrough to upgrade an Angular 1.x component to Angular 2**
[http://toddmotto.com/walkthrough-to-migrate-an-angular-1-component-to-angular-2/](http://toddmotto.com/walkthrough-to-migrate-an-angular-1-component-to-angular-2/)
In this article we’re going to look at upgrading your first Angular 1.x component, a simple todo app, across to Angular 2 code. We’ll compare the API differences, templating syntaxes and hopefully it’ll shed some light on upgrading to Angular 2, and well as making it appear less daunting.
**Vue.js 1.0.0 Released**
[http://zhuanlan.zhihu.com/evanyou/20302927](http://zhuanlan.zhihu.com/evanyou/20302927)
[http://vuejs.org/2015/10/26/1.0.0-release/](http://vuejs.org/2015/10/26/1.0.0-release/)
Improved Template Syntax; API Cleanup; Faster Initial Rendering; More Powerful Tooling.
**jpacks**
[https://github.com/zswang/jpacks](https://github.com/zswang/jpacks)
集鹄大叔还开源的一个二进制结构编解码工具，同时开源的还有 [https://github.com/zswang/jints](https://github.com/zswang/jints)
**Announcing Rust 1.4**
[http://blog.rust-lang.org/2015/10/29/Rust-1.4.html](http://blog.rust-lang.org/2015/10/29/Rust-1.4.html)
[https://github.com/rust-lang/rust/blob/8ab8581f6921bc7a8e3fa4defffd2814372dcb15/RELEASES.md#version-140-october-2015](https://github.com/rust-lang/rust/blob/8ab8581f6921bc7a8e3fa4defffd2814372dcb15/RELEASES.md#version-140-october-2015)
Rust是Mozilla开发的注重安全、性能和并发性的编程语言，现正式发布1.4稳定版，此次升级1200个补丁。另附： Writing an OS in Rust[http://blog.phil-opp.com/](http://blog.phil-opp.com/)
**Node 5.0发布**
[http://alinode.aliyun.com/blog/11](http://alinode.aliyun.com/blog/11)
[https://nodejs.org/en/blog/release/v5.0.0/](https://nodejs.org/en/blog/release/v5.0.0/)
[https://nodejs.org/en/blog/community/node-v5/](https://nodejs.org/en/blog/community/node-v5/)
我了个去，这是要学 Chrome 成为版本帝吗，可是作为编程语言，这样快速升级，真的好吗？
**ThinkJS 2.0**
[https://imququ.com/post/thinkjs-2.html](https://imququ.com/post/thinkjs-2.html)
[https://thinkjs.org/](https://thinkjs.org/)
ThinkJS 是奇舞团开源的一款 Node Web MVC 框架。ThinkJS 2.0 Slogan 换成了「The web framework beyond your dreams」，这也是本文标题的来源。如果说 ThinkJS 1.0 的 Slogan 朴实而理性，那 2.0 的 Slogan 给我的感觉绝对是性感而充满力量。
**Remote 远程控制SDK**
[https://github.com/akira-cn/remote](https://github.com/akira-cn/remote)
大神月影开源的小工具：基于socket.io的远程控制SDK，允许你的PC网页被手机终端远程控制
**MWeb Lite**
[http://zh.mweb.im/](http://zh.mweb.im/)
[http://coderforart.com/mweb-1.8.1-release.html](http://coderforart.com/mweb-1.8.1-release.html)
MWeb Lite 的定位是 Markdown 编辑器和一些 MWeb 正式版的功能的体验。对于轻度使用 Markdown 的朋友来说， MWeb Lite 已足够了，MWeb 正式版的功能大部分用不到。MD 编辑器似乎已经有不少商业化产品了。这也是一个 MD 产品 [http://classeur.io/](http://classeur.io/)
**PyPy 4.0.0 Released - A Jit with SIMD Vectorization and More**
[http://morepypy.blogspot.de/2015/10/pypy-400-released-jit-with-simd.html](http://morepypy.blogspot.de/2015/10/pypy-400-released-jit-with-simd.html)
We’re pleased and proud to unleash PyPy 4.0.0, a major update of the PyPy python 2.7.10 compatible interpreter with a Just In Time compiler. We have improved warmup time and memory overhead used for tracing, added vectorization for numpy and general loops where possible on x86 hardware (disabled by default), refactored rough edges in rpython, and increased functionality of numpy.
**第 24 届国际 C 语言混乱代码大赛结果出炉**
[http://blog.jobbole.com/93692/](http://blog.jobbole.com/93692/)
这代码看的也是罪了。
## 产品及其它
**What a Deep Neural Network thinks about your #selfie**
[http://karpathy.github.io/2015/10/25/selfie/](http://karpathy.github.io/2015/10/25/selfie/)
Convolutional Neural Networks are great: they recognize things, places and people in your personal photos, signs, people and lights in self-driving cars, crops, forests and traffic in aerial imagery, various anomalies in medical images and all kinds of other useful things.
**PHP对战Node.js：我们曾相爱，想到就心酸**
[http://mp.weixin.qq.com/s?__biz=MjM5MDI5MjAyMA==&mid=400167099&idx=1&sn=4c93fd716539c8d5419aa652b7a30f6a](http://mp.weixin.qq.com/s?__biz=MjM5MDI5MjAyMA==&mid=400167099&idx=1&sn=4c93fd716539c8d5419aa652b7a30f6a)
两位昔日好友如今分道扬镳，甚至被迫陷入了你死我活的斗争当中。刚开始的分歧并不严重，无非是一位老友对于另一位伙伴长久以来占据、但又绝口不提的业务领域产生了点兴趣。另附：专访 PHP 之父-PHP7 性能翻倍的关键[http://www.admin10000.com/document/6753.html](http://www.admin10000.com/document/6753.html)
**凯文·凯利最新演讲：未来20年科技的必然走向**
[http://mp.weixin.qq.com/s?__biz=MzA4MjAxODMzMA==&mid=400294559&idx=2&sn=b0e635056741ac35476aac6424c0bd3d](http://mp.weixin.qq.com/s?__biz=MzA4MjAxODMzMA==&mid=400294559&idx=2&sn=b0e635056741ac35476aac6424c0bd3d)
另附这位神奇老头的另一个文章： [http://mp.weixin.qq.com/s](http://mp.weixin.qq.com/s)? __biz=MzA3NTUwODQxOQ==&mid=400410215&idx=3&sn=f71798b1fedda57ce3d4bb4312e3321a
**听百度和科大讯飞谈语音技术现状**
[http://mp.weixin.qq.com/s?__biz=MzI3MTA0MTk1MA==&mid=400189223&idx=1&sn=1cb32bee42de626443ebadbf065ec79c](http://mp.weixin.qq.com/s?__biz=MzI3MTA0MTk1MA==&mid=400189223&idx=1&sn=1cb32bee42de626443ebadbf065ec79c)
[http://mp.weixin.qq.com/s?__biz=MzI3MTA0MTk1MA==&mid=400205267&idx=1&sn=c95916547119be179dcc8895d3b44ad9](http://mp.weixin.qq.com/s?__biz=MzI3MTA0MTk1MA==&mid=400205267&idx=1&sn=c95916547119be179dcc8895d3b44ad9)
2011年之后，深度学习技术引入到语音识别之后，大家也一直再问一个问题，深度学习技术还能像刚提出时候那样，持续大幅度提升现在的语音识别技术吗？语音技术能够从小规模的使用转向全面产业化成熟吗?
**设计规范如何写，这20个精选案例让你大开眼界**
[http://mp.weixin.qq.com/s?__biz=MjM5MzYyNjQyNQ==&mid=400268146&idx=1&sn=02d57397fd46e1de92d166a08a129e27](http://mp.weixin.qq.com/s?__biz=MjM5MzYyNjQyNQ==&mid=400268146&idx=1&sn=02d57397fd46e1de92d166a08a129e27)
给出了业界一些公司的设计规范，值得参考。