FEX 技术周刊 - 2019/07/29

深阅读

The Complete Introduction to React
https://jscomplete.com/learn/complete-intro-react
React is defined as a JavaScript library for building user interfaces. Let’s start by talking about the two different parts of this definition. React is a JavaScript “library”. It is not exactly a “framework”. It is not a complete solution and you will often need to use more libraries with React to form any solution. React does not assume anything about the other parts in any solution.
另附：useHooks - Easy to understand React Hook recipes.

Mithril.js 2: A JavaScript Framework for Building Brilliant Applications
https://mithril.js.org/
Mithril is a modern client-side JavaScript framework for building Single Page Applications. It’s small (< 10kb gzip), fast and provides routing and XHR utilities out of the box.

Practical Ways to Write Better JavaScript
https://dev.to/taillogs/practical-ways-to-write-better-javascript-26d4
I don’t see enough people talking about practical ways to improve at JavaScript. Here are some of the top methods I use to write better JS.

Monorepos and npm
https://blog.npmjs.org/post/186494959890/monorepos-and-npm
Splitting a large, monolithic codebase into small, encapsulated modules is usually good practice from an architectural perspective. Modularization is useful for everything from microservices to libraries of reusable components. However, it can also be a nightmare from a publishing and source code management perspective. Monorepos are a popular solution to this problem. Instead of one code repository per module, you put all modules in the same code repository. This “monorepo” is then the only thing a developer needs in order to do development with your application. Discovery, access control, and versioning are all simpler by virtue of everything being in the same place.

领域驱动设计在前端中的应用
https://github.com/Vincedream/ddd-fe-demo
本篇文章我们以一个很有趣的现象开头，结合有问题的代码分析出前端开发过程中遇到的困难，接着提出了领域驱动设计，结合其实践，逐一解决了之前遇到的困难，注意，上文实践的领域驱动结构并不是完全按照 Evans 在《领域驱动设计》书中提出的结构，因为该书中的结构更适合后端的实践，而在前端中，我们提取了书中部分优良的设计，与实际的前端开发场景进行结合而总结出上述结构，当然读者可以对其结构进一步的改造、优化，也期待读者与我进行交流，文中出现的错误欢迎指正。领域驱动设计有效地降低了项目的复杂度，分层的结构让各功能代码职责分明，在前端中将其业务逻辑代码逐一分层，与视图层解耦，做到了真正的业务逻辑复用，在代码的可读性、可维护性上也有了质的提升。在业务上也让开发者更融入整个项目，加深了开发者对业务的理解，能够共同的促进业务的进步。

前端离线化探索
http://www.alloyteam.com/2019/07/web-applications-offline/
在这个流量日益白菜价，不断提及云端计算、5g 网络的时代，有人觉得，离线已经完全没有必要。谈及离线，仿佛想到的是深海老林，荒无人烟之处。事实上，离线离我们的生活很近，也非常频繁。高速公路、地铁隧道、楼道角落，以及诸多日常信号不稳定区域，这些场景每天都有大量用户经过，每天有成千万用户频繁因为网络问题，心底里吐槽抱怨过我们的应用，断网离线并非我们的错，但我们是否能够从用户体验的角度，尝试改善他们在进入弱网或无网络状态时的焦虑情绪呢，从而给产品带来更正向的体验收益，提升用户留存与口碑。

Serverless，将给前端发展带来大变革的技术
https://mp.weixin.qq.com/s/ooX7uMFjxFfSai9URo6kYw
前端在发展，后端也在发展，在分层和模块划分上更加的粒度化，微服务化。微服务的接口不再是面向页面，前端的接口调用变得复杂了，所以需要在微服务和前端中间，加了一个 BFF 层，全称（backend for frontend），由这一层对接口进行聚合、裁剪后，再输出给前端。而这层不是后端本质工作，距离前端比较近，关系更大一些，所以前端工程师很自然选择了 Node.js 来实现。这也是当前 Node.js 在服务端比较广泛的应用。可以看到，每一次前端开发模式的变化，都因为某个变革性技术的出现。先是 AJAX，然后是 Node.js。那么下一个变革性的技术是什么？不言而喻，就是 Serverless。

