FEX 技术周刊 - 2019/07/08

深阅读

Emscripten and the LLVM WebAssembly backend
https://v8.dev/blog/emscripten-llvm-wasm
WebAssembly is normally compiled from a source language, which means that developers need tools to use it. Because of that, the V8 team works on relevant open-source projects like LLVM, Emscripten, Binaryen, and WABT. This post describes some of the work we’ve been doing on Emscripten and LLVM, which will soon allow Emscripten to switch to the LLVM WebAssembly backend by default — please test it and report any issues!

A Look at JavaScript’s Future
https://www.toptal.com/javascript/predicting-javascript-future
These are exciting times in the JavaScript world—a lot of technologies have matured enough to leave space for innovation, the active community never stopped to amaze us with their brilliant and incredible ideas, and we expect a lot of new alternatives to well-established tools since their mature stages are arriving quickly; we won’t stop using them since a lot of them are really good and there is plenty of proof in the battlefield, but new and exciting markets will start to emerge, and you’d better be prepared.

Announcing React Native 0.60
https://facebook.github.io/react-native/blog/2019/07/03/version-60
This release handles significant migrations for both Android and iOS platforms, and many issues are resolved too. This blog post covers the highlights of the release. As always though, refer to the changelog for more detailed information. Finally, thank you contributors for helping us to make this milestone!

前端开发编程语言的过去、现在和未来
https://johnhax.net/2019/fe-lang/article1
编程语言，以我的看法，不太可能是项目成败的决定性的因素。但是长期来看，编程语言，作为程序员创造软件的核心工具，会影响团队长期的生产力。这是我们为什么应该摒弃那些极端态度，投入一定的精力去研究和发展编程语言。

绕过技术纷争，哪些技术决定前端开发者的未来？
https://mp.weixin.qq.com/s?__biz=MzUxMzcxMzE5Ng==&mid=2247491704&idx=1&sn=95ad66f7fe606801cdac74e296a41783
2019 年下半年即将到来，上半年狂风骤雨般的裁员浪潮让每一位从业者背脊发凉，在经历了五六年黄金发展期之后，前端开发这个行业似乎也进入了转折点。我一边听开发者在网络上抱怨工作难找，前端开发早已经饱和了，又在另一边听大厂的朋友们抱怨，招了很久的人，四处出击却填不满 HC，前端人才市场就是这么充满了矛盾与反常。所以进阶是大部分前端开发必须要面对的事情，现在已经不是能写几个页面就能找到工作的时代了，只有往上进阶才能保持职业竞争力，否则我们谁都不能保证下次裁员潮来临的时候，我们会不会成为沙滩上裸泳的人。

NumPy手写全部主流机器学习模型，代码超3万行
https://mp.weixin.qq.com/s?__biz=MzA3MzI4MjgzMw==&mid=2650765320&idx=1&sn=bc0d14565dfa81c18df218f63303442c
尽管目前使用 NumPy 写模型已经不是主流，但这种方式依然不失为是理解底层架构和深度学习原理的好方法。最近，来自普林斯顿的一位博士后将 NumPy 实现的所有机器学习模型全部开源，并提供了相应的论文和一些实现的测试效果。项目地址：https://github.com/ddbourgin/numpy-ml。

Why Did I Have Difficulty Learning React?
https://snook.ca/archives/javascript/difficulty-with-react
Just over six months into a job doing React development, I’ve been trying to figure out why it has taken me so long to feel comfortable with it. (Comfortable feels a bit too ambitious of a word. Maybe competent? Unexceptional? Whichever.) For me, I think it has come down to four different things: All the Technologies, Writing JS differently, Deep Hierarchies, Evolving Approaches.

Rethinking Focus
https://github.com/facebook/react/issues/16009
Focusing on the DOM is a mess today. We couple ideas around ideas around things like tabIndex and whether a specific browser treats something as focusable. This is very much a hard-coded disaster where no one really agrees on a good formula for success. Not to mention, that this just doesn’t translate well for a declarative UI. How does one tab to a specific node that isn’t focusable? How does one use keyboard arrows to navigate a table using keyboard arrows? I think we need to rethink how focus works in React. React Flare is the perfection opportunity to allow us to do this, so here are some of my thoughts.

