FEX 技术周刊 - 2019/03/04

深阅读

Technical lessons from building a compiler startup for 3 years
https://medium.com/@gabriel_20625/technical-lessons-from-building-a-compiler-startup-for-3-years-4473405161cd
Pagedraw recently shut down and is now open source. Pagedraw is a UI builder like Sketch + a compiler that translates your designs into React code. Instead of doing a “It was an incredible journey, thank you so much everyone“ type of post, we think what would be the most helpful for other people interested in DevTools, programming, or startups in general is to just try to distill the most important lessons we learned doing Pagedraw over the past three years. 另附：Launch HN: Pagedraw (YC W18) – Compile UI Mockups to React Code、Pagedraw is shutting down and going open source.

Redis Turns 10 – How it started with a single post on Hacker News
https://redislabs.com/blog/redis-turns-10/
10 years ago, a link was posted on Hacker News to a new software project called Redis. In the comments, its creator Salvatore Sanfilippo (a.k.a. antirez) says “one of the major points of Redis is to support more complex types as values”. From Day 1, Salvatore knew what he wanted to build. And to his credit, he stayed focused. Redis now has 10 complex types and a module system that enables developers to build more. And as a result, Redis is the most popular key-value store on the planet.另附：Gopher: a present for Redis.

Why we created npm Enterprise
https://blog.npmjs.org/post/183073931165/why-we-created-npm-enterprise
Last week we launched npm Enterprise, a fact that might come as a surprise to those of you who’ve been paying attention and know that we’ve had an enterprise product since 2014. The new Enterprise is a totally different beast, the result of recognizing that the way npm works is fundamentally new and different to previous package ecosystems.

百度的春晚战事
https://mp.weixin.qq.com/s?__biz=MzU0NDEwMTc1MA==&mid=2247491861&idx=1&sn=5be51315f84079d798db03bf731ebd17
无论悲喜，反正每个中国人都为春晚辟出了一块“专属记忆”。而从2015年开始，中国人的春晚记忆里被点上了一颗“红痣”。那就是——总有一家顶尖互联网公司面带羞赧地走上舞台，给十几亿人发红包。2019年，央视春晚红包招标时间很晚，距离除夕只有一个多月的时间。巨头们都觉得凶险异常，百度却高高举手：我来！我来！所有吃瓜群众都侧目，这种“情商低”的状态，还真是百度的风格。。。接下来中哥就告诉你，2019年2月4日除夕晚上，这片土地上究竟发生了什么。

前端之未来
https://www.yuque.com/zenany/up/the_future_frontend
Gartner 2018 年的一份报告中提到三项前端相关的战略技术：Digital Twin、Immersive technologies、Smart Spaces，但当下的前端技术远不足以胜任这些领域。站在 201X 的末尾、互联网下半场的开始，不妨一起看看前端的未来在哪里，有哪些值得投入的方向。

谈谈我的“三观”
https://coolshell.cn/articles/19085.html
听耗子哥谈：世界观、人生观和价值观。

Taro UI 2.0 发布
https://aotu.io/notes/2019/02/25/taro-ui-2.0/
新增自定义主题功能，适配更多小程序。另附：决战性能之巅 - Taro H5 转换与优化升级.

Semantics to Screen Readers
https://alistapart.com/article/semantics-to-screen-readers
Assistive technologies (ATs), which are hardware and software that help us perceive and interact with digital content, come in diverse forms. ATs can use a whole host of user input, ranging from clicks and keystrokes to minor muscle movements. ATs may also present digital content in a variety of forms, such as Braille displays, color-shifted views, and decluttered user interfaces (UIs). If you make websites, you may have tested your sites with a screen reader. But how do these and other assistive programs actually access your content? What information do they use? We’ll take a detailed step-by-step view of how the process works.

Taming the front-end monolith
https://blog.logrocket.com/taming-the-front-end-monolith-dbaede402c39
While larger back-end systems are usually split up in terms of responsibilities into what we call (micro)services, the client(s) consuming these services are still monoliths. In terms of debugging and coherence this must obviously offer some advantage, otherwise, such a concentration of knowledge seems inefficient and unmaintainable. In this post, I will try to tackle the problem with a solution proposal that works especially great for what I would call “portal-like applications”.