重构支付宝小程序构建流程有感
https://zhuanlan.zhihu.com/p/74381415
本文作者负责了支付宝小程序「构建」流程的重构工作，在重构过程中深挖了许多知识点，尽数浓缩在这篇五千字长文中，通篇读完绝对能带给你满满的干货！P.S.: 我们假定你已经了解支付宝小程序、Webpack 以及前端构建相关概念。以下为正文。

GraphQL-BFF：微服务背景下的前后端数据交互方案
https://www.weibo.com/ttarticle/p/show?id=2309404398215846821987
本文将介绍我们对 GraphQL 所作的考察、探索、权衡、技术选型与设计等多方面的内容，希望能给大家带来一些启发。

知乎已读服务的前生今世与未来
https://mp.weixin.qq.com/s/1VOSLYp6kM0bNcvDAUlg3w
对于很多大型网站来说，一些不起眼的小功能反而是实现的难点。对于知乎来说，已读服务会随着用户量和内容数量的增长而平方级增长，而且响应时间要求很短，因此是一个有实现难度的系统。本文作者介绍了知乎已读服务的架构设计和演进过程，并对很多技术取舍做了深入剖析，十分值得阅读。

Browsers are pretty good at loading pages, it turns out
https://carter.sande.duodecima.technology/javascript-page-navigation/
I think it’s best to build small, simple, standards-based web pages. Browser developers are really good at their jobs, and they’ve spent a lot of time on features like progressive rendering that help your sites feel fast without any effort on your part. It’s not worth it to try and go behind their backs—premature optimizations like client-side navigation are hard to build, don’t work very well, will probably be obsolete in a couple years, and make life worse for a decent portion of your users.

When a rewrite isn’t: rebuilding Slack on the desktop
https://slack.engineering/rebuilding-slack-on-the-desktop-308d6fe94ae4
A new version of Slack is rolling out for our desktop customers, built from the ground up to be faster, more efficient, and easier to work on.

How Serverless Is Changing Security: The Good, Bad, Ugly, and How to Fix It
https://medium.com/@distillerytech/how-serverless-is-changing-security-the-good-bad-ugly-and-how-to-fix-it-3e8cad014fc4
Serverless fundamentally changes security. Sometimes for the better. Sometimes for the worse. Sometimes a little in the middle. To keep data and applications secure in our increasingly serverless world, startups and enterprises of all sizes need to understand what’s different, why it matters, and what they should do to protect themselves.

Making Sense of the Metadata: Clustering 4,000 Stack Overflow tags with BigQuery k-means
https://stackoverflow.blog/2019/07/24/making-sense-of-the-metadata-clustering-4000-stack-overflow-tags-with-bigquery-k-means/
How would you group more than 4,000 active Stack Overflow tags into meaningful groups? This is a perfect task for unsupervised learning and k-means clustering — and now you can do all this inside BigQuery. Let’s find out how.

Scaling Static Analyses at Facebook
https://cacm.acm.org/magazines/2019/8/238344-scaling-static-analyses-at-facebook/fulltext
Static analysis tools are programs that examine, and attempt to draw conclusions about, the source of other programs without running them. At Facebook, we have been investing in advanced static analysis tools that employ reasoning techniques similar to those from program verification. The tools we describe in this article (Infer and Zoncolan) target issues related to crashes and to the security of our services, they perform sometimes complex reasoning spanning many procedures or files, and they are integrated into engineering workflows in a way that attempts to bring value while minimizing friction.

Forget silicon - SQL on DNA is the next frontier for databases
https://www.zdnet.com/article/forget-silicon-sql-on-dna-is-the-next-frontier-for-databases/
A couple of years back, even researchers would wave off using DNA to store data as something too futuristic to have any practical value. Today, you can extend PostgreSQL with the right software and bio-chemical modules, and run SQL on DNA.