CSS Custom Properties In The Cascade
https://www.smashingmagazine.com/2019/07/css-custom-properties-cascade/
In this article, Miriam takes a deeper dive into the ‘CSS Custom Properties for Cascading Variables’ specification to ask, “Why are they called custom properties, how do they work in the cascade, and what else can we do with them?” Pushing past the “variable” metaphor, custom properties can provide new ways to balance context and isolation in CSS patterns and components.

CSS Architecture for Multiple Websites
https://medium.com/@elad/css-architecture-for-multiple-websites-ad696c9d334
Complex CSS architecture is not something you learn in any formal institution. My fourth job in the web industry was as a CSS/HTML expert, in one of the leading media news companies in my country, and my primary mission was to write reusable and scalable CSS for multiple websites. In this post, I will share with you the knowledge and experience I gained in this field of constructing a multiple website architecture.

Top tips for web performance
https://web.dev/use-srcset-to-automatically-choose-the-right-image
Use srcset to automatically choose the right image size.

GraphQL: The Documentary (Official Release)
https://www.youtube.com/watch?v=783ccP__No8
Starring Lee Byron, Dan Schafer and Nick Schrock (co-creators of GraphQL) and other big names from the #GraphQL community, “GraphQL: The Documentary” explores the story of why and how GraphQL came to be and the impact it’s having on big #tech companies worldwide, including Facebook, Twitter, Airbnb and Github. 另附：Hello, OpenAPI-to-GraphQL 1.0.0.

Scaling from 2,000 to 25,000 engineers on GitHub at Microsoft
https://jeffwilcox.blog/2019/06/scaling-25k/
In this post, I will cover: Core principles the Open Source Programs Office uses to guide the open source and GitHub experience; Technical investments we have made to scale GitHub; Program investments; Key learnings; Looking to the future; Resources including the open source projects mentioned in this post.

The Agile Manifesto: A Software Architect’s Perspective
https://www.infoq.com/articles/architect-agile-manifesto/
The Agile Manifesto values are not binaries. It is not only “working software”, “individuals and interactions”, “responding to change” or “customer collaboration”, but rather a scale that an architect, in collaboration with other roles within the team, needs to properly adjust, whether more to the left or right, depending on stakeholders concerns, the development organization, the technical environment, and his expertise.

The Programmer Mindset: Main Debug Loop
https://blogs.dropbox.com/tech/2019/07/the-programmer-mindset-main-debug-loop/
Validating ONLY with tests is basically flying the plane on instrumentation, versus being able to look out the windshield. Flying visually and by muscle-memory is both more efficient and safer, in conjunction with instrumentation. You’re much less likely to hit a mountain by mistake.

Choose Boring Technology
http://boringtechnology.club/
An easy to digest Web version of a popular talk that tries to make the argument that you should focus on a core selection of flexible tools (e.g. PostgreSQL for your database, one programming language like Python..) rather than dividing up your attention learning and using new tools, even if they’re a better fit. Controversial but interesting.

CDNs Should Work Like Databases
https://www.macrometa.co/blog/cdns-should-work-like-databases
CDNs leverage a whole stack of technologies to quickly deliver content resources to users by simply replicating static data all over the globe, so that a user’s requests never have to travel far. In parlance of dev ops teams, this is a “multi-region deployment.” But despite being geographically distributed, CDN replication is relatively straightforward i.e., they simply distribute a file to an increasing number of servers. Because the data changes infrequently (or never), life is easy. For distributed databases, though, it is a different story. Managing state across multiple data centers distributed far and wide around the globe is a hard problem to solve. Thus many shy away from and write off global deployments. But not without paying a price.

5 Years of Fighting DDoS with the Power of Akamai
https://blogs.akamai.com/2019/07/5-years-of-fighting-ddos-with-the-power-of-akamai.html
As a Product Manager, my instinct is to wax philosophical about the cool new detection abilities, mitigation methods, and capacity growth to stay ahead of both attackers and our competition. However, you can hear that points in our sales presentations. I wanted to take a deeper look at how attacks against customers on the Prolexic platform have shifted in the last five years.

