FEX 技术周刊 - 2019/08/19

深阅读

V8 release v7.7
https://v8.dev/blog/v8-release-77
Performance (size & speed): Lazy feedback allocation, Scalable WebAssembly background compilation, Stack trace improvements. JavaScript language features: The Intl.NumberFormat API.

Introducing the New React DevTools
https://reactjs.org/blog/2019/08/15/new-react-devtools.html
A lot has changed in version 4! At a high level, this new version should offer significant performance gains and an improved navigation experience. It also offers full support for React Hooks, including inspecting nested objects.

JavaScript and Node Testing Best Practices
https://github.com/goldbergyoni/javascript-testing-best-practices
Almost 50 best practices divided into categories (backend, frontend, CI, etc.) complete with code examples. Not just the basics, it digs into areas like visual regression, property-based testing, and contract testing, too.

useReducer + useContext for easy global state without libraries
https://swizec.com/blog/usereducer-usecontext-for-easy-global-state-without-libraries/swizec/9182
Ok so global state management, how do you do it? You grab Redux or MobX, or maybe Unstated or Constate and you’re done. Right? All those libraries give you a global store to put your data, allow every component to access that state, and manage re-renders. You get some way of updating that state and life is good. Sometimes there’s extra features. But what if you don’t want to learn yet another library? You just wanna share some state between a bunch of components. What then?

The history and legacy of jQuery
https://blog.logrocket.com/the-history-and-legacy-of-jquery/
jQuery may have fallen somewhat out of favor in web development, but it still powers an estimated 74 percent of sites and paved the way for modern web frameworks. (In recent polls we’ve done, many people are still actively chosing to use it too. Long live jQuery!)

[译]愿未来没有 Webpack
https://juejin.im/post/5d4bcdb7e51d453b386a62c6
作为一名身处 2019 年的 JavaScript 开发者，我也有同感。我们明明已经拥有了这个崭新的 JavaScript 模块系统（ESM），它可以直接在 Web 环境中运行。可每次开发点什么，我们还是得用打包工具处理一下。这到底为什么？在过去的几年里，JavaScript 打包界的炙手可热已经从只优化生产环境转变到了逢开发必打包的程度。不论你喜欢与否，都很难否认打包工具给 Web 开发带来了变态级别的复杂性，而 Web 开发明明是一个一贯以源码可见和轻松上手的精神为荣的领域啊。@pika/web 试图将 Web 开发者从打包地狱中解救出来。都 2019 年了，你使用打包工具应该是因为你想要用，而不是因为你不得不用

重塑前端工作流-Lugia正式版发布
https://zhuanlan.zhihu.com/p/77255855
从 2018 年 5月建立第一个 Lugia 相关的仓库起，时隔一年多，22万+的代码量，3500+次的提交，Lugia 终于迎来了它的第一个正式版本 1.1.0。在今年年初，我们已经在内部发布了技术预览版 1.0.0，以验证我们的整套大前端解决方案，又经过半年多的时间打磨，我们决定在社区分享我们的成果。Lugia 是一整套面向云原生化大前端生态解决方案。我们希望把交互设计与前端应用代码开发有机的融为一体，形成一种跨时代的大前端生态技术规范：Lugia Design; LugiaX; Lugia Web; Lugia Mega：标准、高效、开箱即用的前端可视化设计开发工具。Lugia Mega 是一个无需环境搭建、快速上手的跨平台桌面应用（Mac 和 Windows）。研发制定了元信息中间语言描述规范LugiaD，为开发人员提供可视化交互设计、屏蔽底层开发工具链和底层前端开发框架（React OR VUE）、以及元信息注册式的开发方式。帮助设计师、产品经理快速设计产品，成果可以直接让开发人员使用。Lugia Mega 贯穿了整个项目的生命周期，让您极速构建前端应用、轻松管理所有项目。

云凤蝶中台研发提效实践
https://zhuanlan.zhihu.com/p/78425921
最近我们在蚂蚁内部发布了全新云凤蝶 2.0，把产品的重点由 H5 搭建彻底转向了中台方向。使用云凤蝶，快速制作高品质中台应用。我们目前聚焦于以下三个方面来服务中台业务：

