2019.12.02 - React过誉了吗

深阅读

Faster JavaScript Apps with JSON.parse()
https://www.bram.us/2019/11/25/faster-javascript-apps-with-json-parse/
Because the JSON grammar is much simpler than JavaScript’s grammar, JSON can be parsed more efficiently than JavaScript. This knowledge can be applied to improve start-up performance for web apps that ship large JSON-like configuration object literals (such as inline Redux stores).

When your dependencies break your software, wouldn’t you like them to fix it?
https://blog.angular.io/how-we-use-angular-at-the-gdf-cd17807a9bd2
We at Allianz Global Digital Factory (GDF) use the tooling of Angular to keep our ecosystem in sync. Our main asset is our user interface (UI) component library, that enables teams in Allianz to use ready made UI components for building their apps. The main techniques we use are Schematics and ng update. This is something already well established when using Angular itself (e.g., KLM story). Here we want to share our journey of utilizing such a tool stack for our Allianz ecosystem.

The Benefits of Orthogonal React Components
https://dmitripavlutin.com/orthogonal-react-components/
A key principle of a good design is the isolation of the logic that most likely will change: making it orthogonal. This makes your whole system flexible and adaptable to change or new features requirements. If the orthogonal principle is overlooked, you risk creating components that are tightly coupled and dependent. A slight change in one place might unexpectedly echo in another place, increasing the cost of change, maintenance and creating new features.

Storybook for design
https://medium.com/storybookjs/storybook-for-design-3ff761c579bf
How to integrate your favorite design tools with Storybook.

[译]React过誉了吗？
https://mp.weixin.qq.com/s/15b8jzfeakj5PUAkSBpoaw
当我也成长为老一代开发者，看过了那么多项目花开花谢，我再学习新技术时就不会把它们当成已有事物的终极解决方案了，而只会把它们看作是升级更新，并加入到我自己的知识库里。React 本身也不是全新的东西。它只是将 JavaScript、HTML 和 CSS 打包在一起的另一种途径。Angular 刚出来的时候用的也是这种方法，之前的 jQuery 也一样。业界永远都在追捧下一个热点，但最佳方法就是学习如何正确地编写代码，然后把这件事做好即可——因为不管现在的热点是什么框架、库、支架之类花哨的东西，都是无关紧要的。作为开发人员，你的水平取决于你能以多快的速度，凭借良好的编程基础来适应当前的需求和环境。

心性：架构师的修炼之道
https://mp.weixin.qq.com/s?__biz=MzA5MTAxNDg0OQ==&mid=2247484336&idx=1&sn=9c3f88d10f6ac6d28b21d5b043e65e85
怎么成为优秀的架构师？架构师的修炼之道究竟是什么？我的答案是：修心。心性，是架构师区别于一般软件工程师的地方。也是为什么他能够看到那么多人看不到的关键点的原因。架构师成长之旅，是心性修炼之旅。我们需要记得，并不是理解了架构思维的原则，就能够做好架构。架构之道，是虚实结合之道。理论与实践相结合。从实悟虚，从虚就实，运用得当方得升华。架构思维的感悟并不能一步到位，永远有进步的空间，需要我们在不断实践中感悟，升华自己的认知。

别让自己“墙”了自己
https://coolshell.cn/articles/20276.html
这篇文章就是要劝大家更为开放，让自己有更多的可能性，能到更高的层次，做更有价值的事，成为更强更好的人……当然，如果你觉得你只想做一个平凡人，也和本文并不冲突……另外你也不要觉得这篇文章是让你要成为一个精英，但你你一定要去摸高……这篇文章是告诉你一种面对人生的思考方式，在这种思考方式下，你会有更多的可能性，更大的场景……而不是直接把自己归到“平常人”，把自己“墙”了！

拥抱云时代的前端开发架构——微前端
https://mp.weixin.qq.com/s/rYNsKPhw2zR84-4K62gliw
微前端架构旨在解决单体应用在一个相对长的时间跨度下，由于参与的人员、团队的增加，从一个普通应用演变成一个巨石应用(Frontend Monolith)，随之而来的应用不可维护的问题。这类问题在企业级 Web 应用中尤为常见。另附：使用 Angular 打造微前端架构的 ToB 企业级应用。