Implications of Rewriting a Browser Component in Rust
https://hacks.mozilla.org/2019/02/rewriting-a-browser-component-in-rust/
Due to the overlap between memory safety violations and security-related bugs, we can say that Rust code should result in fewer critical CVEs (Common Vulnerabilities and Exposures). However, even Rust is not foolproof. Developers still need to be aware of correctness bugs and data leakage attacks. Code review, testing, and fuzzing still remain essential for maintaining secure libraries. 另附：Super-fast javascript to javascript compiler written in rust ，号称速度是 babel 的十六倍。

Six tips for better web typography
https://css-tricks.com/six-tips-for-better-web-typography/
How do we avoid the most common mistakes when it comes to setting type on the web? That’s the question that’s been stuck in my head lately as I’ve noticed a lot of typography that’s lackluster, frustrating, and difficult to read. So, how can we improve interfaces so that our content is easy to read at all times and contexts? How do learn from everyone else’s mistakes, too? 另附：Typography for Developers.

Feross Aboukhadijeh, The Lost art of midi bringing back to the web
https://www.youtube.com/watch?v=BmfDMylKo5I
In the days of Geocities and Angelfire, a quirky HTML tag called bgsound enabled sound files to play in the background of webpages. Usually, these files were in the MIDI format. What a glorious era that was! Sadly, bgsound has been removed from browsers and MIDI is obscure and hard to play back. In this talk, we’ll bring MIDI and bgsound back from the dead using WebAssembly, Emscripten, Web Audio, and Web Components. When we’re finished, you’ll be able to give your webpages the 90’s treatment in a modern, standards-compliant way!

Server-Side Caching in Expressjs
https://blog.bitsrc.io/server-side-caching-in-expressjs-24038daec102
Caching has always been one of the many optimization tricks widely used in software development. In this post, we will look at how to enable server-side caching in Expressjs. Read on.

ReDoS vulnerabilities in npm spikes by 143% and XSS continues to grow
https://snyk.io/blog/redos-vulnerabilities-in-npm-spikes-by-143-and-xss-continues-to-grow/
Regular expression denial of service (ReDoS) attacks exploit the non-linear worst-case complexity vulnerabilities that some regex patterns can lead to. For a single-threaded runtime this could be devastating, and this is why Node.js is significantly affected by this type of vulnerability. We found that there were a growing number of ReDoS vulnerabilities disclosed over the last three years, with a spike of 143% in 2018 alone. 另附：Top ten most popular docker images each contain at least 30 vulnerabilities、Node.js February 2019 Security Releases、Breaking Down the MarioNet Service Worker Attack? Can Your Website Be Compromised?.

Reconstructing Twitter’s Firehose
https://docs.google.com/document/d/1xVrPoNutyqTdQ04DXBEZW4ZW4A5RAQW2he7qIpTmG-M
How to reconstruct over 99% of Twitter’s firehose for any time period.

Managing Uber’s Data Workflows at Scale
http://highscalability.com/blog/2019/2/25/design-of-a-modern-cachepart-deux.html
At Uber’s scale, thousands of microservices serve millions of rides and deliveries a day, generating more than a hundred petabytes of raw data. Internally, engineering and data teams across the company leverage this data to improve the Uber experience. Application of this data spans several use cases, including calculating more efficient uberPOOL routes and making sure Uber Eats orders are delivered while the food is still hot, real-world events represented by data in our infrastructure.

Rebuilding the Profile Highlights System at LinkedIn
https://engineering.linkedin.com/blog/2019/02/rebuilding-the-profile-highlights-system-at-linkedin
One of the many ways to drive member conversations and active communities is through profile highlights, which are insights between the viewer of a profile and that profile’s owner. In this post, we will touch on why we decided to rebuild the backend system that supports this feature, its technological background, how we re-architected it, and the benefits and successes achieved thus far.

Serverless Needs a Bolder, Stateful Vision
https://thenewstack.io/serverless-needs-a-bolder-stateful-vision/
The Requirements of Serverless Are Evolving from the Infrastructure, up to the Application Logic. The enterprise is broadly replatforming data centers on containers, Kubernetes, and cloud-native frameworks in its orbit, and the adoption and momentum have been remarkable.

