FEX 技术周刊 - 2017/11/06

exialym | 06 Nov 2017

微信搜索『FEX』关注我们的公众号，及时获得最新资讯。

业界会议

腾讯 WE大会2017 11.05-06
http://we.tencent.com/html/index.html

深阅读

Version 5.0.0 of Angular Now Available
https://blog.angular.io/version-5-0-0-of-angular-now-available-37e414935ced
This is a major release containing new features and bugfixes. This release continues our focus on making Angular smaller, faster, and easier to use.
另：Announcing TypeScript 2.6、Node.js 8 Moves into Long-Term Support and Node.js 9 Becomes the New Current Release Line、16.1.0-beta.

Bringing collaborative editing to any application
https://ckeditor.com/blog/Bringing-collaborative-editing-to-any-application/
Three years ago, we decided to face the challenge of making real-time, multi-user collaborative writing available for every software out there. That idea kicked off the development of CKEditor 5 and many other solutions now known as the CKEditor Ecosystem. In this article I give a quick overview of the problem we aim to solve, the solutions we developed for that purpose and how to approach collaborative editing in your application.

Ant Design Pro
https://pro.ant.design/index-cn
由 And Design 精心打磨 5 个月的作品，绝对的良心之作。Ant Design Pro 是一个开箱即用的企业级中后台前端/设计解决方案，致力于在设计规范和基础组件的基础上，继续向上构建，提炼出典型模板/业务组件/配套设计资源，进一步提升企业级中后台产品设计研发过程中的『用户』和『设计者』的体验。随着『设计者』的不断反馈，我们将持续迭代，逐步沉淀和总结出更多设计模式和相应的代码实现，阐述中后台产品模板/组件/业务场景的最佳实践。我们基于上述目标和提供了以下的典型模板，并据此构建了一套基于 React 的中后台管理控制台的脚手架，它可以帮助你快速搭建企业级中后台产品原型。

面向未来的前端数据流框架 - dob
https://zhuanlan.zhihu.com/p/30664158
dob 是利用 proxy 实现的数据依赖追踪工具，利用 dob-react 与 react 结合。dob 的核心思想大量借鉴了 mobx，但是从实现原理、使用便捷性，以及调试工具都做了大量优化。同时 dob 借鉴了 nx-js/observer-util 思想，但这个库仅仅停留在理论层面，实际使用中细节问题百出，dob 对其实现原理进行大幅修复，通过了多次实战考验。

前端框架新选择——基于MVVM的San
https://mp.weixin.qq.com/s?__biz=MjM5MDE0Mjc4MA==&mid=2650998840&idx=1&sn=81f16c1a82c53a31c076c1c2d526e66d
为了让几乎所有希望引入 MVVM 的 Web 前端业务场景在做技术选型的时，可以没有顾虑，百度 EFE TEAM 历时接近两年时间设计、开发 San 框架，一个实现了 MVVM 的 Web 组件化框架。在接近两年的时间里，它不断迭代，支撑了越来越多的业务。

从Chrome源码看浏览器如何加载资源
https://zhuanlan.zhihu.com/p/30558018
对浏览器加载资源有很多不确定性，例如：css/font的资源的优化级会比img高，资源的优化级是怎么确定的呢？资源优先级又是如何影响加载的先后顺序的？有几种情况可能会导致资源被阻止加载？通过源码可以找到答案。此次源码解读基于Chromium 64。

腾讯QQ空间超分辨率技术TSR：为用户节省3/4流量，处理效果和速度超谷歌RAISR
https://www.leiphone.com/news/201710/c0GICjRacVyzHKIM.html
TSR技术在同样的标准下，处理速度在RAISR的基础上提升了40%，处理效果也有明显提升。此外，TSR也是业界首次实现移动端使用深度神经网络进行超分辨率，并保证图片能够实时进行处理。即使在用户的普通Andriod手机，也可以使用这项技术。

I Watched All of the Chrome Dev Summit 2017 Videos So You Don’t Have To
https://redfin.engineering/i-watched-all-of-the-chrome-dev-summit-2017-videos-so-you-dont-have-to-9b62a593c3cb
Google wants you to build PWAs, reduce JavaScript file size, use Web Components, and configure autofill. They announced only a handful of features around payments, authentication, Android Trusted Web Activities, Chrome Dev Tools, and the Chrome User Experience Report.