美团外卖前端容器化演进实践
https://tech.meituan.com/2019/11/28/meituan-front-end-containerization-evolution.html
随着业务的不断迭代，提单页的模块也越来越多，逻辑的耦合也越来越重。现在提单页的UI展示模块已经超过30个，这些模块的展示与否基本上通过服务端的下发数据来决定。在不同的订单类型下，提单页所展示元素的差异越来越大，很多模块的代码已经不适合统一放在一起维护，代码拆分的需求十分强烈。此外，客户端包体积是衡量客户端性能的重要指标，为了解决业务发展带来的提单页代码量急剧增长的问题，同时实现页面元素的动态配置，我们希望能够实现提单页的动态化，而动态化需要基于容器来实现，所以我们提出了提单页的容器方案。

解密国内BAT等大厂前端技术体系-携程篇
https://mp.weixin.qq.com/s/IbORf-lQOLyaS8sBO5ILOw
携程在组织架构上有基础研发团队进行保障，在大前端领域能够收敛、沉淀众多的基础平台服务、技术框架，形成了一套比较完整、统一的基础框架能力，很好的支撑了多App、多业务的快速发展。

if 我是前端Leader，怎么走出小微前端团队的围墙?
https://mp.weixin.qq.com/s?__biz=MzI5MjYyODYyNQ==&mid=2247484073&idx=1&sn=5edc5544a38c6ada89f45d225b66a033
小微企业的围墙不能靠一个人就能推倒，业务的扩张和升级才是真正的动力。如果你觉得你公司有上升的动力和势态，而且你认同公司的价值观，不妨一起努力推动公司的进步。反之，要认真考虑自身的发展。

Reactive Programming in a Modern Web Application
https://levelup.gitconnected.com/approach-reactive-programming-in-modern-web-application-b20f59b7699d
Learn how asynchronous code is handled in modern web apps and the different philosophies used to manage it — from callbacks and promises to RxJS

React Native vs Flutter: A comparison from real project experience perspective
https://medium.com/javascript-in-plain-english/react-native-vs-flutter-a-comparison-from-real-project-experience-perspective-1e7fbd56f217
How React native is different from Flutter besides the basics, with actual facts for people that don’t know which one to start with!

CSS Architecture for Modern JavaScript Applications
https://www.madebymike.com.au/writing/css-architecture-for-modern-web-applications/
My attempt to modernise some learnings from CSS architecture and how to apply them in the context of modern JavaScript applications.

Copying code from Stack Overflow? You might paste security vulnerabilities, to
https://stackoverflow.blog/2019/11/26/copying-code-from-stack-overflow-you-might-be-spreading-security-vulnerabilities/
We know that Stack Overflow is a daily part of a lot of developers’ lives. I’ve heard from multiple people that they come here daily (if not more often) to get answers to their questions. Sometimes the answer to a question about code comes as a chunk of code. And sometimes that code makes it into production applications because it answered the question perfectly. A group of researchers investigated these code snippets to see how secure they were, and if the security flaws that they introduced remained vulnerable in the project. Ashkan Sami, Associate Professor at Shiraz University, Foutse Khomh, Associate Professor at Polytechnique Montréal, and Gias Uddin, now Senior Data Scientist at the Bank of Canada, researched C++ code snippets on Stack Overflow to answer this exact question.

Egnyte Architecture: Lessons Learned In Building And Scaling A Multi Petabyte Content Platform
http://highscalability.com/blog/2019/11/25/egnyte-architecture-lessons-learned-in-building-and-scaling.html
Egnyte is a secure Content Collaboration and Data Governance platform, founded in 2007 when Google drive wasn’t born and AWS S3 was cost-prohibitive. Our only option was to roll up our sleeves and build basic cloud file system components such as object store ourselves. Over time, costs for S3 and GCS became reasonable and with Egnyte’s storage plugin architecture, our customers can now bring in any storage backend of their choice. To help our customers manage ongoing data explosion, we have designed many of the core components over the last few years. In this article, I will share the current architecture and some of the lessons we learned scaling it along with some of the things we are looking to improve upon in the near future.

5 Things I love about Strapi, a Node.js headless CMS
https://www.jsmonday.dev/articles/44/5-things-i-love-about-strapi-a-node-js-headless-cms
One year ago I started sto develop the backend for the website you’re currently browsing on. I’ve tried different approaches, different technologies and even different programming languages. Then I started to look for a CMS that could help me to integrate a number of feature with ease… but I couldn’t find a CMS that satisfied me at all. Then I discovered Strapi, an amazing open source headless CMS that had everything I was looking for.

CCSM: Scalable statistical anomaly detection to resolve app crashes faster
https://engineering.fb.com/developer-tools/ccsm/
We employ rigorous code review and testing processes, but, as with any system, software bugs still sometimes slip through and may even cause our apps to crash. Resolving these crashes and other reliability issues in a timely manner is a top priority. To help us respond as quickly as possible, we have been creating a collection of services that use machine learning (ML) to aid engineers in diagnosing and resolving software reliability and performance issues. As part of this collection, we recently implemented continuous contrast set mining (CCSM), an anomaly-detection framework that uses contrast set mining (CSM) techniques to locate statistically “interesting” (defined by several statistical properties) sets of features in groups.