Why Rust for safe systems programming
https://msrc-blog.microsoft.com/2019/07/18/we-need-a-safer-systems-programming-language/
https://msrc-blog.microsoft.com/2019/07/22/why-rust-for-safe-systems-programming/
In this series, we have explored the need for proactive measures to eliminate a class of vulnerabilities and walked through some examples of memory safety issues we’ve found in Microsoft code that could have been avoided with a different language. Now we’ll peek at why we think that Rust represents the best alternative to C and C++ currently available.

Fast Software, the Best Software
https://craigmod.com/essays/fast_software/
On the benefits of performant software, and how it affects user perception of engineering quality and overall usability

新鲜货

Decades-Old Computer Science Conjecture Solved in Two Pages
https://www.quantamagazine.org/mathematician-solves-computer-science-conjecture-in-two-pages-20190725/
Apaper posted online this month has settled a nearly 30-year-old conjecture about the structure of the fundamental building blocks of computer circuits. This “sensitivity” conjecture has stumped many of the most prominent computer scientists over the years, yet the new proof is so simple that one researcher summed it up in a single tweet.

Announcing composable multi-threaded parallelism in Julia
https://julialang.org/blog/2019/07/multithreading
Software performance depends more and more on exploiting multiple processor cores. The free lunch from Moore’s Law is still over. Well, we here in the Julia developer community have something of a reputation for caring about performance. In pursuit of it, we have already built a lot of functionality for multi-process, distributed programming and GPUs, but we’ve known for years that we would also need a good story for composable multi-threading. Today we are happy to announce a major new chapter in that story. We are releasing a preview of an entirely new threading interface for Julia programs: general task parallelism, inspired by parallel programming systems like Cilk, Intel Threading Building Blocks (TBB) and Go.

Announcing Yaegi - Yet Another Go Interpreter
https://blog.containo.us/announcing-yaegi-263a1e2d070a
Yaegi is an open source project developed by Containous, (the company behind Traefik and TraefikEE), to bring executable Go scripts, embedded plugins, interactive shells, and instant prototyping on top of the Go runtime.
另附：GopherCon 2019 - Simple, Portable and Efficient Graphical Interfaces in Go.

Mozilla Mixed Reality
https://mixedreality.mozilla.org/firefox-reality/
Firefox Reality serves you the very best immersive games, videos, environments, and experiences from around the Web.

Flutter for web early adopter program now open
https://medium.com/flutter/flutter-for-web-early-adopter-program-now-open-9f1fb146e4c4
we are opening an exclusive program for companies, design agencies and startups who are ready to build in earnest on Flutter for the web. We have a limited number of slots available by application to those who are ready to engage with us directly on a first wave of production Flutter web applications.

Tabulator - The easy to use, fully featured, interactive table JavaScript library
http://tabulator.info/
Tabulator allows you to create interactive tables in seconds from any HTML Table, JavaScript Array, AJAX data source or JSON formatted data. Simply include the library in your project and you’re away!

React Chaos
https://github.com/jchiatt/react-chaos
React Chaos is currently a higher order component that will randomly throw Errors in the component it wraps. The likelihood for the error to throw is based on a level you set when you wrap a component.

Moveable
https://daybrush.com/moveable/
Moveable is Draggable! Resizable! Scalable! Rotatable!

Vuetify 2.0- Material Design Component Framework
https://github.com/vuetifyjs/vuetify/releases/tag/v2.0.0
Vuetify is the #1 Material framework and has been in development since 2016. The goal of the project is to provide users with everything that is needed to build rich and engaging web applications using the Material Design specification and Vue. It accomplishes that with a consistent update cycle, Long-term Support (LTS) for previous versions, responsive community engagement, a vast ecosystem of resources and a dedication to quality components.