MySQL Challenge: 100k Connections
https://www.percona.com/blog/2019/02/25/mysql-challenge-100k-connections/
In this post, I want to explore a way to establish 100,000 connections to MySQL. Not just idle connections, but executing queries. 100,000 connections. Is that really needed for MySQL, you may ask? Although it may seem excessive, I have seen a lot of different setups in customer deployments. Some deploy an application connection pool, with 100 application servers and 1,000 connections in each pool. Some applications use a “re-connect and repeat if the query is too slow” technique, which is a terrible practice. It can lead to a snowball effect, and could establish thousands of connections to MySQL in a matter of seconds. So now I want to set an overachieving goal and see if we can achieve it. 另附：ValuStor — a memcached alternative built on Scylla、SageDB: a learned database system.

Fearless concurrency: how Clojure, Rust, Pony, Erlang and Dart let you achieve that
https://sites.google.com/a/athaydes.com/renato-athaydes/posts/fearlessconcurrencyhowclojurerustponyerlanganddartletyouachievethat
In this article, we’ll have a quick look at a few of them, from new to not-so-new languages. I don’t intend to give an extensive analysis of each solution, or make a formal comparison between them. My intention is to simply explain the basics of each solution and how they can be used in practice (with code samples that show off what the result of using the models might look like), so that other developers may have an easier time understanding them and deciding which solution, or language, might be better applicable to their particular problems.

Why Does Julia Work So Well?
https://ucidatascienceinitiative.github.io/IntroToJulia/Html/WhyJulia
Julia is fast by design. Type stability and multiple dispatch is necessary to do the specialization that is involved in Julia’s compilation to make it work so well. The robust type system is required to make working with types at such a fine level in order to effectively achieve type-stability whenever possible, and manage optimizations when it’s not totally possible.

新鲜货

Launching Flutter 1.2 at Mobile World Congress
https://developers.googleblog.com/2019/02/launching-flutter-12-at-mobile-world.html
Flutter 1.2 is the first feature update for Flutter. We’ve focused this release on a few major areas:

• Improved stability, performance and quality of the core framework.
• Work to polish visual finish and functionality of existing widgets.
• New web-based tooling for developers building Flutter applications.

Mozilla releases the largest to-date public domain transcribed voice dataset
https://blog.mozilla.org/blog/2019/02/28/sharing-our-common-voices-mozilla-releases-the-largest-to-date-public-domain-transcribed-voice-dataset/
Mozilla crowdsources the largest dataset of human voices available for use, including 18 different languages, adding up to almost 1,400 hours of recorded voice data from more than 42,000 contributors. From the onset, our vision for Common Voice has been to build the world’s most diverse voice dataset, optimized for building voice technologies. We also made a promise of openness: we would make the high quality, transcribed voice data that was collected publicly available to startups, researchers, and anyone interested in voice-enabled technologies.

Announcing a New Management Structure for Ecma TC39
https://hacks.mozilla.org/2019/02/announcing-a-new-management-structure-for-ecma-tc39/
In 2019, Ecma’s TC39 (the standardizing body behind JavaScript/ECMAScript) will be trying something new. The committee has grown in the last few years. As a result, the requirements of running the meeting have grown. To give you an idea of the scale — between 40 and 60 delegates (and sometimes more) meet 6 times a year to discuss proposed changes to the ECMAScript specification. Since we have grown so much, we will be changing our management structure. We will move away from single-chair and vice-chair roles to a flat hierarchy with three chairs sharing the responsibility.

Highlights from Git 2.21
https://github.blog/2019-02-24-highlights-from-git-2-21/
The open source Git project just released Git 2.21 with features and bug fixes from over 60 contributors. We last caught up with you on the latest Git releases when 2.19 was released. Here’s a look at some of the most interesting features and changes introduced since then. 另附：GitHub - Release Radar · February 2019.

React Native Open Source Update March 2019
https://facebook.github.io/react-native/blog/2019/03/01/react-native-open-source-update
We announced our React Native Open Source roadmap in Q4 2018 after deciding to invest more in the React Native open source community. For our first milestone, we focused on identifying and improving the most visible aspects of our community. Our goals were to reduce outstanding pull requests, reduce the project’s surface area, identify leading user problems, and establish guidelines for community management. In the past two months, we made more progress than we expected. 另附：Choosing React Native For Your Mobile Tech Stack _ Ideamotive.

