Chrome Dev Summit 10.23-10.24

ReactiveConf 2017 10.25-27


V8 Release 6.3
V8 version 6.3, which is in beta until its release in coordination with Chrome 63 Stable in several weeks. V8 v6.3 is filled with all sorts of developer-facing goodies. This post provides a preview of some of the highlights in anticipation of the release.
附:V8 Today and in the Future.

Introducing the Chrome User Experience Report
We’re making the Chrome User Experience Report available to encourage performance and user experience improvements across the web. The report is a public dataset of key user experience metrics for top origins on the web. The initial release includes data from a sample of ten thousand origins and focuses on loading metrics, though we hope to expand coverage in future iterations.

Can You Afford It?: Real-world Web Performance Budgets
Performance budgets are an essential but under-appreciated part of product success and team health. Most partners we work with are not aware of the real-world operating environment and make inappropriate technology choices as a result. We set a budget in time of <= 5 seconds first-load Time-to-Interactive and <= 2s for subsequent loads. We constrain ourselves to a real-world baseline device + network configuration to measure progress. The default global baseline is a ~$200 Android device on a 400Kbps link with a 400ms round-trip-time (“RTT”). This translates into a budget of ~130-170KB of critical-path resources, depending on composition — the more JS you include, the smaller the bundle must be.

Coding with Clarity
Working code isn’t necessarily good code. Your code also needs to be easy to read, understand, and modify. It needs clarity, and to achieve that, it has to be organized well, with careful planning and proper separation of ideas taking place before you even open your code editor. Coding for clarity is something that separates the great developers from the merely good, and there are a few basic principles that can set you on that path.

The QUIC transport protocol: design and Internet-scale deployment
QUIC is a transport protocol designed from the ground up by Google improve the performance of HTTPS traffic. The chances are you’ve already used it – QUIC is deployed in Chrome, in the YouTube mobile app, and in the Google Search app on Android. It’s also used at Google’s front-end servers, handling billions of requests a day. All told, about 7% of global Internet traffic is now flowing over QUIC. There are three interesting aspects to the paper, that we can essentially divide into the Why, the What, and the How. How QUIC was built and evolved over time is an integral part of the story.

The Web Fundamentals Gap
There are no shortage of boot camps, courses, and resources to learn front-end development out there, but having interviewed a lot of the folks coming out of these boot camps, I think there is a serious under-appreciation of the importance of CSS and the fundamentals of JavaScript.

直达服务平台上的各个服务采用前端技术栈开发,但是并不跑在浏览器或 WebView 中,它舍弃了浏览器内核渲染,转而采用 Android 的原生渲染机制,也就是说,实际上是使用前端技术栈开发了一个原生应用,无论是渲染效率,还是系统能力的 API 丰富程度,都远远超出传统网页。

打造丝般顺滑的 H5 翻页库
百度 H5 团队在使用了流行开源的 H5 翻页库之后,结合自身的业务需要,开发出了平台运行时所需的 H5 翻页库,具有轻量级、高性能的特点。这篇文章讲述了在开发过程中遇到的一些问题和对应的解决办法。

EggBorn.js是采用Javascript进行全栈开发的最佳实践。EggBorn.js不重复造轮子,而是采用业界最新的开源技术,进行全栈开发的最佳组合。EggBorn.js前端采用Vue.js + Framework7 / Vue Router + Webpack,后端采用Koa.js + Egg.js,数据库采用mysql。

我在 Uber 这几年,做了很多系统稳定性及可扩展性的工作,也做了一些移动开发的工作,因此我对 Uber 端到端的技术栈还比较熟悉。在这里以我的经历为例跟大家分享一下如何快速地做一个稳定的端到端大型应用。


这个理念蛮不错的。Andrea Goulet 是 Corgibytes 的 CEO ,这家咨询公司主要承担应用的重构和现代化等项目。她曾经见识过各种各样破旧的系统、遗留的代码以及繁重的技术债,感觉人们都在以数字化的方式囤积各种“古董”。因此 Goulet 认为初创公司需要转变自己的心态,不要斥资积累技术债,而是要创造技术财;不应继续用老旧的代码将就,而应特意进行重构。她将通过本文介绍自己提出的新方法,以及将不可能变为可能的做法。

React 16 Release: What’s New?
In this article, we’ll highlight notable additions to ReactJS 16 and dabble into the architecture it runs on.

HTML Web Component using Vanilla JavaScript
Web Components have been around for a while now. Google has really been trying to push for their more widespread adoption, but most major browsers still have very little support for it, except for Opera and Chrome. However, by using polyfills, available from https://www.webcomponents.org/polyfills, you can build your own Web Components now. In this article, I’m going to teach you how to create your own HTML tags with styles, functionality, and markup neatly packaged in their own files.

Stop Designing For Only 85% Of Users: Nailing Accessibility In Design
The visual interface is an obvious place to begin digging into accessibility. In this article, we’ll discuss some of the most common visual impairments, focusing on color-blindness to explain how you can make small changes to your workflow and products to ensure you’re not alienating users.

