FEX 技术周刊 - 2020/05/18
Second-guessing the modern web
There is a sweet spot of React: in moderately interactive interfaces. Complex forms that require immediate feedback, UIs that need to move around and react instantly. That’s where it excels. I helped build the editors in Mapbox Studio and Observable and for the most part, React was a great choice. But there’s a lot on either side of that sweet spot. The high performance parts aren’t React.
DataWorks 前端架构演进与 Serverless 实践之路
DataWorks 是一个提供了大数据 OS 能力、并以 all in one box 的方式提供专业高效、安全可靠的一站式大数据智能云研发平台，提供了数据集成、数据开发、数据治理、数据安全、数据服务、应用开发、机器学习完整数据链路的产品。
在开发过程中，收到这样一个问题反馈，在网站上传 100 MB 以上的文件经常失败，重试也要等老半天，这就难为需要上传大规格文件的用户了。那么应该怎么做才能快速上传，就算失败了再次发送也能从上次中断的地方继续上传呢？下文为你揭晓答案~
if…else是所有高级编程语言都有的必备功能。但现实中的代码往往存在着过多的 if…else。虽然 if…else 是必须的，但滥用 if…else 会对代码的可读性、可维护性造成很大伤害，进而危害到整个软件系统。现在软件开发领域出现了很多新技术、新概念，但 if…else 这种基本的程序形式并没有发生太大变化。使用好 if…else 不仅对于现在，而且对于将来，都是十分有意义的。今天我们就来看看如何“干掉”代码中的 if…else，还代码以清爽。
A (Mostly) Complete Guide to React Rendering Behavior
I’ve seen a lot of ongoing confusion over when, why, and how React will re-render components, and how use of Context and React-Redux will affect the timing and scope of those re-renders. After having typed up variations of this explanation dozens of times, it seems it’s worth trying to write up a consolidated explanation that I can refer people to. Note that all this information is available online already, and has been explained in numerous other excellent blog posts and articles, several of which I’m linking at the end in the “Further Information” section for reference. But, people seem to be struggling to put the pieces together for a full understanding, so hopefully this will help clarify things for someone.
Accessible Animations in React
As humans, we tend to bias around our own experiences. The “Golden Rule”—treat others as you want to be treated—totally ignores the fact that people are different! Not everyone experiences things the same way, and we need to be mindful about that. An animation that delights me might make someone else so woozy that they need to lie down for half an hour afterwards. Every non-trivial feature that gets added to a browser is the result of a lot of hard work and coordination. The fact that the prefers-reduced-motion media query exists in every major browser is a testament to how much work browser vendors put in, not to mention the operating system developers who built the control in the first place!
CSS fix for 100vh in mobile WebKit
Not long ago there was some buzz around how WebKit handles 100vh in CSS, essentially ignoring the bottom edge of the browser viewport. Some have suggested avoid using 100vh, others have come up with different alternatives to work around the problem. In fact, this issue goes further back a few years when Nicolas Hoizey filed a bug with WebKit on the subject (the short of it: WebKit says this is “intentional” 🧐).
Let’s Take a Deep Dive Into the CSS Contain Property
This article has covered the basics of the CSS contain property with its values, benefits, and potential performance gains. There are some excellent benefits to applying this property to certain elements in HTML; which elements need this applied is up to you. At least, that’s what I gather since I’m unaware of any specific guidance. The general idea is apply it to elements that are containers of other elements, especially those with some form of dynamic aspect to them.
Convincing-looking 90s fonts in modern browsers
We wanted to make a website that looked like it was from the 1990s. Sounds easy, right? Looking back from 2020, the aesthetic of the early World Wide Web stands out for the things it lacked: no CSS, emojis, fancy web fonts or non-web-safe colours.
GitLab’s Tech Stack Applications Diagram and Spreadsheet
It’s neat to see what systems a popular, widely distributed company like GitLab is using. The spreadsheet goes into quite some detail. 另附：Inside GitLab: How we release software patches.
How do I use Infrastructure as Code?
Infrastructure as code (IaC) is the process of managing and provisioning cloud and IT resources via machine readable definition files and is a part of modern continuous integration pipelines. IaC enables organizations to provision, manage, and destroy compute resources using modern DevOps tools. IaC enables this by statically defining and declaring these resources in code, then deploying and dynamically maintaining these resources via code. In this post, I will discuss the benefits of IaC and some of the tooling option currently available along with a brief demonstration on how to use them in hopes of easing the transition to using IaC.
Accelerometer and SoftSKU: Improving hardware platform performance for diverse microservices
New strategies to improve the performance of hardware platforms running Facebook’s microservices. SoftSKU is a novel mechanism that tailors an existing server processor to optimize it for a specific microservice without requiring any additional hardware. Accelerometer is an analytical model that predicts gains from these optimizations even before the custom hardware is installed.
First, it was Craigslist, next it’s Zapier
As I delve deeper into the no-code space I see a lot of Zapier, Integromat and Tray.io workflows. Some of these are actually quite complex and require some programming knowledge to understand them (which kind of defeats the point of no-code). As I was looking at some of these workflows, I couldn’t help but think how there will be this eventual shift like with Craiglist where companies will spring up that just focus on certain more complex popular workflows.
Understanding Cost Models
Analytic queries can become complex, horrifically so, in fact, and assessing their costs follows suit. To alleviate this somewhat, we’re going to explore some tools we can use to attempt to travel up the ladder of abstraction for query planners. In doing so, we’re going to try to figure out where the difficulty here lives: is looking at a single query confusing because we have the wrong perspective, or is there some inherent complexity present here?
Make LLVM fast again
Conversely, there are some ongoing efforts that might make for large compile-time regressions when they do get enabled, such as the attributor framework, the knowledge retention framework and MemorySSA-based DSE. We’ll see how things look by the time of the LLVM 11 release
Up to 4GB of memory in WebAssembly
Thanks to recent work in Chrome and Emscripten, you can now use up to 4GB of memory in WebAssembly applications. That’s up from the previous limit of 2GB. It might seem odd that there was ever a limit - after all, no work was needed to allow people to use 512MB or 1GB of memory! - but it turns out that there are some special things happening in the jump from 2GB to 4GB, both in the browser and in the toolchain, which we’ll describe in this post.
Announcing TypeScript 3.9
For this release our team been has been focusing on performance, polish, and stability. We’ve been working on speeding up the compiler and editing experience, getting rid of friction and papercuts, and reducing bugs and crashes.
Announcing Adobe XD support for Flutter
Create in XD and export to working Flutter code. 另附：使用 Web 标准开发动态化 Flutter 应用.
A first look at Unreal Engine 5
We’ve just released a first look at Unreal Engine 5. One of our goals in this next generation is to achieve photorealism on par with movie CG and real life, and put it within practical reach of development teams of all sizes through highly productive tools and content libraries. 另附：MS Flight Simulator 2020 vs Real life, NVIDIA CEO Introduces NVIDIA Ampere Architecture, NVIDIA A100 GPU in News-Packed ‘Kitchen Keynote’.
React Native for Windows + macOS
Coming to Chrome: a new way to use tabs
With a simple right click, you can group your tabs together and label them with a custom name and color. Once the tabs are grouped together, you can move and reorder them on the tab strip.
Blitz is a Rails-like framework for monolithic, full-stack React apps — built on Next.js
Diagram as Code for prototyping cloud system architectures
GitHub WYSIWYG Rich-Text Editor
Bootstrap v4.5.0 has landed with dozens of bug fixes, some small new features, and some changes to our development. Originally planned as a v4.4.2 patch release, we’ve bumped this to a minor release on account of our new features that help bridge the gap between v4 and our upcoming v5.
Recoil - A state management library for React from facebook
Recoil is an experimental state management library for React apps. It provides several capabilities that are difficult to achieve with React alone, while being compatible with the newest features of React. 另附：Kea 2.0 - Production Ready State Management for React
Write PIXI applications using React declarative style
Fast Refresh, Incremental Static Regeneration (beta)…
fdir V3: A High Performance Directory Crawler Library
Two months ago it claimed to the fastest Node directory crawler and it’s now supposedly even faster than when we first linked it. Need to scan through directories rapidly either asynchronously or synchronously?
tracer for node.js
A powerful and customizable logging library for node.js.
Web performance library for measuring all User-centric performance metrics
Webrecorder.io is a web archiving service to collect and revisit web pages
Webrecorder creates an interactive copy of any web page that you browse, including content revealed by your interactions such as playing video and audio, scrolling, clicking buttons, and so forth.
Draw.io VS Code Integration
This extension integrates Draw.io into VS Code. 另附：Introducing MongoDB for VS Code.
Announcing Hyperdrive v10
Hyperdrive is a peer-to-peer filesystem that’s designed to help you share files quickly and safely, directly from your computer. In this post we’ll step through some of the improvements we’ve made in v10, explain how Hyperdrive fits into the broader Hypercore Protocol ecosystem, and show you how to get started using it. This release is only the beginning, and we describe our next steps in the “Looking Forward” section.
Memgraph 1.0: An Enterprise-Ready In-Memory Graph Database
Now approaching 4 years old, Memgraph, a high performance in-memory graph database, has reached v1.0. It’s compatible with the Cypher query language and the Bolt protocol so you can use it from any language that has a Bolt driver. Does ‘enterprise-ready’ mean expensive? Not necessarily. It’s not open source but there is a free ‘community’ licensed version.
What’s Coming in Go 1.15
In the upcoming 1.15 version, changes to the language specification are basically non-existent as expected; the improvements are in the tooling, the performance of the compiler, and in the standard library.
immudb is a lightweight, high-speed immutable database for systems and applications. With immmudb you can track changes in sensitive data in your transactional databases and then record those changes permanently in a tamperproof immudb database. This allows you to keep an indelible history of sensitive data, for example debit/credit card transactions.
Game Programming Patterns
Game Programming Patterns is a collection of patterns I found in games that make code cleaner, easier to understand, and faster.
How Fluent UI Unlocks the Next Generation of Microsoft 365 Experiences
Continuing our journey toward a true design-to-code system at scale
Micro-Typography: How To Space And Kern Punctuation Marks And Other Symbols
For hundreds of years, we have been using white space in typography. Today, in 2020, how do we add spacing to punctuation marks and other symbols, and how do we adjust the space on the left and right side in an easy and consistent way? It is actually not as easy and quick as it should be.
Where did it come from? My non-computer Daily UI
Daily UI was created with the user interface of software or computerized devices in mind. In my challenge, I wanted to analyze and reflect on the roots of these elements.
Human-Centered Design in Real Time
Co-designing emergency response solutions with COVID-19 frontline workers. 另附：Principles of Human-Centered Design- Part II.
If I could bring one thing back to the internet it would be blogs
But they would be the one thing I’d bring back to the internet if I could bring one thing back. They’re the thing I miss the most and the most often. They were the most valuable thing on here, besides freer availability of news, free although low quality video content on YouTube, and I guess some kinds of social media. But blogs are something you can sit down and read and get really into to the point you forget where you even are, and think about how you want to try those things maybe in your life, or just enjoy their writing, and you can read deeper into them into past blog posts, and tune back in later and see what they’ve posted since the last things you read about them.
The most successful developers share more than they take
After interviewing several developers, a pattern started to become clear: great developers share a lot. This takes different forms for different people, but is very often a blog. But for many top developers, their sharing mindset came before their success, and was the direct cause of it, not the result of it.
– THE END —