Go 1.12 is released
https://blog.golang.org/go1.12
The latest Go release, version 1.12, arrives six months after Go 1.11. Most of its changes are in the implementation of the toolchain, runtime, and libraries. As always, the release maintains the Go 1 promise of compatibility. We expect almost all Go programs to continue to compile and run as before.

Ionic 4 Roadmap: New Features, Release Schedule, & Goals—Oh My!
https://blog.ionicframework.com/ionic-4-roadmap-new-features-release-schedule-goals-oh-my/
We’ve been overwhelmed with the positive feedback, and so far 4.0 has exceeded our expectations of what’s been possible with a rewrite. So, with the official Ionic Framework 4.0.0 release behind us, I figured now would be a great time to lay out our roadmap and immediate plans for next steps—a vision, if you will, for where we hope to take Ionic Framework in the near future…

play.js - The Node.js and React Native IDE for iPhone and iPad
https://playdotjs.com/
play.js brings the power of React Native and Node.js to your iOS device. Finally you can use your iPhone or iPad to develop fast and reliably scripts and applications with a full fledge code editor that features code autocompletion, multi-file projects, documentation and much more.

Package Diff: A Way to diff npm Packages
https://diff.intrinsic.com/
Package Diff displays a diff between two versions of the same npm package. Why not simply link to the GitHub repository of a package using two different version hashes? Well, the version of an npm package checked into source control isn’t always the same as the version used inside of an npm package. This is commonly done for well-intending reasons, such as checking in raw source code but packaging a minified version. This is sometimes done for nefarious reasons as well, such as when a malicious package is published. 另附：Introducing Package Diff.

Zero Server - Zero configuration web framework
https://zeroserver.io/
Zero abstracts the usual project configuration for routing, bundling, and transpiling to make it easier to get started. It allows you to build your application without worrying about package management or routing. Write your code in a mix of Node.js, React, HTML, MDX, and static files and put them all in a folder.

Ember 3.8 Released
https://www.emberjs.com/blog/2019/02/27/ember-3-8-released.html
The Ember project is releasing version 3.8 of Ember.js, Ember Data, and Ember CLI. This release kicks off the 3.8 beta cycle for all sub-projects. We encourage our community (especially addon authors) to help test these beta builds and report any bugs before they are published as a final release in six weeks’ time. The ember-try addon is a great way to continuously test your projects against the latest Ember releases.

Announcing Apollo Client 2.5
https://blog.apollographql.com/announcing-apollo-client-2-5-c12230cabbb7
One year ago, we had a vision for the future of state management. We wanted to provide developers with one source of truth for all of their app’s data and one unified interface to access it. Our dream is finally a reality with the release of Apollo Client 2.5, now with local state management! 附：Apollo Client with REST APIs.

Understanding a Performance Issue with “Polymorphic” JSON Data
https://medium.com/wolfram-developers/understanding-a-performance-issue-with-polymorphic-json-data-e7e4cd079be0
How objects with the same shape but different kinds of values can have a surprising effect on JavaScript performance.

react-typescript-cheatsheet
https://github.com/sw-yx/react-typescript-cheatsheet
We’re so happy you want to try out TypeScript with React! This is meant to be a guide for React developers familiar with the concepts of TypeScript but who are just getting started writing their first React + TypeScript apps. 另附：Why I Was Wrong About TypeScript • TJ VanToll.

reactn 1.0
https://github.com/CharlesStover/reactn
ReactN is a extension of React that includes global state management.

gpu.js - GPU Accelerated JavaScript
http://gpu.rocks/
GPU.js is a JavaScript Acceleration library for GPGPU (General purpose computing on GPUs) in JavaScript. GPU.js will automatically compile simple JavaScript functions into shader language and run them on the GPU. In case a GPU is not available, the functions will still run in regular JavaScript.

AutoNumeric.js
http://autonumeric.org/
Automatically format your numbers and currencies.