A better zip bomb
https://www.bamsoftware.com/hacks/zipbomb/
This article shows how to construct a non-recursive zip bomb that achieves a high compression ratio by overlapping files inside the zip container. “Non-recursive” means that it does not rely on a decompressor’s recursively unpacking zip files nested within zip files: it expands fully after a single round of decompression. The output size increases quadratically in the input size, reaching a compression ratio of over 28 million (10 MB → 281 TB) at the limits of the zip format.

DLRM: An advanced, open source deep learning recommendation model
https://ai.facebook.com/blog/dlrm-an-advanced-open-source-deep-learning-recommendation-model/
We are open-sourcing a state-of-the-art deep learning recommendation model (DLRM) that was implemented using Facebook’s open source PyTorch and Caffe2 platforms. DLRM advances on other models by combining principles from both collaborative filtering and predictive analytics-based approaches, which enables it to work efficiently with production-scale data and provide state-of-art results.

Saving the seas: how AI is helping to protect our oceans
https://news.microsoft.com/europe/features/saving-the-seas-how-ai-is-helping-to-protect-our-oceans/
Studying and forecasting the influence of climate change on oceans is what professor Ronan Fablet, and his team of researchers at IMT Atlantique in France, have been focusing for the past two years. They are developing data-driven and learning-based schemes for the modelling, analysis and reconstruction of ocean atmosphere dynamics, by using satellite remote sensing data. These improved models offer the potential to better understand the Earth’s climate, and the impact of climate change on oceans, from currents to CO2 concentrations.

新鲜货

Google’s robots.txt Parser is Now Open Source
https://opensource.googleblog.com/2019/07/googles-robotstxt-parser-is-now-open.html
We announced that we’re spearheading the effort to make the REP an internet standard. While this is an important step, it means extra work for developers who parse robots.txt files. We’re here to help: we open sourced the C++ library that our production systems use for parsing and matching rules in robots.txt files. This library has been around for 20 years and it contains pieces of code that were written in the 90’s. 另附：Google wants to make the 25-year-old robots.txt protocol an internet standard.

Sing Me A Song of Stack Overflow: A Musical Tail Call Optimization
https://stackoverflow.blog/2019/07/02/tail-call-optimization-the-musical-bang-bang-con/
When Anjana Vakil and Natalia Margolis applied to speak at !!Con (read Bang Bang Con) this year, they wanted to take the call for ‘non-traditional’ talks to heart while still sharing useful insights. They decided to tackle the following question: why recursion poses a problem for the finite-memory call stack. That could be quite a dry topic, so the two developers thought: “Let’s sing about it!” And thus the ‘Tail Call Optimization: The Musical’ was born.

Babel 7.5.0 Released: dynamic import and F# pipelines
https://babeljs.io/blog/2019/07/03/7.5.0
This release includes improved support for a few ECMAScript proposals: the F# variant of the Stage 1 pipeline operator and an official plugin for the Stage 4 dynamic import() proposal (along with preset-env support). It also has support for TypeScript namespaces (experimental) and for Browserslist’s default query in preset-env.

C# or Java? TypeScript or JavaScript? Machine learning based classification of programming languages
https://github.blog/2019-07-02-c-or-java-typescript-or-javascript-machine-learning-based-classification-of-programming-languages/
Linguist is the tool we currently use to detect coding languages at GitHub. Linguist a Ruby-based application that uses various strategies for language detection, leveraging naming conventions and file extensions and also taking into account Vim or Emacs modelines, as well as the content at the top of the file (shebang). Linguist handles language disambiguation via heuristics and, failing that, via a Naive Bayes classifier trained on a small sample of data.

GitLab: Why we’re ending support for MySQL in 12.1
https://about.gitlab.com/2019/06/27/removing-mysql-support/
It wasn’t an easy decision, but we wanted to share with you why we did it: It wasn’t great for our use case, It made us slower, We couldn’t take advantage of either backend, Most of our customers are on PostgreSQL. 另附：What we’re doing to beautify our UI.