Discovering Continuous Automation With Request Mirroring
https://tech.ebayinc.com/engineering/discovering-continuous-automation-with-request-mirroring/
Because eBay’s item page updates frequently, and because it depends on hundreds of libraries and services, discovering the unknowns and automating testing for all use-case combinations from production calls for a different approach to testing.

Astrophotography with Night Sight on Pixel Phones
https://ai.googleblog.com/2019/11/astrophotography-with-night-sight-on.html
This year’s version of Night Sight pushes the boundaries of low-light photography with phone cameras. By allowing exposures up to 4 minutes on Pixel 4, and 1 minute on Pixel 3 and 3a, the latest version makes it possible to take sharp and clear pictures of the stars in the night sky or of nighttime landscapes without any artificial light.

Machine Learning on Encrypted Data Without Decrypting It
https://juliacomputing.com/blog/2019/11/22/encrypted-machine-learning.html?hn
Recent breakthroughs in cryptography have made it practical to perform computation on data without ever decrypting it. In our example, the user would send encrypted data (e.g. images) to the cloud API, which would run the machine learning model and then return the encrypted answer. Nowhere was the user data decrypted and in particular the cloud provider does not have access to either the orignal image nor is it able to decrypt the prediction it computed. How is this possible? Let’s find out by building a machine learning service for handwriting recognition of encrypted images (from the MNIST dataset).

Choosing Go at American Express
https://americanexpress.io/choosing-go/
Selecting a new programming language is an important decision for any organization. In this article, I’m going to walk through some of the reasons American Express elected to use Go within our payment and rewards systems. 另附：From Java to Golang, the journey of the nexuzhealth team by Dylan Meeus, After 20 years of using Java to support the largest hospital network in Belgium, the decision was made to replace this system using a new technology stack.

An Overview of Cryptography
https://www.garykessler.net/library/crypto.html
Does increased security provide comfort to paranoid people? Or does security provide some very basic protections that we are naive to believe that we don’t need? During this time when the Internet provides essential communication between literally billions of people and is used as a tool for commerce, social interaction, and the exchange of an increasing amount of personal information, security has become a tremendously important issue for every user to deal with. This paper has two major purposes. The first is to define some of the terms and concepts behind basic cryptographic methods, and to offer a way to compare the myriad cryptographic schemes in use today. The second is to provide some real examples of cryptography in use today.

How does a video codec work
https://github.com/leandromoreira/digital_video_introduction
A hands-on introduction to video technology: image, video, codec (av1, vp9, h265) and more (ffmpeg encoding).

Is There A Future Beyond Writing Great Code?
https://www.smashingmagazine.com/2019/11/future-beyond-writing-great-code/
Many developers get to a point in their careers in which they’ve achieved many of their goals and wonder about the future. Although some are confident continuing down the same road, others might feel the urge to explore different options in which their skills can be used to have a broader impact on the projects we work on and the teams we work with. I explored some of the different directions we can take and the complementary skills that can help us throughout our journey.

An Engineering Team where Everyone is a Leade
https://blog.pragmaticengineer.com/a-team-where-everyone-is-a-leader/
When I moved from engineering to engineering management, I wanted to build a team where everyone can be a leader - and an owner. This post is a summary of the approach and tools I’ve used to build an engineering team, where everyone is a leader - including sharing of the project management expectations Google Docs guide that my team uses. It’s also a reflection on the pain points that came with this approach. I can’t advocate for how universally this approach could work. However, based on my results, it is something I suggest engineering leaders - especially frontline managers - consider as an option.

How to build a startup engineering team
https://increment.com/teams/how-to-build-a-startup-engineering-team/
Advice for when you’re starting from scratch and designing for growth.

新鲜货

Status update on Web Games technologies
https://www.w3.org/blog/2019/11/status-update-on-web-games-technologies/
The creation of a games activity at W3C, to gather continuous feedback on Web technologies from the games community, track identified needs and steer standardization efforts, is still being investigated.

State Of JavaScript 201 https://stateofjs.com/
In 2018 this survey helped us do just that, by collecting data from over 20,000 developers to identify current and upcoming trends. This year, we’re asking for your help once more to find out which libraries developers want to learn next, which have the best satisfaction ratings, and much more.

