2018.09.03 - React Fire: Modernizing React DOM

Title: 2018.09.03 - React Fire: Modernizing React DOM

Deep Reading

React Fire: Modernizing React DOM https://github.com/facebook/react/issues/13525 As this work is getting closer to completion, we're starting to think of what the next major releases of React DOM should look like. There are quite a few known problems, and some of them are hard or impossible to fix without bigger internal changes. We want to undo past mistakes that caused countless follow‑up fixes and created much technical debt. We also want to remove some of the abstraction in the event system which has been virtually untouched since the first days of React, and is a source of much complexity and bundle size. We're calling this effort “React Fire”.

Babel 7 Released https://babeljs.io/blog/2018/08/27/7.0.0 After almost 2 years, 4 k commits, over 50 pre‑releases, and a lot of help we are excited to announce the release of Babel 7. It's been almost 3 years since the release of Babel 6! There's a lot of moving parts so please bear with us in the first weeks of release. Babel 7 is a huge release: we've made it faster, created an upgrade tool, JS configs, config “overrides”, more options for size/minification, JSX Fragments, TypeScript, new proposals, and more! Additional links: babel‑upgrade: A New Tool for Automatically Upgrading Projects to Babel 7, What’s Coming Up in JavaScript 2018: Async Generators, Better Regex, Through the Open Source Looking Glass: a non‑technical talk by Babel maintainer Henry Zhu about what it’s like and what it means to be the maintainer of popular open‑source projects.

Flutter Platform Channels https://medium.com/flutter-io/flutter-platform-channels-ce7f540a104e Flutter invites you to write your mobile app in the Dart programming language and build for both Android and iOS. But Dart does not compile to Android’s Dalvik bytecode, nor are you blessed with Dart/Objective‑C bindings on iOS. This means that your Dart code is written without direct access to the platform‑specific APIs of iOS Cocoa Touch and the Android SDK. Additional link: What We’ve Learned from the July 2018 Flutter User Survey

F2 3.2, Powered by You https://www.yuque.com/antv/blog/f2-3.2-publish F2 is a mobile‑first, out‑of‑the‑box visualization solution that works perfectly in H5 environments and is also compatible with many other platforms (Node, mini‑programs, Weex). With a complete graphic grammar theory, it satisfies all kinds of visualization needs. Professional mobile design guidelines give you the best chart experience on mobile devices. Efforts in F2 3.2: richer interactions that make charts feel more tactile; stepping into internationalization; embracing the mini‑program ecosystem. See also: Introducing F2

Hi Loca! AMap “Geospatial Data Visualization” Rendering Engine https://mp.weixin.qq.com/s?__biz=MzA5MDE4MDMyOQ==&mid=2723441912&idx=1&sn=2e047f2d6ea501bb5ec81c8cc828e1ce In the era of big data, the results of data analysis often play a decisive role in business decisions. Presenting data visually is far easier to understand than dry tables, thereby improving decision‑making efficiency. Today we are proud to launch Loca—a web rendering engine for geospatial data visualization developed by the AMap Open Platform.

Implementing Sankey Diagrams for Data Visualization https://geekplux.com/2018/08/28/how-to-implement-sankey-diagram.html A quick Google search for “Sankey diagram” yields many definitions. In short, a Sankey diagram is a flow diagram that shows how data moves from left to right toward the final nodes; each edge represents a flow, and its width reflects the magnitude of that flow. Sankey diagrams are often used for traffic analysis because they clearly illustrate how data splits over time.

Front‑End Performance Optimization: 2018 JavaScript Costs and Tools https://juejin.im/entry/5b849efde51d4538e018f90c In modern front‑end development, performance bottlenecks still lie in JavaScript, and the JavaScript cost in projects keeps growing. This article details JavaScript overhead, its causes, and provides corresponding performance‑optimization tools and methods. It’s a long read, but you’ll gain a lot of useful information. Also see: Front‑End Performance Checklist.

Conversational Semantics https://alistapart.com/article/conversational-semantics As Alexa, Cortana, Siri, and even customer‑support chat bots become the norm, we have to start carefully considering not only how our content looks but how it could sound. We can—and should—use HTML and ARIA to make our content structured, sensible, and most importantly, meaningful.

Super‑Powered Grid Components with CSS Custom Properties https://css-tricks.com/super-power-grid-components-with-css-custom-properties/ Grid is neither a substitute for flexbox nor vice versa. In fact, using a combination of the two gives us even more power when building components.

Programmatically Create Images with the CSS Paint API https://www.sitepen.com/blog/2018/08/27/programmatically-create-images-with-the-css-paint-api/ The CSS Paint API is a modern web‑platform feature that lets you programmatically create images in JavaScript, which are then rendered to the page when referenced by CSS. You create images using the Canvas API, an API you may already be familiar with.

Dweb: Building Cooperation and Trust into the Web with IPFS https://hacks.mozilla.org/2018/08/dweb-building-cooperation-and-trust-into-the-web-with-ipfs/ In this series we cover projects that explore what is possible when the web becomes decentralized or distributed. These projects aren’t affiliated with Mozilla, and some of them rewrite the rules of how we think about a web browser. What they have in common: they are open source, open for participation, and share Mozilla’s mission to keep the web open and accessible for all.

Why Is a Java Guy So Excited About Node.js and JavaScript? https://blog.sourcerer.io/why-is-a-java-guy-so-excited-about-node-js-and-javascript-7cfc423efb44 Shouldn’t someone who worked 10+ years in the Java SE team at Sun Microsystems bleed Java bytecodes and be instantiating abstract interfaces until the last breath? For this former Java SE team member, learning the Node.js platform in 2011 was a breath of fresh air. After being laid off from Sun in January 2009 (just prior to the Oracle buyout), I learned about and became hooked on Node.js.

Node.js and the “HashWick” Vulnerability https://nodesource.com/blog/node-js-and-the-hashwick-vulnerability This week, veteran Node.js core contributor and former Node.js TSC member Fedor Indutny published an article on his personal blog detailing a newly discovered vulnerability in V8. Named HashWick, this vulnerability will need to be addressed by Node.js, but has not yet been patched. This article covers the details of the disclosure yesterday and explains some of the technical background. Since a patch for Node.js is not yet available, I will also present some mitigation options for users and discuss how this vulnerability is likely to be addressed by Node.js.

Node.js (TypeScript) on Heroku https://codeburst.io/node-js-typescript-on-heroku-a3ac5a62cf66 Revisiting Node.js on Heroku with TypeScript in mind.

When to Use What: REST, GraphQL, Webhooks, & gRPC https://nordicapis.com/when-to-use-what-rest-graphql-webhooks-grpc/ To help API developers make sense of which API design style to use and for what situation, let’s look at REST within the context of three other options – gRPC, GraphQL, and Webhooks. We’ll offer real‑world examples of REST, GraphQL, gRPC, and Webhooks in practice.

---

Originally written by Ping Xia (平侠) and published in Chinese on Web技术周刊 (Web Tech Weekly). Translated and adapted for DriftSeas with permission.