The VS Code Roadmap 2018
https://github.com/Microsoft/vscode/wiki/Roadmap
As 2017 comes to an end, now is the time to look towards the future. We typically look out 6 to 12 months, establish a set of themes we want to work towards, and then schedule work each milestone supporting those themes.

The State of Data Science & Machine Learning
https://www.kaggle.com/surveys/2017
The below report shares some of our key findings and includes interactive visualizations so you can easily cut the data to find out exactly what you want to know.

ORCHID - Access The World!
https://orchidprotocol.com/
The Orchid Protocol is the decentralized, open-source technology for an Internet free from surveillance and censorship. Orchid combines its protocol with surplus bandwidth, state-of-the art-encryption, and a decentralized infrastructure to bring users surveillance-free access to the existing Internet. Because everyone is surveilled and bandwidth is ubiquitous, Orchid users can exchange bandwidth in peer-to-peer transactions using Orchid tokens on the Ethereum blockchain.

Ending the debate on inline functions in React
https://flexport.engineering/ending-the-debate-on-inline-functions-in-react-8c03fabd144
Using inline functions in React is convenient but can be contentious because of their perceived impact on performance. Today Flexport is introducing our solution to the debate: a Babel transform called reflective-bind.

The 14 JavaScript debugging tips you probably didn’t know
https://raygun.com/javascript-debugging-tips
We’ve put together a list of 14 debugging tips that you may not know, but might want to keep in mind for next time you find yourself needing to debug your JavaScript code!

Migrating Slack’s Desktop App to BrowserView
https://slack.engineering/growing-pains-migrating-slacks-desktop-app-to-browserview-2759690d9c7b
We rewrote most of our Electron app to move from the janky webview to the new-fangled BrowserView. We managed to do it in a relatively short timeframe, thanks to a combination of elbow grease and reasonable choices in our client stack, like: Redux + redux-electron; Rx + redux-observable; TypeScript: Helps us refactor code quickly and correctly.

Engineering Uber’s On-Call Dashboard
https://eng.uber.com/on-call-dashboard/
In this article, we introduce On-Call Dashboard by outlining its flagship features and share how engineering teams at Uber use this powerful tool.

Understanding How Graal Works - a Java JIT Compiler Written in Java
http://chrisseaton.com/rubytruffle/jokerconf17/
Graal 源码解析

A Minimalist Guide to SQLite
http://tech.marksblogg.com/sqlite3-tutorial-and-guide.html
SQLite 3 isn’t a toy. It’s a powerful SQL-language interface enabler. As storage speeds and single core performance in CPUs increase the amount of data that can be sensibly handled within a reasonable time by SQLite 3 continues to grow.

How We Identify and Stop Slow Latency Leaks at LinkedIn
https://engineering.linkedin.com/blog/2017/10/fixing-the-plumbing-how-we-identify-and-stop-slow-latency-leaks
At LinkedIn, we pay attention to site speed at every step of the release process, from code development to production ramp. But inevitably, the performance of our pages degrades over time (we use the word “pages” to denote webpages as well as mobile apps). In this post, we go over the tools and processes we use to catch and fix these degradations. While this is a post about automation to identify latency leaks, it is also a tale of how a human touch is still necessary.

How AI has started to impact our work as designers
https://uxdesign.cc/how-ai-will-impact-your-routine-as-a-designer-2773a4b1728c
技术如何帮助设计师提升效率，附：10 Ways to Use AI for Web Design

Web Typography: Designing Tables to be Read, Not Looked At
https://alistapart.com/article/web-typography-tables
Good designers spend a great deal of time sweating over typography. They agonise over typefaces, iterate through type scales and meticulously apply white space, all in the service of the reader. Then comes along a table with the temptation to get creative, and all thoughts of the reader go out of the window. And yet tables are there to be read, referenced and used, not merely looked at.

Sketching Interfaces - Generating code from low fidelity wireframes
https://airbnb.design/sketching-interfaces/
The time required to test an idea should be zero. This was the very first sentence I wrote when considering the Airbnb design tools team vision. We believe that, within the next few years, emerging technology will allow teams to design new products in an expressive and intuitive way, while simultaneously eliminating hurdles from the product development process. Our team has begun exploring methods to bring testing time to zero. As we learn and build, we will be sharing what we’re working on here.