ESLint v6.7.0 released
https://eslint.org/blog/2019/11/eslint-v6.7.0-released
We just pushed ESLint v6.7.0, which is a minor release upgrade of ESLint. This release adds some new features and fixes several bugs found in the previous release.

Bootstrap 4.4.0
https://blog.getbootstrap.com/2019/11/26/bootstrap-4-4-0/
Bootstrap 4 has a new update with a handful of feature changes. We’ve had quite the lengthy pull request to add responsive containers—big thanks to the developers who contribute to Bootstrap for sticking with it and helping us along the way. Nearly all new features will be carried forward into Bootstrap 5, so feel free to start using them now. 另附：Introducing Bootstrap Icons.

Duktape
https://github.com/svaarala/duktape
Duktape is an embeddable Javascript engine, with a focus on portability and compact footprint.

react-screenshot-test
https://github.com/fwouts/react-screenshot-test
A dead simple library to screenshot test React components.

RoughViz
https://github.com/jwilber/roughViz
Reusable JavaScript library for creating sketchy/hand-drawn styled charts in the browser.

JSONCrush - Compress JSON into URL friendly strings
https://github.com/KilledByAPixel/JSONCrush
This simple system allows for excellent compression of uri encoded JSON strings using the JSCrush algorithm.

Diagram.Codes
https://www.diagram.codes/
Describe your diagrams with a simple text language and automatically generate an image you can export.

An Introduction to the Picture-in-Picture Web API
https://css-tricks.com/an-introduction-to-the-picture-in-picture-web-api/
Picture-in-Picture made its first appearance on the web in the Safari browser with the release of macOS Sierra in 2016. It made it possible for a user to pop a video out into a small floating window that stays above all others, so that they can keep watching while doing other things. It’s an idea that came from TV, where, for example, you might want to keep watching your Popular Sporting Event even as you browse the guide or even other channels.

Announcing Scala.js 1.0.0-RC1
https://www.scala-js.org/news/2019/11/26/announcing-scalajs-1.0.0-RC1/
We are thrilled to announce the release of Scala.js 1.0.0-RC1! This release candidate is intended for testing purposes by as many users as possible, and as a synchronization point with library authors so that they can start upgrading in preparation for the final release. If no critical issue is found until the end of January 2020, this RC will become the final release.

PNGR Stack
https://github.com/karlkeefer/pngr
Dockerized (postgres + nginx + golang + react) starter kit. Only implements basic user signup, session management, and a toy post type to demonstrate basic CRUD. PNGR is not a CMS.

Computer Architecture - Fall 2019
https://safari.ethz.ch/architecture/fall2019/doku.php?id=schedule
Computer architecture is the science and art of selecting and interconnecting hardware components to create a computer that meets functional, performance and cost goals. This course introduces the basic hardware structure of a modern programmable computer, including the basic laws underlying performance evaluation.

Eternal Terminal - Remote terminal for the busy and impatient
https://eternalterminal.dev/
Eternal Terminal (ET) is a remote shell that automatically reconnects without interrupting the session.

Sweet Home 3D - Draw floor plans and arrange furniture freely
http://www.sweethome3d.com/
Sweet Home 3D is a free interior design application that helps you draw the plan of your house, arrange furniture on it and visit the results in 3D. 另附：Home Assistant - Open source home automation that puts local control and privacy first.

CoScreen - Remote Collaboration Reimagined
https://www.coscreen.co/
CoScreen™ turns your secondary display into your joint team desktop. Share windows via drag & drop, collaborate remotely via mouse & keyboard, each user gets their own mouse pointer.

Fauna - The database built for serverless, featuring native GraphQL
https://fauna.com/
Add a full-featured global datastore to your apps in minutes. Access effortlessly from the browser and from mobile. Never again worry about data correctness, capacity, redundancy, latency, and availability.

SQL, Java Top List of Most In-Demand Tech Skills
https://spectrum.ieee.org/view-from-the-valley/at-work/tech-careers/sql-java-top-list-of-most-indemand-tech-skills
But Python, now at number three, and AWS, at number six, are coming on fast, says job search firm Indeed.

How to annotate literally everything
https://beepb00p.xyz/annotating.html
Comprehensive overview of existing tools, strategies and thoughts on interacting with your data.

Meet the 84-year-old Japanese app developer who inspired Tim Cook
https://asia.nikkei.com/Business/Technology/Meet-the-84-year-old-Japanese-app-developer-who-inspired-Tim-Cook2
Masako Wakamiya says it’s never too late to learn about IT and finance. 另附：DevKids: An inside look at the kids of DevFest.

设计