p5.js
https://github.com/processing/p5.js
p5.js is a client-side JS platform that empowers artists, designers, students, and anyone to learn to code and express themselves creatively on the web. It is based on the core principles of Processing.

react-movable
https://github.com/tajo/react-movable
Drag and drop for your React lists and tables. Accessible. Tiny.

Rest Hooks
https://resthooks.io
Delightful data fetching for React. Making dynamic sites performant, scalable, simple to build with any API design.

css-doodle
https://css-doodle.com/
A web component for drawing patterns with CSS.

Frappe Charts
https://frappe.io/charts
Modern, Open Source SVG Charts. GitHub-inspired simple and modern SVG charts for the web with zero dependencies.

SVG-edit
https://github.com/SVG-Edit/svgedit
SVG-edit is a fast, web-based, JavaScript-driven SVG drawing editor that works in any modern browser.

Jimp
https://github.com/oliver-moran/jimp
An image processing library for Node written entirely in JavaScript, with zero native dependencies.

Ts.ED
http://tsed.io/
A TypeScript Framework on top of Express.

Form-Data
https://github.com/form-data/form-data
A library to create readable “multipart/form-data” streams. Can be used to submit forms and file uploads to other web applications.

multistream
https://github.com/feross/multistream
A stream that emits multiple other streams one after another (streams2).

Puppeteer recorder
https://checklyhq.com/docs/puppeteer-recorder/
Puppeteer recorder is a Chrome extension that records your browser interactions and generates a Puppeteer script. Use it to create Checkly browser checks without writing any code.

NativeScript 6.0 Release Candidate is Here!
https://www.nativescript.org/blog/nativescript-6.0-release-candidate-is-here
The next major release is going to be very important for the NativeScript framework. It’s the apogee of our effort to make Webpack a first-class citizen and provide a stellar development experience through it. Every release for the past 1.5 years was a step towards this goal and the we are very excited to be at the final countdown. 6.0 will also bring support for AndroidX - this paves the road for many new features that will come in the Android ecosystem.

The missing SwiftWebUI
http://www.alwaysrightinstitute.com/swiftwebui/
Beginning of the month Apple announced SwiftUI at the WWDC 2019. A single “cross platform”, “declarative” framework used to build tvOS, macOS, watchOS and iOS UIs. SwiftWebUI is bringing that to the Web. Disclaimer: This is a toy project! Do not use for production. Use it to learn more about SwiftUI and its inner workings.

URL Pages
https://github.com/jstrieb/urlpages
Create and view web pages stored entirely in the URL.

Lazydocker: a terminal GUI for Docker
https://github.com/jesseduffield/lazydocker
A simple terminal UI for both docker and docker-compose, written in Go with the gocui library.

DuckDB, the SQLite for Analytics
https://github.com/cwida/duckdb
DuckDB is an embedded database designed to execute analytical SQL queries fast while embedded in another process. It is designed to be easy to install and easy to use. DuckDB has no external dependencies. DuckDB has bindings for C/C++, Python and R.

设计

What is User Experience Design? (2019 edition)
https://uxplanet.org/what-is-user-experience-design-2019-edition-197e301d4e3b
There are many many talks about what’s UX and who’s an UX’er that sometimes even confusing for us to keep track of all different definitions. The fact that there’s still not a consensus on what an UX’er does is two-fold. Firstly, it’s an alarming signal because digital products have been evolving for the past 25 years or so. The least we can expect is to share a mutual understanding of the definition of UX and the role of UX’ers. Secondly, it’s positive because the user experience shall not be defined and confined within certain boundaries.

Defining Design Generalists
https://airbnb.design/defining-design-generalists/
Exploring the skill set of an underrated superpower. In the best cases, generalists can be defined as knowing a great amount about a great number of things. In the worst, they can be seen as a “Jack of all trades, master of none.” While specialists have the unique advantage of being able to easily to point to an area of expertise, generalists don’t have that luxury. 另附：From Noob to Pro Designer (How did I do it?).

