3.1-en

周报封面53.jpg

Frontend+ Weekly No.7: WebAssembly architecture for Go, React Suspense, Redesigning Redux

The best articles, links and news related to Frontend Development, and more, delivered once a week. All reference in this issue are gathered from Medium, Hacker News, Reddit,Twitter, MyBridge, etc.

More Issues can be found in Frontend+ Weekly Repository.

News

  • WebAssembly architecture for Go: 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.

  • Announcing Flutter beta 1: Build beautiful native apps: as part of Mobile World Congress 2018, the first beta release of Flutter is announced. Flutter is Google's new mobile UI framework that helps developers craft high-quality native interfaces for both iOS and Android. 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.

  • PhantomJS: Archiving the project, suspending development: Due to the lack of active contribution, PhantomJS will be archived soon and stop the development. PhantomJS version 2.1.1 will remain the last known stable release until further notice. Chrome and Firefox gaining headless modes is the ultimate goal Phantom could've achieved, but it served its purpose very well, while it was needed. Thanks & Goodbye.

Tutorial

  • Google releases machine learning course: As part of Google’s transition into an AI first world, the company wants to widely open up this technology. Its latest initiative involves a new website with a number of resources, as well as a previously internal online learning course. “Learn with Google AI” is a new educational addition to a site originally announced at the IO developer conference last year. In recent years, the company has repeatedly stated that its goal is to democratize AI and make its tool available for everyone. More changelogs can be found in this.

  • Exploring ES2018 and ES2019: This book is about two versions of JavaScript: ECMAScript 2018 and ECMAScript 2019.

  • A Walkthrough of that React Suspense Demo: The Async React demo at JSConf Iceland lived up to the hype: Time Slicing and React Suspense are on the way! In this walkthrough of the 300ish line Movie Search demo, we learn the various aspects of the React Suspense API: simple-cache-provider.SimpleCache, simple-cache-provider.createResource, ReactDOM.unstable_deferredUpdates, etc. More changelogs can be found in this.

Engineering Practices

  • Lesser known CSS quirks & advanced tips: Below you’ll find some of the weirdest CSS features, along with tips and tricks for advanced CSS users. Another practices for CSS is 30 Seconds of CSS, a curated collection of useful CSS snippets you can understand in 30 seconds or less. More changelogs can be found in this.

  • frontend case studies: Articles like “Building a simple todo list with [framework or technology name]” won't teach you how that framework or technology solves real-world problems and works at a large scale. This document is a curated list of technical talks and articles about real-world enterprise frontend development. More changelogs can be found in this.

Under the hood

  • Didact Fiber: Incremental reconciliation: This is a really nice deep dive into a sketch of Fiber implementation. Didact is a DIY guide to build your own React, in this post we are going to rewrite most of the code from the didact series to follow React 16 new architecture. We’ll try to mirror the structure, variables and function names from the React codebase. More changelogs can be found in this.

  • Redesigning Redux: 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? s the popularity of Redux deserved? Why or why not? ould we make a better state management solution? If so, how? More changelogs can be found in this.

  • Tracing from JS to the DOM and back again: 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. More changelogs can be found in this.

OpenSource

  • Pandora.js:Pandora.js is a Manageable, Measurable and Traceable Node.js Application Manager represented by Alibaba powered by TypeScript. As a consequence of years of experiences on enterprise Node.js applications management, Midway team from Alibaba open-sourced Pandora.js finally. It is an application manager integrates many capabilities like monitoring, debugging, resiliency.

  • just-dashboard: just-dashboard can generate dashboards using YAML or JSON files. As your dashboard is just data, you can generate it instead of repeating yourself. You can do that by generating the YAML or JSON file yourself, or you can use jq queries in your YAML file. And one with a dashboard that contains a component that can fetch the data from other other gist and turn it into 3 different charts.

  • prompts: Lightweight, beautiful and user-friendly interactive prompts. prompts has no big dependencies nor is it broken into a dozen tiny modules that only work well together, and uses layout and colors to create beautiful cli interfaces..

  • filepond: A Flexible and Fun JavaScript File Upload Plugin.