RobotJS - Node.js Desktop Automation
https://github.com/octalmage/robotjs
The only Node.js first Desktop Automation Library. The first of its kind. Automate Anything: Control the mouse, keyboard, and read the screen. Easy to use: Prebuilt binaries allow you to install without compiling! Cross Platform: Mac, Windows, and Linux supported!

Jay - Supercharged JavaScript REPL
https://github.com/nikersify/jay
Jay is a terminal-based JavaScript REPL focused on increasing prototyping speed and productivity. It’s packed with modern REPL features, whilst also striving to maintain a familiar REPL vibe.

Nave - Virtual Environments for Node
https://github.com/isaacs/nave
Switch out your node version and global npm install space in one command. Supports named environments. Uses subshells by default so that you can ^D or exit out of an environment quickly. No need to edit .bashrc or .profile, just install and go.

Outline: A Node-Powered Wiki System for Teams
https://github.com/outline/outline
The fastest wiki and knowledge base for growing teams. Beautiful, feature rich, markdown compatible and open source.

CesiumJS - Geospatial 3D Mapping and Virtual Globe Platform
https://cesiumjs.org/
An open-source JavaScript library for world-class 3D globes and maps.

Game Source Code Collection
https://archive.org/details/gamesourcecode
This is a collection of computer game source code. The majority of these titles were originally released as commercial products and the source code was made available to the public at a later time.

Space Engine – the universe simulator
http://spaceengine.org/
SpaceEngine is a realistic virtual Universe you can explore on your computer. You can travel from star to star, from galaxy to galaxy, landing on any planet, moon, or asteroid with the ability to explore its alien landscape. You can alter the speed of time and observe any celestial phenomena you please.

Fork
https://fork.dev/
A fast and friendly git client for Mac and Windows

Puffer
https://puffer.stanford.edu/
Stream live TV in your browser. There’s no charge. You can watch U.S. TV stations affiliated with the NBC, CBS, ABC, PBS, FOX, and Univision networks.

Ananas Analytics
https://ananasanalytics.com/
Connect data from anywhere. Transform, analyze, and visualize with simple steps. Designed for non-technical users at the first place. It keeps the technical barriers very low by providing a drag and drop interface to build both ETL and analysis.

Google AI Education Resources
https://ai.google/education/
Whether you’re just learning to code or you’re a seasoned machine learning practitioner, you’ll find information and exercises to help you develop your skills and advance your projects.

设计

Design tools are holding us back
https://uxdesign.cc/design-tools-are-holding-us-back-1aca266b333e
We need to stop treating UI design like art. Yes, it can be pretty. Yes, it a visual medium. Yes, there is an art to making digital products. But it’s not artwork. I’m wading into territory that would merit a separate article, but the aesthetics of your UI should not come before their usability. We need our tools to stop using manipulation methods that emphasize looks over structure. We need better ways to make real products, not pretty mockups.

Twitter’s Redesign Isn’t About You
https://onezero.medium.com/twitters-redesign-isn-t-about-you-3dd710b0f9e0
It’s about making a notoriously slow-footed company faster on its feet — which could eventually pay off for its users.
另附：The Mutable Web - Twitter recently rolled out a redesigned UI and I don’t love it.

Quantifying UX: Positioning the clone button
https://about.gitlab.com/2019/07/26/quantifying-ux-positioning-of-the-clone-button/
We wanted to move the clone button on the project overview page. Here’s how user testing helped us make the right choices.