FrenchKiss.js
https://github.com/koala-interactive/frenchkiss.js
FrenchKiss.js is a blazing fast lightweight i18n library written in JavaScript, working both in the browser and NodeJS environments. It provides a simple and really fast solution for handling internationalization. FrenchKiss is by now, the fastest i18n JS package out there, working 5 to 1000 times faster than any others by JIT compiling the translations, try it by running the benchmarks !

ms
https://github.com/zeit/ms
Tiny milisecond conversion utility.

he
https://github.com/mathiasbynens/he
he (for “HTML entities”) is a robust HTML entity encoder/decoder written in JavaScript. It supports all standardized named character references as per HTML, handles ambiguous ampersands and other edge cases just like a browser would, has an extensive test suite, and — contrary to many other JavaScript solutions — he handles astral Unicode symbols just fine. An online demo is available.

Buefy
https://buefy.org/
Lightweight UI components for Vue.js based on Bulma.

Level Up with WebAssembly
http://www.levelupwasm.com/
A practical guide to building WebAssembly applications. 另附：Wasmer - Universal Binaries Powered by WebAssembly.

Halley Game Engine
https://github.com/amzeratul/halley
A lightweight game engine written in C++14. It has been used to ship Wargroove, a turn-based strategy game, on Windows, Mac (experimental), Nintendo Switch and Xbox One (soon PS4!). The Halley Game Engine is licensed under the Apache 2.0 license. 另附：CSS powered 3D environment.

Zulip 2.0: Open source team chat
https://blog.zulip.org/2019/03/01/zulip-2-0-released/
Zulip is the world’s most productive team chat software, used by thousands of teams as an alternative to Slack, HipChat, Mattermost and IRC. Zulip’s unique topic-based threading combines the immediacy of chat with the asynchronous efficiency of email-style threading, and is 100% free and open source software. Zulip 2.0 is a huge release, with 1900 new commits since November’s 1.9.

k3s - 5 less than k8s
https://github.com/rancher/k3s
Lightweight Kubernetes. Easy to install, half the memory, all in a binary less than 40mb. Great for: Edge, IoT, CI, ARM, Situations where a PhD in k8s clusterology is infeasible.

We Need Chrome No More. https://redalemeden.com/blog/2019/we-need-chrome-no-more
Ten years ago, we needed Google Chrome to break the Web free from corporate hegemony, and we managed to do so for a brief period. Today, its dominance is stifling the very platform it once saved from the clutches of Microsoft. And no one, beside Google, needs that.

WorldWideWeb
https://worldwideweb.cern.ch/browser/
For the 30th anniversary of the web, CERN brought nine web nerds together to recreate the very first web browser — Or a working replication of it anyway, as you use it from your web browser, inception style. I love that it was written in React and the font is an actual replication of what was used back then. What a cool project. They even opened-sourced the code. 另附：Help build a timeline of the web’s history.

设计

Sketch.systems
https://sketch.systems/
Explore how your product should work, before building it. Sketch.systems helps software designers think about complex product behavior. Sketch out states, add prototypes, and clarify questions quickly. 另附：Formally Specifying UIs.

Redesigning Github repository page
http://tonsky.me/blog/github-redesign/
Github design is pretty good: it gets the job done, it’s clean, has consistent visual language, its design is calm and suitable for everyday use. Given all that, there are still many areas that could be improved. Today we’ll take one interface—repository page—and look what UI problems it has and if we can fix them. 另附：UI redesigns are mostly a waste of time.

The future of UX design is not on a screen
https://uxdesign.cc/the-future-of-ux-design-is-not-on-a-screen-a337ce418c47
The world has changed with such a speed in just 10 years, that I cannot even imagine what might happen in next ten years. It might be strange to think that we are in the middle of a great change right now. The generation before us is facing hard time using touch-screen mobile phones, and the generation after us is making robots. We are in the middle, dealing with everything like a mid-life crisis! But what will happen to UX ten years from now? Let’s look at some of the changes that may happen in merely a decade from now (this is just a personal forecast, and may or may not stand true!).

支付宝集五福—我们是这样为“超级营销”做设计的
https://mp.weixin.qq.com/s?__biz=MzI1MDgwODUwNg==&mid=2247484464&idx=1&sn=3c49a5e90f9ca54f72ea4e5e1e6e023b 支付宝集五福，这个一年一度的活动，已经不再仅仅是属于一个app的活动，更渐渐成为全国人民共同期待的新春新年俗。如何为这样一个万众瞩目的“超级营销”做设计，才足以承载这无数的愿望？今天就一起来揭秘吧！另附：同样是做新春福卡，腾讯是如何设计出人气爆款的。