• 降门槛 让更多人进的来参与中台建设
• 提效 是否可以做到 10 倍提效？
• 提升体验 设计规范自动化落地，默认好用
  本文主要探讨云凤蝶对于中台提效的理解，从研发模式的角度来看，我们对于十倍提效的达成思路。另附：我的一年中台实战录。

Visual Studio Code有哪些工程方面的亮点
https://zhuanlan.zhihu.com/vs-code
Visual Studio Code（VS Code）近年来获得了爆炸式增长，成为广大开发者工具库中的必备神器。它作为一个开源项目，也吸引了无数第三方开发者和终端用户，成为顶尖开源项目之一。它在功能上做到了够用，体验上做到了好用，更在拥有海量插件的情况下做到了简洁流畅，实属难能可贵。我是VS Code用户，同时也为它开发插件，插件市场里的众多Java插件基本都是我们团队的作品，所以我在日常工作中观察到不少VS Code在工程方面的亮点，下面就来逐一探讨。

大BU级别的”前后端分离”实践
https://segmentfault.com/a/1190000020047069
随着部门内前端的业务线和平台越来越多，前端的职责也逐渐加重，随之而来的就是各种问题和挑战。目前前端团队共有31个人，共负责15+业务/项目和平台，前端项目的总PV最低也在2000万以上，由于是工具类型的应用，MAU（月活用户）也有1亿以上。面对这么大的用户体量和业务压力，团队在开发和维护的过程中也逐渐遇到了各种问题。首先是基础设施的问题，没有完善且统一的标准规范和设施，导致每个项目的技术栈和实现思路各不相同，功能复用率不高。在成员提升方面，这么多的成员如何让他们在技术和解决问题的能力上都有所提升。另外还有其他角色更加关注的效能提升的问题，包括前端开发效率的整体提升，以及上下游协作效率的提升。最后是整体稳定性方面的保证，需要在第一时间发现错误和体验相关的问题，这又是一个很重要的问题。另附：技术架构与组织结构的演变路径。

是时候了，无外链的CSS开发策略
https://www.zhangxinxu.com/wordpress/2019/08/css-no-external-link/
想想看现在都什么年代了，我家小朋友都已经会打酱油了，CSS中的一些开发策略也需要发生改变了。如果你的项目不需要兼容IE8浏览器，则试试贯彻下面这条CSS开发策略。CSS代码中无外链！也就是不要有任何的http/https请求从CSS文件中发出。

The (Upcoming) WordPress Renaissance
https://www.smashingmagazine.com/2019/08/upcoming-wordpress-renaissance/
Since its release 8 months ago, Gutenberg has been greatly improved, offering a user experience much richer than anything that was possible in WordPress. Let’s take a look at its latest developments, and where it is heading to.

The Differing Perspectives on CSS-in-JS
https://css-tricks.com/the-differing-perspectives-on-css-in-js/
Some people outright hate the idea of CSS-in-JS. Just that name is offensive. Hard no. Styling doesn’t belong in JavaScript, it belongs in CSS, a thing that already exists and that browsers are optimized to use. Separation of concerns. Anything else is a laughable misstep, a sign of not learning from the mistakes of the past (like the <font> tag and such.) Some people outright love the idea of CSS-in-JS. The co-location of templates and functionality, à la most JavaScript frameworks, has proven successful to them, so wrapping in styles seems like a natural fit. Vue’s single file components are an archetype here. 另附：You Don’t Need CSS-in-JS: Why (and When) I Use Stylesheets Instead

The traits of serverless architecture
https://www.thoughtworks.com/insights/blog/traits-serverless-architecture
This article doesn’t aim to help you understand all of the topics in-depth but to give you a general overview of what you are in for. These are the traits of serverless architecture defined in this article: Low barrier-to-entry, Hostless, Stateless, Elasticity , Distributed, Event-driven.

