2018.01.22

Title: 2018.01.22

Industry Conferences

GeekPark Innovation Conference IF2018 http://if.geekpark.net/ A gathering for frontier thinking about technology.

In‑Depth Reading

The Ultimate Guide to JavaScript Frameworks https://javascriptreport.com/the-ultimate-guide-to-javascript-frameworks/ Keeping up with JavaScript frameworks can be a challenge. There are a lot of them, and seemingly another one every month. How do you know which ones might be right for your project? What are their strengths and weaknesses? How do you get started?

Firefox’s new streaming and tiering compiler https://hacks.mozilla.org/2018/01/making-webassembly-even-faster-firefoxs-new-streaming-and-tiering-compiler/ Firefox 58 also includes a new 2‑tiered compiler. The new baseline compiler compiles code 10–15 times faster than the optimizing compiler. Combined, these two changes mean we compile code faster than it comes in from the network.

ECharts 4.0 – A Whole New Major Release https://mp.weixin.qq.com/s?__biz=MzA4MjUyNjY3Nw==&mid=2649587419&idx=1&sn=6b22229e883c031d74b6a719f60e786c The new version brings comprehensive improvements in performance, features, and usability. Alongside ECharts 4.0, Baidu also launched the official 1.0 release of ECharts GL, the brand‑new ZRender 4.0, the WebGL framework ClayGL, and the deep‑learning framework Visual DL—essentially a grand showcase of Baidu’s data‑visualization ecosystem. With these releases, Baidu unveiled a newly upgraded data‑visualization brand, “Baidu Data Visualization Lab,” signaling a major push in this field. Also see: 2017 Baidu Open‑Source Highlights Review and Summary

AR Development Techniques in Web Front‑End http://geekplux.com/2018/01/18/augmented-reality-development-tech-in-web-frontend.html The augmented‑reality (AR) wave is rolling in, and the web browser—people’s most readily available human‑computer interface—is rapidly advancing AR capabilities. Many front‑end engineers are looking to pivot their careers, so I’ve compiled my half‑year research on the topic into this article.

Mifa Design: A Design System for Markdown https://mp.weixin.qq.com/s?__biz=MjM5Mjg4NDMwMA==&mid=2652975682&idx=1&sn=a2639824cca298ad757cc3e7fba74194 Mifa Design is a design system aimed at individuals. Built on the values of “readability” and “consistency,” it lets Markdown authors focus on writing. The name “Mifa Design” comes from its abbreviation MD—not to compete with Ant Design—but to provide a unified UI and reading experience for my website, blog, apps, mini‑programs, etc.

From Principles to Trends: Dissecting the Hype‑Driven Blockchain Technology https://mp.weixin.qq.com/s?__biz=MjM5NjQ1MTkyMA==&mid=2653803297&idx=1&sn=94d90ee1dfc13f60e1c53558ffaa6fce Blockchain is not a brand‑new technology; it is a new combination of technologies. Its core components include P2P dynamic networking, cryptography‑based shared ledgers, consensus mechanisms, and smart contracts. Most historic innovations are tied to productivity—doing less work ourselves and letting machines do more. Blockchain’s biggest disruption, however, lies in production relations: the Internet enabled information flow; blockchain enables value transfer. Think of blockchain as the foundational protocol of a “value Internet,” analogous to HTTP for the “information Internet,” both operating at the application layer atop TCP/IP.

The Algorithm Behind Toutiao https://www.toutiao.com/i6511211182064402951/ Toutiao’s recommendation algorithm has undergone four major revisions since its first launch in September 2012. The company commissioned senior algorithm architect Dr. Cao Huanhuan to publicly explain the algorithm, aiming to foster industry‑wide dialogue, demystify algorithms, and gradually steer the sector toward using algorithms for societal benefit.

How Big Is That Box? Understanding Sizing In CSS Layout https://www.smashingmagazine.com/2018/01/understanding-sizing-css-layout/ In this article, I’m going to share with you some interesting things about sizing boxes in CSS. I’ve picked out a few things from the specifications that I believe are vital in terms of understanding exactly how big that box is. Take some time to read through, and I think you’ll find sizing in Grid a lot less mysterious!

Keep webpack Fast: A Field Guide for Better Build Performance https://slack.engineering/keep-webpack-fast-a-field-guide-for-better-build-performance-f56a5995e8f1 Build performance has long been a concern among webpack’s user base and, while the core team has worked furiously over the past few months to improve it, there are many steps you can take to improve your own build. The techniques below helped us reduce our build time by a factor of 10, and we want to share them in case they help others.

Dragging React performance forward https://medium.com/@alexandereardon/dragging-react-performance-forward-688b30d40a33 In this blog I will explore the performance challenges that we faced and how we overcame them to get such impressive results. The solutions that I will talk about are very tailored for our problem domain. There are some principles and techniques that will emerge — but the specifics might be different across problem domains.

Dependency injection in TypeScript applications powered by InversifyJS http://blog.wolksoftware.com/dependency-injection-in-typescript-applications-powered-by-inversifyjs InversifyJS is a lightweight inversion of control (IoC) container for TypeScript and JavaScript apps. InversifyJS uses annotations to identify and inject its dependencies. The InversifyJS API had been influenced by Ninject and Angular and encourages the usage of the best OOP and IoC practices.

Demystifying CSS alignment https://medium.com/@patrickbrosset/demystifying-css-alignment-2d3ea7a02a36 In this post, I’d like to talk about alignment a little bit. What it means in Flexbox and Grid and how to think about it more generally too, so you can be equipped for the future, when aligning in Blocks, Multi‑Columns, Tables, Grids and Flexbox all works the same.

ESM modules in node: npm edition https://gist.github.com/ceejbot/b49f8789b2ab6b09548ccb72813a1054 The proposal you’re about to read is not just a proposal. We have a working implementation of almost everything we discussed here. We encourage you to checkout and build our branch: our fork, with the relevant branch selected. Building and using the implementation will give you a better understanding of what using it as a developer is like.

Announcing the Ionic PWA Toolkit Beta https://blog.ionicframework.com/announcing-the-ionic-pwa-toolkit-beta/ The Ionic PWA toolkit is the recommended way to easily build fast, production‑ready PWAs with Ionic. Let’s dive in and go over why we’re building this, what it offers you as a developer, what’s in store for the stable release, and finally, how to get started using it!

Internationalizing Node.js https://medium.com/the-node-js-collection/internationalizing-node-js-fe7761798b0a I’ll be bringing you up to speed on: The current international‑language needs of Node.js; A Node.js Internationalization (i18n) & Localization (l10n) status report; Our proposal for moving Node’s i18n forward as a function of the Community Committee.

IT IS NOT POSSIBLE TO DETECT AND BLOCK CHROME HEADLESS https://intoli.com/blog/not-possible-to-block-chrome-headless/ If you’ve read Making Chrome Headless Undetectable, then this article should be pretty familiar. I’ll set up a test page that implements each of Antione’s tests, and then show how it’s fairly trivial to bypass each of them. I used Selenium last time, so this time I’ll use Puppeteer to spice it up. Most of the test bypasses are implemented as injected JavaScript however, so much of the code should be applicable to any browser automation framework that supports JavaScript injection.

Measuring Transactional Integrity in Airbnb’s Distributed Payment Ecosystem https://medium.com/airbnb-engineering/measuring-transactiona (content truncated)

---

Originally written by Ping Xia (平侠) and published in Chinese on Web技术周刊 (Web Tech Weekly). Translated and adapted for DriftSeas with permission.