UX Guidelines for Ecommerce Product Pages
https://www.nngroup.com/articles/ecommerce-product-pages/
Summary: Customers shopping online rely on product pages to decide what to buy. Help them by answering questions, enabling comparison, providing reviews, and facilitating the purchase process. 另附：Adaptive Design and Ecommerce UX: How They Work Together to Boost Conversions.

The future of work will be far less frightening when there’s more women in AI
https://uxmag.com/articles/the-future-of-work-will-be-far-less-frightening-when-there%E2%80%99s-more-women-in-ai
Imagine a world in which AI researchers, visionaries, venture capitalists, and startup founders are predominantly female.

The Higher Ground – A Guide to Design Ethics
https://www.toptal.com/designers/design-director/design-ethics
As designers, we want our work to help, not hinder. In an effort to protect the people we design for, we invoke labels. We name things “good” or “bad” and let our worldview guide design decisions. Our intentions are good, but our method is myopic. We need a systematic approach to help us examine both our design choices and their underlying motives—an ethical approach.

产品及其它

Fibery.io - Yet another collaboration tool
https://fibery.io/
https://medium.com/fibery/fibery-getting-started-64bd0839c85a
https://news.ycombinator.com/item?id=21643683
Platform that adapts and grows with your company:

• Build your own workspace: Create connected no-code Apps that adapt and grow with your company.
• Freedom to work your way: Create your own collaboration tool with no code.
• Create to connect: Build your own workspace with no code to replace isolated tools and bring everyone together.

几何为万物赋能——建筑、医疗、动漫、游戏……
https://mp.weixin.qq.com/s?__biz=MzIzMjQyNzQ5MA==&mid=2247500386&idx=1&sn=8d5a2054900f492b99efda47470bf909
计算机专业，几十年没有发展，核心就是基础的数学理论没有看清楚，很多事是几何理论没有看清楚。有的理论得到了飞速发展，是因为终于有一个几何理论取得了突破，将现代数学的这个思想方法引入到这个理论里面。从小处说，计算机非常好玩、非常强有力，甚至可以说计算机能改变世界。数学非常优美、非常深刻，如果能领悟到其中一些原理，作为凡夫俗子，这是最切实可行的方法让我们可以真正体会到宇宙的真理，得到宇宙永恒的精神。哪怕我们了解一些皮毛，也能够更多地理解宇宙的真谛，这是多么深奥的一个话题。几何是自然界的语言，最深刻的几何原理，也是人类最能审美的一个方向。所以，越深刻的几何原理，人类通过直觉越容易领会到。今天这里，我们不讲数学公式，所有东西都用艺术，或者是其他比较浅显的方式来讲解。另附：A Programmer’s Introduction to Mathematics.

腾讯创始人Tony：用户为本，就是把用户当朋友
https://mp.weixin.qq.com/s/zjRW_B83ec_0F-q9jJWq0w
把用户当朋友，听起来是很简单的理念，但为什么很多产品难以做到？为何越是大型企业做起来越困难？同样的，鹅厂提出“科技向善”，是公益还是责任？我们在商业之外，还能有更多思考吗？Tony期待鹅厂，在“科技向善”上能有更深入的思考。 谈到年轻同事们存在的一些焦虑和困扰，特别是变革时代，如何缓解焦虑？Tony期望年轻人能更有耐心，选择自己喜欢的事。同时，也寄望管理者能够延续“接地气”的文化，多倾听年轻人的声音。

不确定性原理—人工智能的哲学基础
https://mp.weixin.qq.com/s/72k8d5SKqPD7ds4H0962NA
从界面层来看，机器人程序的界面包括语言界面、图形界面、机械操作界面等。人工生命的界面主要是图形界面。界面是什么？从某种意义上说，界面就是形体，形体就是界面。机器人程序可以支持多种复杂的界面，人工生命只能支持很少的简单的界面，因此说机器人程序有形体，人工生命无形体。

陆奇的benchmark：技术趋势与商业变革
https://mp.weixin.qq.com/s/uP_8UBDP7_2d6UtnNpUm3A
任何企业要长期保持健康的发展，有三个视野：Horizon-1是一个财政年度内，已经有产品和规模化的业务，要做的是收入和回报是满足投资者和自己的管理预期；Horizon-2是在可突破的新赛道，完结“毕业”第二条S曲线，ROI在1-3年，这在管理上也是最难的；Horizon-3是找到未来可能的赛道，孵化新的东西，ROI在3-6年。

对数据可视化有兴趣的可以阅读由 AntV 带来的 墨者修齐 2019-12-02·三维宇宙星系、薪水与职业、urban-layers - 城市层

– THE END –