百度高级感设计语言再荣获意大利A`Design大奖与德国红点奖
http://mux.baidu.com/1200
小度NIRO最大的突破在于全新的交互设计。人机探索实验室为这款互动机器人打造了独处态、交互态、主动态三种交互状态。比如，小度NIRO可以根据时区、环境天气、用户作息规律等多维度，自行决定作出哪个独处态，如打盹、发呆、自嗨、玩耍等十几种状态；通过360°环形麦克风阵列和单目摄像头人脸图像识别，小度NIRO可以实现在嘈杂环境下多人的免唤醒语音交互；最突出的是，通过情景感知技术，互动机器人可以准确理解用户所处状态和身处环境，评估影响因素，选择满足用户此时所需的服务类型，进而采取适合的主动交互模型与用户互动，提供服务并表示关心。

谷歌设计团队发布了一款动效神器，让 UI 和动效无缝打通！
https://www.uisdc.com/google-design-aeux
Google 设计团队为了更好地推进 UI 和动效设计，自己开发过不少新的工具，打通 Sketch2AE 是其中之一，如今的 AEUX 也是为了相似的目的而存在的一个全新升级的动效工具~

产品及其它

Google 的 AI 原则公布一年了，Jeff Dean 汇报了成果
http://www.geekpark.net/news/245044
在 2018 年的初夏，Google 发布了这一系列原则，其中的条目直指近年来人们对于人工智能技术应用伦理的担忧，其中包括了：对社会有益（Be socially beneficial）、避免建立或加剧不公与偏见（Avoid creating or reinforcing unfair bias）、保障建立与测试中安全性（Be built and tested for safety）、对人类负责（Be accountable to people）、建立并体现隐私保护原则（Incorporate privacy design principles）、支持并鼓励高标准的技术品格（Uphold high standards of scientific excellence）、提供并保障上述原则的可操作性（Be made available for uses that accord with these principles）一年之后，那些集中体现了上述原则的典型应用案例被 Google 归纳在了名为 AI for Social Good 的项目之下，其背后的逻辑是一家技术公司如何将公司使命、技术价值观，和技术先进性合而为一。

Bringing the power of machine reading comprehension to specialized documents
https://www.microsoft.com/en-us/research/blog/bringing-the-power-of-machine-reading-comprehension-to-specialized-documents/
Microsoft researchers are developing a transfer learning–based approach for adapting general question answer models to documents in specialized domains. Their new demonstration system (above) can answer questions against Welcome to Canada, the Canadian government’s guidebook for new immigrants.

不击穿这个点，你99%的努力都白费
https://mp.weixin.qq.com/s?__biz=MzUyMDQ5NzI5Mg==&mid=2247509780&idx=1&sn=fa80471768b35876e33d5493445b89f6
一个经济体，要想基业长青，你必须的依存条件是越多越好还是越少越好？很多人会认为，投入的资源越多越好，拿钱、拿人砸就行。其实不然。要想存活，你依赖的条件越少越好。那么，少到多少才合适呢？少到用小的要素完成某一件事情，一定不能增加额外要素（奥卡姆剃刀原理）的程度。奥卡姆剃刀原理用到极致，就是“简一律”，即任何一个理性系统，它都运行在一条基本原理之上。这时候也许你会问了，简一律和商业有什么关系？简一律在商业中的应用表现为创业的组合，也就是在创业成败因素中，对你最重要的、最致命的要素——单一要素。

重新定义 To B 生意
https://mp.weixin.qq.com/s?__biz=MzA5MTAxNDg0OQ==&mid=2247483780&idx=1&sn=32419e43df937480779fc292948f286b
2018年开始，2B 又火了，为什么说又，因为每过几年就会火一阵子。2B 方向的创业一直存在，最早在香港上市的阿里巴巴，就是一家 100% 的 2B 企业，2012 年找钢网的出现也让 VC 行业眼前一亮，原来这么传统的行业也可以在线化。美国市场 VC 的投资一半以上都发生在企业服务市场，以此为目标，中国的 2B 项目还有巨大的成长空间。另一方面，在中国的二级市场上，几乎清一色的都是 2B企业，却几乎没有 VC 们的标的。同样是面向企业的服务，为什么会有这么大的差异，VC 们所说的 2B 是有特定的含义吗？到底哪些企业是 2B 企业？当我们谈论 2B 时，我们是在谈论什么？

对数据可视化有兴趣的可以阅读由 AntV 带来的 墨者修齐 2019-07-29·ChinaVis 2019 全程记录合集

– THE END –