A Guide to Automating & Scraping the Web with JavaScript
Learn to Automate and Scrape the web with Headless Chrome

Node.js Async Function Best Practices
In this article, I will briefly show you what async functions are, and how they change the way we write Node.js applications.

Building Smart Replies for Member Messages
At LinkedIn Messaging, we are working hard to bring value to our members by providing innovative improvements to the way they communicate professionally with others. Today, we are introducing a brand new natural language processing (NLP) recommendation engine that provides members with smart reply recommendations. In this blog post, we discuss the process we went through to build the models and infrastructure that power smart replies for members.

Why does one NGINX worker take all the load?
Balancing the incoming connections across multiple application workers is far from a solved problem. The single queue approach (b) scales well and keeps the max latency in check, but due to the epoll LIFO behavior the worker processes won’t be evenly load balanced. The best generic solution seem to be to change the standard epoll behavior from LIFO to FIFO.

What’s going on with containers? Here’s a helpful glossary
Containers bring additional security, isolation, and simplified app delivery to the classic model. At CoreOS, we see container standards and components as a function of three major categories: cluster operations, node operations, and software delivery. Each of these categories has inputs and outputs that link it to the others. Check out the Software Container Terminology Glossary for a comprehensive list of defined standards and components in each of the three categories above.


Saying Goodbye to Firebug
Firebug is now reaching end-of-life in the Firefox browser, with the release of Firefox Quantum (version 57) next month. The good news is that all the capabilities of Firebug are now present in current Firefox Developer Tools. The story of Firefox and Firebug is synonymous with the rise of the web. We fought the good fight and changed how developers inspect HTML and debug JS in the browser. Firebug ushered in the Web 2.0 era.

Android Studio 3.0 Release
Android Studio 3.0.0 is a major release that includes a variety of new features and improvements: Kotlin support, Java 8 language features support, Android Profiler, APK profiling and debugging, Device File Explorer, Layout Editor…

sonar: Linting the web forward
sonar brings many improvements compared to previous scanners: execution of website code instead of static analysis, a more flexible and modernized set of rules, parallel test execution, integration with other services, a completely open source code base from day one, and more. Additionally, sonar can also be used as a command line tool (CLI) that you can integrate directly into your local web development workflows.

Ionic: 2017-18 Roadmap
A step back and talk about what the next ~6-12 months looks like for everything Ionic.

Netflix: Removing client-side React.js improved performance by 50%
详见:Netflix UI Engineering JS Talks Live Stream

Client side accessibility error scanner. In GitHub we use this script to scan for inaccessible elements in development and production staff mode. We style the elements with red borders in the logError function passed in, and add a click handler explaining the reasons.

Apollo Client 2.0
The universal way to manage your application state with GraphQL

An open source, modern and powerful wiki app built on Node.js, Git and Markdown.

The most advanced open-source Content Management Framework to build powerful API with no effort.

SciPy 1.0 released!
We are extremely pleased to announce the release of SciPy 1.0, 16 years after version 0.1 saw the light of day. SciPy (pronounced “Sigh Pie”) is a Python-based ecosystem of open-source software for mathematics, science, and engineering.

Pre-renders web app into static HTML. Uses headless chrome to pre-render. Crawls all available links starting from the root. Heavily inspired by prep and react-snapshot, but written from scratch. Uses best practices to get best loading performance.

A free guide to <head> elements. A list of everything that could go in the head of your document

HEML is an open source markup language for building responsive email.

Reason 3
Reason lets you write simple, fast and quality type safe code while leveraging both the JavaScript & OCaml ecosystems. Reason 3 is primarily the work of Fred, the maintainer of Merlin (yeah, that Merlin), Iwan and Jared, over the last six months. The release packs a lot of infra changes under the hood, most of which, we hope, stay invisible to you and occasionally make you feel “yeah, that is how I think it should work”.

Exoframe is a self-hosted tool that allows simple one-command deployments using Docker.

Convert Sketch files into React Native components

Awesome Go
A curated list of awesome Go frameworks, libraries and software. Inspired by awesome-python.


MakeCode for Minecraft makes learning to code super fun
The MakeCode for Minecraft editor has the pixelated look and feel of Minecraft. MakeCode allows coding with visual blocks, based on a drag and drop interface for beginners, as well as in text with a JavaScript interface for the more experienced learners. Coding with blocks or text, MakeCode teaches the 101 of programming languages, including variables, control flow, if statements, loops and functions.



10月21日,北京大学哲学系陈波教授来到混沌大学讲堂,带来了一堂极致“烧脑”的思维训练课: 《批判性思维和创新能力培养》 ,系统阐释了批判性思维如何养成,大信息量,大冲击力,简直是智商碾压级体验,而且又是深入浅出,风趣幽默。为此,混沌君特意详细梳理了其中的精彩案例剖析,供你学习。11个逻辑命题,你能做对多少?不服来战。

作者:zhangbobell (http://zhangbobell.cn) - 恰同学少年,风华正茂