10 UX Design Predictions For 2018
https://blogs.adobe.com/creativecloud/10-ux-design-predictions-for-2018/
We’re living in a time when design and user experience have never mattered more. The past decade of change shows us that design must constantly adapt as a discipline in order to meet user needs.While it’s impossible to see the future, we can still make some educated guesses about it. In this article, I go through some of the trends that will shape UX design in 2018 and, possibly, for several more years to come.
另附：9 Principles of Mobile Web Design

新鲜货

Apache Kafka Goes 1.0
https://www.confluent.io/blog/apache-kafka-goes-1-0/
1.0.0 is a significant release with real enhancements, but the number matters too. What does v1.0 mean for Apache Kafka? To answer that, let me take a step back and give you the backstory: Apache Kafka v1.0: Completeness of our vision; Kafka’s transformation from a Messaging System to a Streaming Platform; Apache Kafka: An entire ecosystem around streams of data.

An HTTP Status Code for Indicating Hints
https://datatracker.ietf.org/doc/draft-ietf-httpbis-early-hints/
This memo introduces an informational HTTP status code that can be used to convey hints that help a client make preparations for processing the final response.

Chrome 63 Beta: Dynamic module imports, async iterators and generators, Device Memory API, and permissions UI changes
https://blog.chromium.org/2017/10/chrome-63-beta-dynamic-module-imports_27.html
另附：Introducing new JavaScript optimizations, WebAssembly, SharedArrayBuffer, and Atomics in EdgeHTML 16。

Kotlin要支持iOS开发和Web开发了！
https://mp.weixin.qq.com/s/yBBAl62tG9qYa39x1uPumA
目前还是实验性的，期待后续改进

What are the Most Disliked Programming Languages?
https://stackoverflow.blog/2017/10/31/disliked-programming-languages/
The most disliked languages, by a fairly large margin, are Perl, Delphi, and VBA. They’re followed by PHP, Objective-C, Coffeescript, and Ruby. On our team we’re certainly happy to see that R is the least disliked programming language, relative to the number of people who liked it.

Announcing Ionic DevApp
http://blog.ionic.io/announcing-ionic-devapp/
DevApp is a 100% free mobile app for iOS and Android that makes it easy to test apps directly on your devices. DevApp offers a realtime view of changes as you’re making them, with a rich library of pre-installed native plugins to test every feature of your app.

Element 2.0 is here
https://medium.com/elemefe/element-2-0-is-here-71bfa217e269
The release of version 2.0 marks a new era for Element, and it also means that the 1.x version goes into maintenance mode. We will continue to support it until December 01, 2017.

React Bits
https://vasanthk.gitbooks.io/react-bits/
A compilation of React Patterns, techniques, tips and tricks.

ReactPWA - Progressive web application with ReactJS
https://www.reactpwa.com/
A highly scalable, Progressive Web Application foundation with the best Developer Experience.

I18n with React and i18next
https://alligator.io/react/i18n-with-react-and-i18next/
i18next is an i18n framework written in and for JavaScript. It provides the standard i18n features of interpolation, formatting, and handling plurals and context.

React Transition Group
https://reactcommunity.org/react-transition-group/
The Transition component lets you describe a transition from one component state to another over time with a simple declarative API. Most commonly it’s used to animate the mounting and unmounting of a component, but can also be used to describe in-place transition states as well.

SVGR
https://github.com/smooth-code/svgr
Transform SVG into React components

Mobx Wiretap
https://wiretap.debuggable.io/
A desktop app for inspecting mobx and mobx state tree apps. 目前还不是很稳定，期待后续改进

Node.js Performance and Highly Scalable Micro-Services
https://www.youtube.com/watch?v=Fbhhc4jtGW4
This session will discuss why Node.js is right for micro-services, introduce the best practices for building scalable deployments, and show you how to monitor and profile your applications to identify and resolve performance bottlenecks.

CaptainDuckDuck
https://github.com/githubsaturn/captainduckduck/
Automated Scalable Ready Webserver Package | In experimental phase