It’s time to kill the infinite scroll
https://www.invisionapp.com/inside-design/kill-infinite-scroll/
The replacement of homepage widgets and carousels with a fast-loading, infinitely scrolling experience saw every brand’s engagement metrics go through the roof. Many media brands saw a subsequent quadrupling of “time on page” and lots of shiny new sales decks were polished to bring out to the market. Having your advertisement “above the fold” was now irrelevant, as “the fold” had dissolved into an endless stream of scrolling addiction.

User Inyerface - A worst-practice UI experiment
https://userinyerface.com/
Hi and welcome to User Inyerface, a challenging exploration of user interactions and design patterns. To play the game, simply fill in the form as fast and accurate as possible.

阿里新开发了一款神器，零基础也能轻松做出酷炫动效
https://www.uisdc.com/alibaba-emotion
阿里作为中国互联网企业的标杆，不仅一直在为广大人民群众提供快捷便利的服务。也不断引领行业，在各个专业领域，给专业人员提供了优质的工具与服务。对设计师而言，无论是每年一度的 UCAN大会，还是 Kitchen、语雀、Ant Design 等设计开发工具，都给广大设计师带来很大的便利。而最近，阿里又推出了一款基于 Lottie 的动效设计平台 ── 犸良。能够快速生成设计师想要的动态效果，并交付给开发，极大地提高了设计效率和设计还原度。

产品及其它

勾三股四：用技术追寻世界的确定答案
https://weibo.com/ttarticle/p/show?id=2309404390751113970006
2015年，他发起阿里Weex项目，实现「一次编写，三端运行」。他被称为「Weex之父」。2016年，阿里宣布开源Weex项目，年底将其捐赠Apache基金会。2017年，他在微博宣布退出Weex团队。外界对Weex的讨论也好，争议也罢，他淡出了大众的视线。下一次外界听到他的消息，是在2017年底，却完全与技术无关。原来，他和几个同事一起，组成了阿里996乐队。大家才发现，原来程序员们不仅会写代码，写歌也蛮好听。他和Weex的故事是怎样的？他是怎样的一个人？今天，图灵访谈带你走近勾三股四，一位自称「有点叛逆」的前端工程师。

辞职1年后：这5点道理，我后悔没早点知道
https://mp.weixin.qq.com/s?__biz=MzUyMjE4NjQyMQ==&mid=2247499065&idx=1&sn=8acf99dfb3fa00b938e98ed5acbe86a5
确定效应、身份的焦虑、体制的安全、金钱的匮乏、连结的断裂，因为上面五个原因，我们不愿离开原地。我们害怕连结的断裂。当我想明白这些事后，一切都变得豁然开朗。原来，我要面对的既不是金钱的匮乏，也不是身份的焦虑。原来，我要面对的只是人性的弱点。正如：哲学家海德格尔说的那句话：“人不自由时感到不满，自由时感到惶恐。”

商业的本质思考，蕴藏在生物学中
https://mp.weixin.qq.com/s?__biz=MzUyMDQ5NzI5Mg==&mid=2247509230&idx=1&sn=c7cfae10ce07c33c65e1216e63b83c76
企业如何诞生？如何生存、演化？这和生物学的底层逻辑，完全一致。

世界需要什么样的智能系统
https://mp.weixin.qq.com/s?__biz=MjM5NzA4ODc0MQ==&mid=2648628801&idx=1&sn=91761179b95b108cf964885dddab1cef
一个完整的「智能系统」，是包含了「感知」与「行动」，其中支撑行动的是决策和调度的技术。而衡量这个智能系统是否有价值的标准，是看其解放的生产力的多少。遗憾的是，到今天为止我认为业界并不存在一个理想的「智能系统」。业界当前的状态我称之为「有智能，没系统」。如果用航空业来比喻的话，今天的智能技术，就好比造飞机，市面上已经有了很多零件和引擎，但是所有的厂商都拿着零件当飞机卖，客户以为他买了一架飞机，其实只是买了个零件（因为生产力并没有得到多大的解放）。而今天真正的难点在于飞机设计图纸都还没有。

对数据可视化有兴趣的可以阅读由 AntV 带来的 墨者修齐 2019-07-08·可视化国家经济实力、灾难地图、Voronoi 动态用例

– THE END –