软件也是战斗力：细品美军“宙斯盾”系统人机界面设计
https://mp.weixin.qq.com/s?__biz=MzU5MDAwNDEzMA==&mid=2247484452&idx=3&sn=221e5f4fcf86fac925a960a0dc5e59d3
假装你在“宙斯盾”战舰的战情中心CIC，你会看到这样一个双屏软件界面：左边是综合态势图，主体是二维上帝视角的战场态势地图，展示了整个战场态势，上面可以分层叠加目标、一些航线和地图标注信息（波斯湾的）。左边上是其他一些系统状态和控制信息，如2D还是3D模式，地图放大倍率，工作状态等右边是单个目标的详图和应对方案，待会儿详细说。两屏下面有16个多个目标块，显示了威胁最大16个目标的简要信息，可以由此选择右边屏显示哪个目标的详情。不要嫌弃这个灰突突的界面，这可是美军花了十几年优化完善的结果，让我随便捡几个门道说说吧：

产品及其它

My Twitch Live Coding Setup
https://medium.com/@suzhinton/my-twitch-live-coding-setup-b2516672fb21
This article is an updated review of tools and software that I use to run my live coding stream each Sunday. If you’re interested in the original article, which offers some advice outside of tools and software, feel free to read it as well! When I wrote the original post, it was intended to be a “lessons learned” post, and I didn’t expect folks to use it as a real guide. Reflecting upon that, I’m going to share my current setup with more attention to detail this time, as I still get questions on a weekly basis from folks looking for more information.

AR, VR & the Future of Learning
https://codecondo.com/ar-vr-the-future-of-learning/
Imagine a geography lecture where students can really experience the Amazon forest and all the species instead of a teacher delivering a plain boring lecture. Or an anatomy lecture where instead of listening to the long lectures having all the complicated terms you are actually visualizing the whole skeleton system or a whole organism. And to all the engineers out there, imagine using all the concepts from books and applying it on a machine via virtual reality.

Microsoft’s HoloLens 2_ a $3500 mixed reality headset for the factory
https://www.theverge.com/2019/2/24/18235460/microsoft-hololens-2-price-specs-mixed-reality-ar-vr-business-work-features-mwc-2019
There’s one more unremarkably remarkable thing: even though it was just a demo, I was playing the part of a worker because that’s who the HoloLens 2 is exclusively designed for — workers, not consumers. 附：New HoloLens 2 gives Microsoft the edge in the next generation of computing、Microsoft releases new apps that make augmented reality way more helpful to businesses.

虽难，但产业互联网的量，远大于消费互联网
https://mp.weixin.qq.com/s?__biz=MzIxNTAzNzU0Ng==&mid=2654621349&idx=1&sn=d24401a9c3aa9f84eb08e74f1127b863
过去几年，在互联网大军的强势竞争下，传统产业似乎遇到了很大的困境。然而，到了2018年，互联网人却纷纷曝出进军传统产业，一场由技术革新带来的变化可能正在颠覆你的认知。产业数字化栏目第一期《小镇：我们已经不一样了 》，我们一起走进小镇感受了那个越来越多企业同台竞逐的产业江湖。今天，我们继续探讨传统产业与互联网如何通过数字化实现平等对话、融合。

2019年，全球十大突破性技术
https://mp.weixin.qq.com/s?__biz=MzIxNTAzNzU0Ng==&mid=2654621275&idx=2&sn=23e2e6440e07cb19293280826bda5533
自 2001 年起，《麻省理工科技评论》每年都会评选出当年的“十大突破性技术”，这份在全球科技领域举足轻重的榜单曾精准预测了脑机接口、智能手表、癌症基因疗法、深度学习等诸多热门技术的崛起。今年的榜单与过去稍有不同，同时，他们还邀请到了比尔·盖茨先生作为客座评选人，全程参与了评选工作，并为本届榜单作序。本届榜单的入选技术也多是以“人类福祉”为最终目标。另附：1909-2019，历代浪潮扑空者。

– THE END –