server.js for Node
https://github.com/franciscop/server
Powerful server for Node.js that just works so you can focus on your awesome project.

xmysql
https://github.com/o1lab/xmysql
One command to generate REST APIs for any MySql database. Generating REST APIs for a MySql database which does not follow conventions of frameworks such as rails, django etc is a small adventure that one like to avoid ..

js2flowchart.js
https://github.com/Bogdan-Lyashenko/js-code-to-svg-flowchart
通过 JS 代码生成流程图

Frappé Charts
https://frappe.github.io/charts/
GitHub-inspired simple and modern charts for the web with zero dependencies.

webpack-dashboard
https://github.com/FormidableLabs/webpack-dashboard
A CLI dashboard for your webpack dev server

grid-kiss: Keep CSS Grids simple, stupid
https://github.com/sylvainpolletvillard/postcss-grid-kiss
This is a PostCSS plugin aiming to replace the 24 new properties brought by CSS Grids with a single one that you immediately understand when you see it.

Koa11y
https://open-indy.github.io/Koa11y/
Koa11y is a desktop app that allows you to automatically detect accessibility (a11y) issues on webpages.

Anvil - Drag and Drop Python Web App Builder
https://anvil.works/
Design with our visual designer. Build with nothing but Python. Publish Instant hosting in the cloud or on-site. 7 times faster than traditional tools.

产品及其他

Connect with developers around the world on the GitHub Community Forum
https://github.com/blog/2457-connect-with-developers-around-the-world-on-the-github-community-forum
The open source community proves that when creative people get together on an open platform, great things happen: Code gets better, new technologies emerge, and the way we build software changes. Now there’s a new way to connect with developers around the world. Join the GitHub Community Forum to ask questions, swap stories, and share ideas, regardless of whether you work on public or private projects.

The Web began dying in 2014, here’s how
https://staltz.com/the-web-began-dying-in-2014-heres-how.html
It looks like nothing changed since 2014, but GOOG and FB now have direct influence over 70%+ of internet traffic.

复盘 Go 和 Docker ：他人观望时，如何抢占新技术先机
https://mp.weixin.qq.com/s?__biz=MzA4NTU2MTg3MQ==&mid=2655161775&idx=1&sn=d569ca87c15a938e15279598067e88e2
三年前对 Go 和 Docker 怀疑观望的，可以理解。现在还在持犹豫和不信任态度的，那就不可饶恕了。对于个人和公司，如何在新技术发展初期抢占先机？

“藤壶效应”：“白条粉”是如何干掉“铁丝”的
https://mp.weixin.qq.com/s?__biz=MzI5MjMyNjk2Mg==&mid=2247489034&idx=1&sn=f87ffac295052a83fc91e388dadfeabc
“以客（用）户为中心”、“客户是上帝”之类的说法早已成为普遍的共识。与不少勿庸置疑的共识一样，这些说法细究起来是颇成问题的。热衷于“吸粉”的企业很容易忽略粉丝与粉丝间的巨大差异，很容易在不加分别地“善待客户”中，严重亏待真正为企业创造价值的客户，不知不觉地让企业的经营方向被无效客户牵引到雷区。

谈谈腾讯的技术价值观与技术人才修炼
https://news.cnblogs.com/n/581544
一个技术人员或者专家、工程师最重要的核心素质是业务洞察力、技术视野和原创力，业务洞察力是指技术人员对价值点的识别，技术视野和原创力可以体现在价值输出，就是做出多少东西，解决了多少问题，最终解决方案有没有可借鉴性，有没有可以传递的价值。

[译]谷歌是怎么设计语音界面的？对话设计六原则
http://ued.baidu.com/486
新时代的界面将会突破现有的格局。界面将不再被滑动、轻触和点击局限，取而代之的是更自然细腻的语言呈现形式。用于GUI（图形用户界面）的设计技法和设计语言在语音交互这个全新的领域不再适用，VUI（语音用户界面）设计的新浪潮将基于『对话』- 这个我们最先学会而且最擅长的交流方式。本文给VUI设计师们介绍六项原则，这些原则是日常对话的延展。它们可以辅助设计师完成对话设计，并且引领VUI设计师进入以用户为中心的界面设计新时代。