The (not so) hidden cost of sharing code between iOS and Android
https://blogs.dropbox.com/tech/2019/08/the-not-so-hidden-cost-of-sharing-code-between-ios-and-android/
Although writing code once sounds like a great bargain, the associated overhead made the cost of this approach outweigh the benefits (which turned out to be smaller than expected anyway). In the end we no longer share mobile code via C++ (or any other non-standard way) and instead write code in the platform native languages. In addition we want our engineers to have a delightful experience and to be able to contribute back to the community. This is why we made the decision to align our practices with industry standards.

Data Hub: A Generalized Metadata Search & Discovery Tool
https://engineering.linkedin.com/blog/2019/data-hub
As the operator of the world’s largest professional network and the Economic Graph, LinkedIn’s Data team is constantly working on scaling its infrastructure to meet the demands of our ever-growing big data ecosystem. As the data grows in volume and richness, it becomes increasingly challenging for data scientists and engineers to discover the data assets available, understand their provenances, and take appropriate actions based on the insights. To help us continue scaling productivity and innovation in data alongside this growth, we created a generalized metadata search and discovery tool, Data Hub.

Static Analysis at Scale: An Instagram Story
https://instagram-engineering.com/static-analysis-at-scale-an-instagram-story-8f498ab71a0c
This post is about how we’ve used linting and automated refactoring to help manage the scale of our Python codebase. In the next few weeks, we’ll share more details of other tools and techniques we’ve developed to manage other aspects of our codebase’s quality.

I wasn’t getting hired as a Data Scientist. So I sought data on who is
https://towardsdatascience.com/i-wasnt-getting-hired-as-a-data-scientist-so-i-sought-data-on-who-is-c59afd7d56f5
I wasn’t getting hired as a Data Scientist. So I sought data on who is. Instead of focusing on skills thought to be required of data scientists, we can look at what they have actually done before.

Python is eating the world: How one developer’s side project became the hottest programming language on the planet
https://www.zdnet.com/article/python-is-eating-the-world-how-one-developers-side-project-became-the-hottest-programming-language-on-the-planet/
Frustrated by programming language shortcomings, Guido van Rossum created Python. With the language now used by millions, Nick Heath talks to van Rossum about Python’s past and explores what’s next. 另附：Is Python Strangling R to Death?.

新鲜货

aiXcoder
https://www.aixcoder.com/#/
https://mp.weixin.qq.com/s/CjRp3zCYyk_LP4wqxhLPDw

智能编程助手：

• 智能代码提示她用强大的深度学习引擎，能给出更加精确的代码提示；
• 代码风格检查她有代码风格智能检查能力，帮助开发者改善代码质量；
• 编程模式学习她能自主学习开发者的编程模式，边用边学，越用越强；

MongoDB 4.2 is now GA: Ready for your Production Apps
https://www.mongodb.com/blog/post/mongodb-42-is-now-ga-ready-for-your-production-apps
Key highlights of MongoDB 4.2 include:

• Distributed Transactions
• On-Demand Materialized Views
• Wildcard Indexes
• MongoDB Query Language
• Retryable Reads and Writes

Highlights from Git 2.23
https://github.blog/2019-08-16-highlights-from-git-2-23/
The open source Git project just released Git 2.23 with features and bug fixes from over 77 contributors, 26 of them new. Here’s our look at some of the most exciting features and changes introduced since Git 2.22. 另附：Use GitHub Classroom with Canvas, Google Classroom, or your own tools、GitHub intern project: Localization for Learning Lab.

npm CLI Roadmap - Summer 2019
https://blog.npmjs.org/post/186983646370/npm-cli-roadmap-summer-2019
Motion on the npm CLI project has been accelerating, and we’re now moving forward with a clear direction and vision. This document outlines what’s in store for the remainder of the npm v6 line, and what to expect in v7 and v8.

Announcing the Ionic React Release Candidate!
https://ionicframework.com/blog/announcing-ionic-react-release-candidate/
Ionic React RC marks the first major release of our vision to bring Ionic development to more developers on other frameworks. This was made possible by Ionic v4.0, which was completely re-written from the ground up focusing on web standards and not dependent on a particular framework. Ionic v4.0 makes it possible for us to target many frameworks while still having our core components be a single code base shared across all these frameworks.

