FEX 技术周刊 - 2018/05/14

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

业界大会

Microsoft Build & Google IO
https://developer.microsoft.com/en-us/events/build
https://events.google.com/io/
两大盛会，可以看看围观下高科技。 IO：在 Google 刚发布的黑科技背后，还有些更重要的东西、Google I/O 2018有哪些亮点、Build the future of the web with modern JavaScript、Google I/O Developer Roundup: What’s New?、The State of the Web at Google I/O 2018、Tech’s Two Philosophies Build: 微软 Build 大会回顾、Microsoft’s Project Ink Analysis lets developers add handwriting recognition to their apps、Azure Machine Learning, JavaScript Custom Functions, and Power BI Custom Visuals Further Expand Developers Capabilities with Excel、Microsoft 365 and the Future of App Development

深阅读

Introducing Guess.js - a toolkit for enabling data-driven user-experiences on the Web
https://blog.mgechev.com/2018/05/09/introducing-guess-js-data-driven-user-experiences-web/
Guess.js is a collection of libraries & tools for enabling data-driven user-experience on the web. With Guess.js we want to explore the application of data-analytics driven approach to user experience in: Single-page applications, Framework-based static sites, Static content sites, Enterprise sites.

The Economics of Writing a Technical Book
https://medium.com/@rothgar/the-economics-of-writing-a-technical-book-689d0c12fe39
I am not an expert. I have co-authored a single book in 2017 called Cloud Native Infrastructure for O’Reilly Media. Many people have asked me what it was like so I will attempt to explain the process, time investment, and financial incentive here. This was my experience. If you have written a book, or would like to, I promise your experience will be different. Nonetheless, I hope you can learn something from the things I learned.

Welcome to the immersive web
https://developers.google.com/web/updates/2018/05/welcome-to-immersive
The immersive web means virtual world experiences hosted through the browser. This covers entire virtual reality (VR) experiences surfaced in the browser or in VR enabled headsets like Google’s Daydream, Oculus Rift, Samsung Gear VR, HTC Vive, and Windows Mixed Reality Headsets, as well as augmented reality experiences developed for AR-enabled mobile devices.

Why Flutter Will Change Mobile Development for the Best
https://proandroiddev.com/why-flutter-will-change-mobile-development-for-the-best-c249f71fa63c
If you’re an Android developer, you may have heard of Flutter. It’s a relatively new, supposedly simple framework designed for making cross-platform native apps. It’s not the first of its kind, but it’s being used by Google, giving its claims some credence. Despite my initial reservations upon hearing about it, I decided on a whim to give it a chance — and it dramatically changed my outlook on mobile development within a weekend. Here is what I learned. 附：Building a mobile frontend for a Go application using Flutter

Supporting React Native at Pinterest
https://medium.com/@Pinterest_Engineering/supporting-react-native-at-pinterest-f8c2233f90e6
Early last year, a small group of engineers started investigating the possibility of adopting React Native at Pinterest. We’ve been following the ecosystem with interest since it was first open-sourced in 2015. Since then, a robust community has developed around it, and it’s been integrated by companies across the industry. We decided to take a serious look at what the business case is for using this technology at Pinterest.

React Context API — A Replacement for Redux?
https://blog.bitsrc.io/react-context-api-a-replacement-for-redux-6e20790492b3
Convert a React App that uses Redux for State Management to use React’s New Context API

my struggle to learn react
http://bradfrost.com/blog/post/my-struggle-to-learn-react/
I’m going to be honest: I’ve had a hell of a time getting my head around React. More than any other technology I’ve touched over the last 10 years of my career, I just haven’t had it click for me. It’s very frustrating as I really want to learn it, and it’s clear the library has legs. 附：A response “my Struggle to learn react”

前端工程师的技术进阶点在哪里?
https://mp.weixin.qq.com/s?__biz=MzAxMTU0NTc4Nw==&mid=2661157671&idx=1&sn=b400eb2ad196fc1ac97bbdbe92ceebe2
前端不该只写页面，node也只是基本技能，最重要的一点，技术要驱动商业，否则没有任何价值。你是一个工程师，征途是星辰大海，何苦给自己设限？

