FEX 技术周刊 - 2018/03/05
微信搜索『FEX』关注我们的公众号，及时获得最新资讯。
深阅读
Announcing Flutter beta 1: Build beautiful native apps
https://developers.googleblog.com/2018/02/announcing-flutter-beta-1.html
Flutter targets the sweet spot of mobile development: performance and platform integrations of native mobile, with high-velocity development and multi-platform reach of portable UI toolkits. 附：如何评价 Google 的 Flutter
Beyond React 16
https://reactjs.org/blog/2018/03/01/sneak-peek-beyond-react-16.html
Dan Abramov from our team just spoke at JSConf Iceland 2018 with a preview of some new features we’ve been working on in React. The talk opens with a question: “With vast differences in computing power and network speed, how do we deliver the best user experience for everyone?” 附：如何评价React的新功能Time Slice 和Suspense.
Pagedraw - Effortlessly turn mockups into functional code
https://pagedraw.io/
Pagedraw is a UI builder that turns mockups into React code. Pagedraw lets you annotate mockups with extra information (like how to connect to the backend, resize for different screens, etc.) to get full, presentational, React Components. They’re React Components just like any others, so they can be interleaved freely with handwritten ones. They don’t require any new dependencies and work well with any existing JSX build system. 附：Launch HN: Pagedraw (YC W18) – Compile UI Mockups to React Code、One of These Site and Page Building Tools is Meant for You.
Tracing from JS to the DOM and back again
https://v8project.blogspot.com/2018/03/tracing-js-dom.html
Debugging memory leaks in Chrome 66 just became much easier. Chrome’s DevTools can now trace and snapshot C++ DOM objects and display all reachable DOM objects from JavaScript with their references. This feature is one of the benefits of the new C++ tracing mechanism of the V8 garbage collector.
The inception of ESLint
https://www.nczonline.net/blog/2018/02/the-inception-of-eslint/
I recently realized that I’d never shared the origin story of ESLint. I’ve shared some of the decisions I made along the way in previous posts but never the initial domino that fell and led to ESLint’s creation. As you will see, ESLint wasn’t created through some divine intervention or stroke of insight, but rather through a series of events that eventually built up to ESLint’s creation.
发布 umi 1.0
https://juejin.im/post/5a93aeadf265da4e6f1805de
umi 是一个类 next.js 的专注性能的前端框架，他的优势是：内置的大量性能优化；多端，无缝支持容器和浏览器访问；类 webpack 的插件机制；针对 antd 和 dva 有友好的支持。
来认识一下Weex 的 JS Framework
https://mp.weixin.qq.com/s?__biz=MzAxNDEwNjk5OQ==&mid=2650401146&idx=1&sn=aa9ea9140b878c4b42be65f464143f40
无论前端框架里数据管理和组件管理的策略是什么样的，它们最终都将调用 JS Framework 提供的接口来调用原生功能并且渲染真实 UI。底层渲染引擎中也不必关心上层框架中组件化的语法和更新策略是怎样的，只需要处理 JS Framework 中统一定义的节点结构和渲染指令。多了这么一层抽象，有利于标准的统一，也使得跨框架和跨平台成为了可能。
RIP Redux: Dan Abramov announces future fetcher API
https://react-etc.net/entry/rip-redux-dan-abramov-announces-future-fetcher
Unlike Redux Future Fetcher is not a new library, but rather a new concept that is being rolled into React in the form of the Context API that will simply render a lot of the tasks done by Redux obsolete.
Redesigning Redux
https://hackernoon.com/redesigning-redux-b2baee8b8a38
Shouldn’t state management be a solved problem by now? Intuitively, developers seem to know a hidden truth: state management seems harder than it needs to be. In this article, we’ll try to answer some questions you’ve probably been asking yourself: Do you really need a library for state management? Is the popularity of Redux deserved? Why or why not? Could we make a better state management solution? If so, how?
The Lost Art of the Makefile
http://www.olioapps.com/blog/the-lost-art-of-the-makefile/
My guess is that a large portion of the Javascript community did not come from a background of Unix programming, and never had a good opportunity to learn what Make is capable of. I want to provide a quick primer here; I will go over the contents of the Makefile that I use with my own Javascript projects.
What Google AMP means for the JavaScript community
https://molily.de/amp/
What is clear to me is that the JavaScript community needs to sweep in front of its own door. It needs to criticize AMP but also learn from AMP. The broad web community needs to adapt technical principles that improve performance. But instead of following a centralized, authoritarian approach, we need to fix the web in a concerted community effort.
How GDPR Will Change The Way You Develop
https://www.smashingmagazine.com/2018/02/gdpr-for-web-developers/
In this article, we’ll explore what you, as a developer, need to know about the new data protection regime. At the end, you’ll understand how the challenges posed by the privacy overhaul will ultimately help to make you a better developer. 附：GDPR – A PRACTICAL GUIDE FOR DEVELOPERS
How I Learned to Stop Worrying and ❤️ the State Machine
http://raganwald.com/2018/02/23/forde.html
By recognizing when domain models should be represented first and foremost as state machines–or recognizing when to refactor domain models into state machines–we keep our models understandable and workable. We tame their complexity. So, what are state machines? And how do they help?
When to use CQRS?!
https://community.risingstack.com/when-to-use-cqrs/
One of the simplest and most frequently cited explanations is that CQRS is in principle the same as the design pattern CQS, applied to the architectural level of an application. This comparison is quite correct, but for someone who is not yet familiar with CQRS, it is difficult to understand and therefore hardly helpful.
Mobile Real-time Video Segmentation
https://research.googleblog.com/2018/03/mobile-real-time-video-segmentation.html
We are excited to bring precise, real-time, on-device mobile video segmentation to the YouTube app by integrating this technology into stories. Currently in limited beta, stories is YouTube’s new lightweight video format, designed specifically for YouTube creators. Our new segmentation technology allows creators to replace and modify the background, effortlessly increasing videos’ production value without specialized equipment.
Queryparser, an Open Source Tool for Parsing and Analyzing SQL
https://eng.uber.com/queryparser/
In this article, we discuss our implementation of Queryparser, the variety of applications it unlocked, and some problems and limitations encountered along the way.
Air Traffic Controller: Member-First Notifications at LinkedIn
https://engineering.linkedin.com/blog/2018/03/air-traffic-controller–member-first-notifications-at-linkedin
This platform became Air Traffic Controller (ATC)—the ultimate decision maker for notifications sent to our members. In this post, we’ll discuss why ATC is important to LinkedIn, the technology ATC is built on, the ATC platform, and features, as well as the challenges and lessons learned building a scalable and high throughput platform.
The Evolution of Data at Reddit
https://redditblog.com/2018/02/28/the-evolution-of-data-at-reddit/
This post is the first installment of a three-part mini-series on data architecture at Reddit, starting with Reddit’s data “origin story” and finishing with our present-day practices.
Microservices: It’s All About the Events
https://thenewstack.io/microservices-its-all-about-the-events/
The idea of Microservices is to break large monolithic apps into smaller sets of coordinating services, so each service can be replaced or scaled up, without the heavy lifting of changing the entire monolith. Event-driven design is a way of extending applications without modifying them, Richardson explained.
A Practical Introduction to Container Terminology
https://developers.redhat.com/blog/2018/02/22/container-terminology-practical-introduction/
Without a good handle on the terminology, It can be difficult to grasp the key differences between docker and (pick your favorites, CRI-O, rkt, lxc/lxd) or understand what the Open Container Initiative is doing to standardize container technology.
WebAssembly architecture for Go
https://docs.google.com/document/d/131vjr4DH6JFnb-blm_uRdaC0_Nv3OUwjEY5qVCxCup4/preview#heading=h.mjo1bish3xni
This documents describes the design decisions that went into the new WebAssembly architecture (short “wasm”) for the Go compiler. The goal is to upstream it to the official Go repository in the current development cycle, targeting Go 1.11. The WebAssembly architecture will allow Go to become an alternative to JavaScript for writing code that runs in a web browser. This new freedom of choice will hopefully have a positive impact on the software engineering ecosystem overall.
另附：WebAssembly: What and What Next、Go 2017 Survey Results.
Third party CSS is not safe
https://jakearchibald.com/2018/third-party-css-is-not-safe/
Third party content has a high impact within its sandbox. An image or a sandboxed iframe has a pretty small sandbox, but script & style are scoped to your page, or even the whole origin. If you’re worried about users tricking your site into loading third party resources, you can use CSP as a safety net, to limit where images, scripts and styles can be fetched from.
Modern Layouts with CSS Grid: Revolutionizing Visual Design on the Web
https://www.youtube.com/watch?v=ahPRvVyw9Eo
A look at new CSS tools and new possibilities in web design, with Singapore-based Hui Jing Chen, who brings a bilingual perspective to building beautiful useful web sites. (A Mozilla Tech Briefing.)
V6: Color
http://v6.robweychert.com/blog/2018/02/v6-color/
A new approach to one of my biggest design weaknesses, using basic color theory, HSL, and Sass.
Prototyping inside Sketch 49 — Learn how it works and what you can do
https://medium.com/sketch-app-sources/prototyping-inside-sketch-49-how-it-works-and-what-you-can-do-7a48c829f282
Sketch 49 brings home one of the most anticipated and desired features — the ability to create and share quick interactive prototypes natively.
How Do You See The Future of UX Design?
https://uxplanet.org/how-do-you-see-the-future-of-ux-design-8654c62c3279
Learn from twenty experienced designers as we go deep into one question every week. 另附：Design Language System
版本控制工具 Abstract 是如何提升设计团队协作效率的
http://www.uisdc.com/abstract-improve-collaboration-efficiency
Abstract 是基于 Git 的。如果你已经用过 GitHub 等工具，可能不会对 commit、branch、merge 这些概念感到陌生。不过，如果你是第一次使用版本控制工具的设计师，也不必担心。毕竟 Abstract 是为设计师和设计团队打造的版本控制工具，你只需要学会使用 Abstract 的客户端界面就够了。
新鲜货
Google 机器学习速成课程
https://developers.google.com/machine-learning/crash-course/
谷歌上线人工智能学习网站Learn with Google AI，网站设有一门名为机器学习速成班（Machine Learning Crash Course，MLCC）的免费课程。该课程基于谷歌内部课程，最初旨在帮助谷歌员工对AI和机器学习基础知识进行介绍。现在，MLCC将面向所有人开放，而且有中文版网站！
February 28th DDoS Incident Report
https://githubengineering.com/ddos-incident-report/
On Wednesday, February 28, 2018 GitHub.com was unavailable from 17:21 to 17:26 UTC and intermittently unavailable from 17:26 to 17:30 UTC due to a distributed denial-of-service (DDoS) attack. 附：In-the-wild DDoSes use new way to achieve unthinkable sizes、Memcrashed - Major amplification attacks from UDP port 11211.
GitHub Desktop 1.1 is now available
https://blog.github.com/2018-02-26-github-desktop-1-1-is-now-available/
A fresh release of our Electron app is ready for your desktop. GitHub Desktop 1.1 builds on last year’s Electron relaunch with new features and enhancements that help you bring even more GitHub workflows to your desktop.
Spring Boot 2.0 goes GA
https://spring.io/blog/2018/03/01/spring-boot-2-0-goes-ga
Highlights of the new release include: A Java 8 baseline, and Java 9 support; Reactive web programming support with Spring WebFlux/WebFlux.fn; Auto-configuration and starter POMs for reactive Spring Data Cassandra, MongoDB, Couchbase and Redis…
WOFF File Format 2.0
https://www.w3.org/TR/2018/REC-WOFF2-20180301/
Based on experience with WOFF 1.0, which is widely deployed, this specification was developed to provide improved compression and thus lower use of network bandwidth, while still allowing fast decompression even on mobile devices. This is achieved by combining a content-aware preprocessing step and improved entropy coding, compared to the Flate compression used in WOFF 1.0.
Announcing Capacitor 1.0.0 Alpha
https://blog.ionicframework.com/announcing-capacitor-1-0-0-alpha/
Capacitor aims to build a better Native runtime for the future of Ionic apps running everywhere: iOS, Android, Electron, and on the web as a Progressive Web App. Capacitor offers a consistent API that handles operations on the underlying platform in a portable, cross-platform way. That means one app built with Capacitor will work no matter where it runs.
A free, 20-page zine about making web apps with Node.js.
https://glitch.com/you-got-this
In this issue: - Making Web Apps with Node; - Paths into Programming; - Top Tips for New Coders.
Pandora.js
http://www.midwayjs.org/pandora/en/
A Manageable, Measurable and Traceable Node.js Application Manager represented by Alibaba powered by TypeScript
Propel
http://propelml.org/
Differential Programming in JavaScript. Propel provides a GPU-backed numpy-like infrastructure for scientific computing in JavaScript. JavaScript is a fast, dynamic language which, we think, could act as an ideal workflow for scientific programmers of all sorts. Propel runs both in the browser and natively from Node. In both environments Propel is able to use GPU hardware for computations. In the browser it utilizes WebGL through deeplearn.js and on Node it uses TensorFlow’s C API.
腾讯高性能的图片框架 LKImageKit 正式开源
http://www.oschina.net/news/93731/tencent-open-source-lkimagekit
LKImageKit 是一个高性能的图片框架，包括了图片控件，图片下载、内存缓存、磁盘缓存、图片解码、图片处理等一系列能力。合理的架构和线程模型，并特别针对不同场景进行优化，能充分发挥硬件的性能。该框架具有高度的扩展性。在此框架下，开发者可以自定义图片框架中的任何一个部分，比如：自定义图片显示逻辑、自定义缓存、自定义下载组件、自定义解码器、自定义图片处理算法等等。该组件旨在提供 iOS 平台上使用最简单，功能最强大的高性能图片解决方案。
阿里巴巴 Android 开发手册
https://mp.weixin.qq.com/s?__biz=MzA4NTQwNDcyMA==&mid=2650664124&idx=1&sn=9f16d5ba9042fef7479c47e32d0e0da9
本手册以开发者为中心视角分为Java语言规范（遵循《阿里巴巴Java开发手册》），Android资源文件命名与使用，Android基本组件，UI与布局，进程、线程与消息通信，文件与数据库，Bitmap、Drawable与动画，安全以及其他等九大部分。
G3D - A pure WebGL-compatible 3D render engine
https://alibaba.github.io/G3D/
G3D is a javascript 3D engine based on WebGL. Compared with other WebGL 3D engines, G3D is a pure render engine, which means it depends on no DOM APIs but just a canvas(or canvas-like) object. This feature makes it possible that G3D works not only in browser but also in some hybrid environments like GCanvas (Weex or ReactNative). 另附阿里随这个库一起发布的库：GCanvas、Bind actions to effects.
Konva.js
https://konvajs.github.io/
HTML5 2d canvas library for desktop and mobile applications.
React Hot Loader V4.0
https://github.com/gaearon/react-hot-loader
Tweak React components in real time.
Redux Box
https://github.com/anish000kumar/redux-box
Modular and easy-to-grasp redux based state management, with least boilerplate.
React Morph
https://github.com/brunnolou/react-morph
Morphing UI transitions made simple.
Announcing SMP: Speeding Up webpack With Timers
https://codeburst.io/announcing-smp-speeding-up-webpack-with-timers-8387d769e5c7
Measure the speed of your webpack loaders and plugins
Tippy.js
https://atomiks.github.io/tippyjs/
A lightweight, vanilla JavaScript tooltip library
basicScroll
https://github.com/electerious/basicScroll
Standalone parallax scrolling for mobile and desktop with CSS variables. basicScroll allows you to change CSS variables depending on the scroll position. Use the variables directly in your CSS to animate whatever you want.
30 Seconds of CSS
https://github.com/atomiks/30-seconds-of-css
A curated collection of useful CSS snippets you can understand in 30 seconds or less. Inspired by 30 seconds of code.
Prepack
https://github.com/facebook/prepack
Prepack is a partial evaluator for JavaScript. Prepack rewrites a JavaScript bundle, resulting in JavaScript code that executes more efficiently. For initialization-heavy code, Prepack works best in an environment where JavaScript parsing is effectively cached.
Docusaurus
https://docusaurus.io/
Easy to Maintain Open Source Documentation Websites.
Pythonic HTML Parsing for Humans
https://github.com/kennethreitz/requests-html
This library intends to make parsing HTML (e.g. scraping the web) as simple and intuitive as possible. When using this library you automatically get: Full JavaScript support! CSS Selectors (a.k.a jQuery-style, thanks to PyQuery). XPath Selectors, for the faint at heart. Mocked user-agent (like a real web browser). Automatic following of redirects. Connection–pooling and cookie persistence. The Requests experience you know and love, with magical parsing abilities.
Launching the Front-End Tooling Survey 2018
https://medium.freecodecamp.org/launching-the-front-end-tooling-survey-2018-927bf975fdf0
The Front-End Tooling Survey is back to gather input and shed some light on the tooling habits across the web development industry.
产品及其它
谈谈“五级工程师和职业发展”的思考 https://liudanking.com/beautiful-life/five-level-engineer-and-career/ 著名前苏联物理学家朗道曾经给出过一个五级物理学家的划分，吴军老师在此基础上，给出了“五级工程师”的划分：第五级：能独立解决问题，完成工程工作；第四级：能指导和带领其他人一同完成更有影响力的工作；第三级：能独立设计和实现产品，并且在市场上获得成功；第二级：能设计和实现别人不能做出的产品，也就是说他的作用很难取代；第一级：开创一个产业。
Dtube – A decentralized video platform using STEEM and IPFS
https://d.tube/
D.Tube is the first crypto-decentralized video platform, built on top of the STEEM Blockchain and the IPFS peer-to-peer network.
GitLab’s 2018 Product Vision: Prototype demo
https://about.gitlab.com/2018/02/26/gitlabs-2018-product-vision/
wrapping it up: We’re going after the complete DevOps lifecycle, we want Operations and Security to be our new favorite users, and we want teams working concurrently. And that’s the GitLab Product Vision for 2018!
憋着一个音乐家的梦？Google 的这款零门槛工具帮你圆
http://www.geekpark.net/news/226963
每个人都能通过简单的点击创作一段动听的音乐。