Divjoy The React codebase generator
https://divjoy.com/
Use our free web-based tool to create the perfect codebase for your next project.

• Choose your stack: UI Kit, Framework, Authentication.
• Choose a template: Everything you need is included. Marketing pages, contact forms, pricing, faq, authentication, client-side routing. Even the forgot password flow works. You’ll never need to build that stuff again.

Lottie for Web
https://github.com/airbnb/lottie-web
Lottie is a mobile library for Web, and iOS that parses Adobe After Effects animations exported as json with Bodymovin and renders them natively on mobile! For the first time, designers can create and ship beautiful animations without an engineer painstakingly recreating it by hand.

Planet - Imaging the entire Earth, every day
https://nbremer.github.io/planet-globe/
The visual below shows the locations of the photos that were taken on January 25th, 2018 by Planet’s satellites (the white circles) which are continuously circling the Earth. The blue circle randomly picks a satellite to follow every few seconds. You can see some information about its location and speed (yes, that’s kilometers per second) in the lower right corner.

sqliterally - Lightweight SQL query builder
https://github.com/terkelg/sqliterally
SQLiterally makes it easy to compose safe parameterized SQL queries using template literals. Clauses are automatically arranged which means you can re-use, subquery and append new clauses as you like – order doesn’t matter. All queries are well formatted and ready to be passed directly to node-pg and mysql. Use SQLiterally as a lightweight alternative to extensive query builders like Knex.js or when big ORMs are over-kill.

Acorn
https://github.com/acornjs/acorn
A tiny, fast JavaScript parser, written completely in JavaScript.

NPKILL
https://github.com/voidcosmos/npkill
This tool allows you to list any node_modules directories in your system, as well as the space they take up. You can then select which ones you want to erase to free up space.

CutiePi tablet
https://cutiepi.io/index.html
CutiePi is an all-in-one Raspberry Pi tablet. Take your Raspberry Pi project, liberate it from the desk, and start creating wherever you go.

Anime4K
https://github.com/bloc97/Anime4K
Anime4K is a state-of-the-art*, open-source, high-quality real-time anime upscaling algorithm that can be implemented in any programming language, anywhere.

A Readable Specification of TLS 1.3
https://davidwong.fr/tls13/
The primary goal of TLS is to provide a secure channel between two communicating peers; the only requirement from the underlying transport is a reliable, in-order data stream. Specifically, the secure channel should provide the following properties: Authentication, Confidentiality, Integrity.

Ultimate Go
https://github.com/hoanhan101/ultimate-go
This repo contains my notes on learning Go and computer systems. Different people have different learning style. For me, I learn best by doing and walking through examples. Hence, I am trying to take notes carefully and comment directly on the source code, rather than writing up Markdown files. That way, I can understand every single line of code as I am reading and also be mindful of the theories behind the scene. In the mix, I also include links to other articles that I find helpful.

What is Paged Out!?
https://pagedout.institute/
Paged Out! is a new experimental (one article == one page) free magazine about programming (especially programming tricks!), hacking, security hacking, retro computers, modern computers, electronics, demoscene, and other similar topics. It’s made by the community for the community - the project is led by Gynvael Coldwind with multiple folks helping. And it’s not-for-profit (though in time we hope it will be self-sustained) - this means that the issues will always be free to download, share and print.

设计

白鸦 - 企业服务类产品的底层逻辑，和“有赞产品设计原则”
https://mp.weixin.qq.com/s/-kLQPDU-9337mN1ebjuYqA
有赞的《产品设计原则》，根据客户需求、有赞的使命和愿景、当前生态环境，以及我们所处的发展阶段拟定，它是每个有赞产品在设计过程中都要遵守的基本原则。我们还会定期对其进行优化和迭代。它是一个产品视角的原则，并非完整的市场、运营或者技术视角。在产品视角上，我们把产品设计过程分成了 4 个部分：产品定义、产品设计、产品研发、产品运营。