精读《async/await 是把双刃剑》
https://zhuanlan.zhihu.com/p/36521539
终于，async/await 也被吐槽了。Aditya Agarwal 认为 async/await 语法让我们陷入了新的麻烦之中。

老树发新芽—使用 mobx 加速你的 AngularJS 应用
https://github.com/kuitos/kuitos.github.io/issues/38
对于老项目还是有用的

New CSS Features That Are Changing Web Design
https://www.smashingmagazine.com/2018/05/future-of-web-design/
The design landscape has changed completely. We’re equipped with new and powerful tools — CSS Grid, CSS custom properties, CSS shapes and CSS writing-mode, to name a few — that we can use to exercise our creativity.

Google YOLO clickjacking
http://www.daemonology.net/hn-daily/2018-05-11.html
YOLO (You Only Login Once) is a web widget for “One-tap sign-up and auto sign-in on websites” by Google. You embed Google provided iframe on your websites and your users can authenticate with their Google account in one simple click. Ironically, “web widgets” and “one click” is indeed YOLO (You Only Live Once). Remember the cookie consent button you clicked at the very beginning? That’s right, it was a Clickjacking attempt :).

npm audit: identify and fix insecure dependencies
https://blog.npmjs.org/post/173719309445/npm-audit-identify-and-fix-insecure
npm audit is a new command that performs a moment-in-time security review of your project’s dependency tree. Audit reports contain information about security vulnerabilities in your dependencies and can help you fix a vulnerability by providing simple-to-run npm commands and recommendations for further troubleshooting.

Server side architecture with Node and Typescript using Nest
https://samueleresca.net/2018/02/server-side-architecture-with-node-and-typescript-with-nest/
The modularity may become a problem when you want to follow an specific architecture or patterns. That kind of problem raise when you are involved on large-scale projects with distributed teams. Well, I have found the solution in Nest, which provide out-of-box a server side architecture with Node and Typescript.

The Various Kinds of IO - Blocking, Non-blocking, Multiplexed and Async
https://www.rubberducking.com/2018/05/the-various-kinds-of-io-blocking-non.html
I’ve found it was particularly hard to demystify the various kinds of IO that are now offered to software programmers. There is a lot of confusion out there about what are the differences between blocking, non-blocking, multiplexed and async IO. So I thought I’d give a shot at clarifying what each of these kind of IO entails.

SRE vs. DevOps: competing standards or close friends?
https://cloudplatform.googleblog.com/2018/05/SRE-vs-DevOps-competing-standards-or-close-friends.html
Site Reliability Engineering (SRE) and DevOps are two trending disciplines with quite a bit of overlap. In the past, some have called SRE a competing set of practices to DevOps. But we think they’re not so different after all.

Google Duplex: An AI System for Accomplishing Real-World Tasks Over the Phone
https://ai.googleblog.com/2018/05/duplex-ai-system-for-natural-conversation.html
A new technology for conducting natural conversations to carry out “real world” tasks over the phone. The technology is directed towards completing specific tasks, such as scheduling certain types of appointments. For such tasks, the system makes the conversational experience as natural as possible, allowing people to speak normally, like they would to another person, without having to adapt to a machine.

新鲜货

Netflix Research Website
https://research.netflix.com/
We’re pleased to announce that we’ve launched a new website at research.netflix.com that provides an overview of the research that we do here at Netflix. We have many amazing researchers working on a variety of hard problems and are happy to share some of our work with the world.

Introducing the Checks API, a better way to connect integrations and code
https://blog.github.com/2018-05-07-introducing-checks-api/
he Checks API allows you to build sophisticated tools for continuous integration (CI), linting, and acceptance testing on GitHub. 附：Announcing support for the GitHub Checks API on travis-ci.com

Firefox 60
https://www.mozilla.org/en-US/firefox/60.0/releasenotes/
Firefox 60 offers something for everyone and a little something extra for everyone who deploys Firefox in an enterprise environment. Linux sandboxing improvements in Firefox 60、Firefox 60 – Modules and More