Cabana 3.0. Is it a bird, a plane, a Design System, or a UI Starter Kit?
https://medium.com/sketch-app-sources/cabana-3-0-is-it-a-bird-a-plane-a-design-system-or-a-ui-starter-kit-a61982352e77
A super-helpful tool when creating UIs inside of Sketch.

Future by Design
https://medium.com/microsoft-design/future-by-design-7f32e4d6b6d1
How Design Day 2019 helps designers in a business evolve into businesspeople who Design.

Information on Display: New Features and More Accessible Data Tables
https://medium.com/google-design/information-on-display-new-features-and-more-accessible-data-tables-8d4025ddcb57
Data tables display sets of similar information so that it’s easy to scan — often ordered in a hierarchical or alphabetical way that helps users find patterns and insights. A variety of interactive elements (like selecting rows and column sort) support a range of use cases demonstrated in our design guidance.

产品及其它

Get your work recognized: write a brag document
https://jvns.ca/blog/brag-documents/
There’s this idea that, if you do great work at your job, people will (or should!) automatically recognize that work and reward you for it with promotions / increased pay. In practice, it’s often more complicated than that – some kinds of important work are more visible/memorable than others. It’s frustrating to have done something really important and later realize that you didn’t get rewarded for it just because the people making the decision didn’t understand or remember what you did. So I want to talk about a tactic that I and lots of people I work with have used! This blog post isn’t just about being promoted or getting raises though. The ideas here have actually been more useful to me to help me reflect on themes in my work, what’s important to me, what I’m learning, and what I’d like to be doing differently. But they’ve definitely helped with promotions!

GitHub stars won’t pay your rent
https://medium.com/@kitze/github-stars-wont-pay-your-rent-8b348e12baed
It’s been a long time since I have written something here, but I don’t want to write articles for the sake of “keeping the blog alive”, screw that. Well, I finally have a story to tell. I finally launched the new version of Sizzy last month. It went from a simple web app to a full-fledged browser for designers and developers. I would say that it’s been a very exciting month, but actually, it’s been a bumpy ride for 2.5 years. I made a lot of mistakes and I learned a lot of lessons, so I wanted to share the entire story with you.

七年高速奔跑，字节跳动是靠什么文化机制运转起来的？
https://mp.weixin.qq.com/s/hc2y2nVGZLBw1XdlhCFqRg
一定程度上，字节跳动的管理成分里，除了谷歌开放坦诚的工作方式和Netflix强赋权的用人观，还有阿里的模式集权主义。它像一座巴别塔，以张一鸣为代表的公司高层，负责做出理性战略决策，公司其他组织快速进入执行轨道。字节跳动内部鲜少把员工的吐槽看成无理取闹。从传播学角度来看，它确实在“发布—反馈”机制中做到了信息多线流通，但他们内部更愿意把这一逻辑上升到践行公司价值观上——“ego小但格局大”。“ego小但格局大”并非字节跳动原创，但字节跳动把它用到了一种极致状态。在字节跳动全球30多个国家的办公室墙上都挂着同一组海报，其中一张海报的内容就叫“ego creates blind spots 自负制造盲点”。它脱胎于谷歌文化，ego代表自我，knowledge是知识，自我越小，知识越多，格局才越大。简单来说就是，别把自己看得太重，别搞办公室政治，多花点心思在能力提升和业务拓展上。

华为“鸿蒙”所涉及的微内核究竟是什么
https://mp.weixin.qq.com/s?__biz=MzIwMzA2NzI1Ng==&mid=2655158364&idx=1&sn=1958e29465e3af428f885bfc4ed1fa66
关于微内核的定义，这里有一份简单的描述：内核运行在内核态，只包含基本的多任务调度功能；其他系统服务都运行在用户态，包括文件系统，网络协议栈，甚至内存管理，驱动都是一个个独立的用户态进程，并相互做内存隔离。应用需要使用系统服务时，都通过IPC发送消息来使用其他用户态服务。而宏内核，用户应用是通过系统调用直接来使用系统服务。所以微内核，消息传递是基本形态。

对数据可视化有兴趣的可以阅读由 AntV 带来的 墨者修齐 2019-08-19·KeyLines Time Bar、地震可视化、艺术作品时序可视化

– THE END –