How You Can Start Contributing to Node.js Today
https://nodesource.com/blog/how-you-can-start-contributing-to-node-js-today
Contributing To MDN Web Docs

Material-UI
https://github.com/mui-org/material-ui
React components that implement Google’s Material Design.

Selection
https://github.com/Simonwep/selection
A simple and lightweight library to realize visual DOM Selections. No jQuery. Supports any CSS library

WarriorJS
https://github.com/olistic/warriorjs
In WarriorJS, you wear the skin of a warrior climbing a tall tower to reach The JavaScript Sword at the top level. Legend has it that the sword bearer becomes enlightened in the JavaScript language, but be warned: the journey will not be easy. On each floor, you need to write JavaScript to instruct the warrior to battle enemies, rescue captives, and reach the stairs alive…

ReactStateMuseum
https://github.com/GantMan/ReactStateMuseum
A whirlwind tour of React state management systems by example

React Reduction
https://github.com/reduction-admin/react-reduction
Free Admin Template Built with React and Bootstrap4

Impact
https://github.com/phoboslab/Impact
Impact is an HTML5 Game Engine.

RadonDB
https://github.com/radondb/radon
RadonDB is an open source, Cloud-native MySQL database for unlimited scalability and performance.

Ultradom
https://github.com/jorgebucaran/ultradom
Ultradom is a minimal view layer for building declarative web user interfaces. What’s in the bundle? A virtual DOM diff engine, keyed-based node reconciliation, element-level lifecycle events and browser support all the way back to IE9. Mix it with your favorite state management library or use it standalone for maximum flexibility.

List
https://github.com/funkia/list
List is a purely functional alternative to arrays. It is an implementation of a fast persistent sequence data structure. Compared to JavaScript’s Array List has three major benefits.

Learn Enough JavaScript to Be Dangerous
https://www.learnenough.com/javascript-tutorial
Learn how to use JavaScript as a general-purpose programming language

flamebearer
https://github.com/mapbox/flamebearer
A blazing fast flame graph tool for Node and V8. Used to visualize and explore performance profiling results. Designed to produce fast, lightweight flame graphs that remain responsive even on really big input.

SpreadJS 纯前端表格控件V11.1
http://www.iteye.com/news/33000
Spread 是一系列功能和Excel类似的表格工具，支持桌面、Web和移动平台开发，用于在您的应用系统中实现Excel导入导出、表格数据录入和编辑等交互功能，并提供灵活的定制能力和丰富的数据可视化效果。Spread 在功能和布局上与Excel高度相似，全系列包括适用于前端平台SpreadJS，.NET平台的Spread Studio，以及通过代码即可在应用程序中批量操作Excel的Spread表格组建，适应不同开发场景的需求。

YApi
http://yapi.demo.qunar.com/
高效、易用、功能强大的可视化接口管理平台，旨在为开发、产品、测试人员提供更优雅的接口管理服务。

isomorphic-git
https://github.com/isomorphic-git/isomorphic-git
A pure JavaScript implementation of git for node and browsers! 另附：GitHub Contribution Chart Generator

You can now run Linux apps on Chrome OS
https://techcrunch.com/2018/05/08/you-can-now-run-linux-apps-on-chrome-os/
Soon, if you want to run Linux apps on your Chrome OS machine, all you’ll have to do is switch a toggle in the Settings menu. That’s because Google is going to start shipping Chrome OS with a custom virtual machine that runs Debian Stretch, the current stable version of the operating system.

Announcing glom: Restructured Data for Python
https://sedimental.org/glom_restructured_data.html
This post introduces glom, Python’s missing operator for nested objects and data. 另附：Pyre: Fast Type Checking for Python.

设计

What’s new in Material Design?
https://uxplanet.org/whats-new-in-material-design-5308f62a4082
Google wants Material Design to be much more than just another Visual language. Google is building tools to improve our design-development workflow! Here are the big announcement made in this year’s Google I/O: Material Theming, Gallery.

Top UX Inspirations of all time!
https://medium.com/sketch-app-sources/top-ui-inspirations-of-all-time-90cb37c61c45
Good UI design facilitates making the completion of tasks as frictionless as possible and increasing usability. Good design is like a refrigerator — when it works, no one notices, but when it doesn’t, it sure stinks.

40 Brutally Honest Logos Of Famous Companies
https://theultralinx.com/2018/05/40-brutally-honest-logos-of-famous-companies/
另附：Designer Creates 50 Logos From Strangers’ Requests In 32 Hours

Fonts for Complex Data
https://www.typography.com/blog/fonts-for-complex-data
Retail displays, packaged goods, financial reports and apps all present readers with a dizzying array of data. Here are a few ways to make quick work of their long lists, tiny annotations, and mighty stacks of numbers.

UX Design Glossary: How to Use Affordances in User Interfaces
https://uxplanet.org/ux-design-glossary-how-to-use-affordances-in-user-interfaces-393c8e9686e4
Affordance is a property or feature of an object which presents a prompt on what can be done with this object. In short, affordances are cues which give a hint how users may interact with something, no matter physical or digital. For example, when you see a door handle, it is a prompt you can use it to open the door. When you see a receiver icon, it gives you a hint you may click it to make a call. Affordances make our life easier as they support our successful interactions with the world of physical things and virtual objects.

How LEGO Run Design Sprints at Scale
https://uxplanet.org/how-lego-run-design-sprints-at-scale-47bf56b785f7
LEGO are one of the first companies that I have seen implementing Design Sprints, at scale, across their organisation, which is kind of unbelievable considering that they are a company that produces physical products, not just digital ones.

产品及其它

Tech’s Two Philosophies
https://stratechery.com/2018/techs-two-philosophies/
Tech’s Yin and Yang. That there are two philosophies does not necessarily mean that one is right and one is wrong: the reality is we need both. Some problems are best solved by human ingenuity, enabled by the likes of Microsoft and Apple; others by collective action. That, though, gets at why Google and Facebook are fundamentally more dangerous: collective action is traditionally the domain of governments, the best form of which is bounded by the popular will. Google and Facebook, on the other hand, are accountable to no one. Both deserve all of the recent scrutiny they have attracted, and arguably deserve more.

From extraction to empowerment: a better future for data for development
https://webfoundation.org/2018/05/from-extraction-to-empowerment-a-better-future-for-data-for-development/
During Open Government Week we’ve been thinking about what needs to be done to put citizens at the center of data initiatives in a way that gives them meaningful influence in the decisions that affect their daily lives.

同理心：个人、产品及组织的永恒竞争力
https://mp.weixin.qq.com/s?__biz=MzI5MjMyNjk2Mg==&mid=2247489179&idx=1&sn=d0adfa38e9e952f3e9c3b336bdf75e85
过去，我们习惯于将科学分为自然科学与社会科学，这是工业时代思维的产物。随着智能时代的来临，界限明确的学科分类方式引发了诸多的问题。智能产品已经不再是单纯的技术产物，它要求与用户产生良好的互动，而不再是执行人们给出的命令。如果一个产品设计人员没有很好的同理心，他就无法设计出一款有竞争力的好产品。

雷军：我这十年来的思考
https://mp.weixin.qq.com/s/S5SMQUyYT3Ln45sXb6MQqQ
那些成功做出独角兽企业的创业者，这类的人大多都是天生的，他们非常清楚自己想要什么，可以为了等这个机会，默默付出别人难以想象的代价，最后就只是为了这一仗。

警惕停留在优秀的诱惑，这是卓越最大的敌人
https://mp.weixin.qq.com/s?__biz=MzI0NzY3Mjc0Mw==&mid=2247484724&idx=1&sn=5c2417a28ca950f3bdc695aac4a3a4fe
在创业的过程中，很多公司容易滑入优秀的“陷阱”中，去实现那些清晰目标，获得成就的快感，然而在这些成功中投入努力、获得认可，你可能离一家卓越的公司越来越远。追求卓越充满了挫败，但这个过程本身就会让你和企业无法替代。

– THE END –