FEX 技术周刊 - 2017/10/09

深阅读

An Internship on Laziness: Lazy Unlinking of Deoptimized Functions
https://v8project.blogspot.jp/2017/10/lazy-unlinking.html
I’ll explain how V8 used to unlink deoptimized functions, how we changed this, and what performance improvements were obtained.
附：[Optimizing ES2015 proxies in V8](https://v8project.blogspot.jp/2017/10/optimizing-proxies.html

Essential Image Optimization
https://images.guide/
We should all be automating our image compression. In 2017, image optimization should be automated. It’s easy to forget, best practices change, and content that doesn’t go through a build pipeline can easily slip. To automate: Use imagemin or libvips for your build process. Many alternatives exist. 附：Fundamentals of Responsive Images

Talk to Google at Node.js Interactive
https://opensource.googleblog.com/2017/10/talk-to-google-at-nodejs-interactive.html
We’re headed to Vancouver this week, with about 25 Googlers who are incredibly excited to attend Node.js Interactive. With a mix of folks working on Cloud, Chrome, and V8, we’re going to be giving demos and answering questions at the Google booth. A few of us are also going to be giving talks. Here’s a list of the talks Googlers will be giving at the conference, ranging from serverless Slack bots to JavaScript performance tuning.

Web Frameworks: Soundness
https://www.sitepen.com/blog/2017/10/03/web-frameworks-soundness/
While we have been comparing web frameworks to music, soundness in this context isn’t how good the framework sounds on a turntable. It is the concept of our code being in a good condition and robust. While we should and can test for this, helping us in other ways should be one of the main benefits of using a framework.

前端中的 Pipeline
https://zhuanlan.zhihu.com/p/28561932
Pipeline 一般具有如下特点：各个子过程高内聚，专注于解决特定问题，Simple & Sharp；所有子过程具有一致的接口，例如从标准输入读取数据，正常结果输出到标准输出，异常结果输出到标准错误；能够通过一定形式将子过程组合起来解决复杂问题，例如 pipe。事实上，Pipeline 作为化整为零、去繁就简的重要手段，在前端中也有诸多应用。

架构师必须知道的架构设计原则
https://mp.weixin.qq.com/s?__biz=MjM5MDE0Mjc4MA==&mid=2650998170&idx=1&sn=6defd4f0a9fdb5cf93e6977080c61c70
不管你是新手程序员、职场老司机，还是资深架构师，这篇文章对你来说应该都有裨益。

Lessons from migrating a large codebase to React 16
https://blog.discordapp.com/lessons-from-migrating-a-large-codebase-to-react-16-e60e49102aa6
While the React team has diligently deprecated methods and packages throughout the last version, warning us strongly in console statements to upgrade, the actual final migration is not trivial for larger codebases. We at Discord just launched our React 16 based app and wanted to share our experience and some tips we learned along the way.

The 100% correct way to structure a React app (or why there’s no such thing)
https://hackernoon.com/the-100-correct-way-to-structure-a-react-app-or-why-theres-no-such-thing-3ede534ef1ed
In this post, I’d like to tell you how I structure my React apps, and what drove my decisions. Along the way I’ll mention some options I don’t use because they don’t suit me, but that might serve you well.

Free Cross-Platform Mobile App Development Tools Compared
https://www.outsystems.com/blog/free-cross-platform-mobile-app-development-tools-compared-2017.html
This list includes open-source and free cross-platform mobile app development tools that any developer can use immediately.

8 Key React Component Decisions
https://medium.freecodecamp.org/8-key-react-component-decisions-cc965db11594
Here are eight key decisions your team needs to make when writing React components today.

The Road to Ember 3.0
https://emberjs.com/blog/2017/10/03/the-road-to-ember-3-0.html
Ember 3.0 removes public API deprecated in Ember 2.x releases. 3.0 does not introduce new public APIs or breaking changes.

Airbnb’s 10 Takeaways from Moving to Microservices
https://thenewstack.io/airbnbs-10-takeaways-moving-microservices/
Monolith first, DevOps culture, Configuration as Code…

Publishing what you mean to publish
http://blog.npmjs.org/post/165769683050/publishing-what-you-mean-to-publish
You, as a developer publishing to npm, want to avoid leaking your data like this. I’ll share some tips for how to control what you’re publishing and keep your secrets out of the public registry. 另附：Protect your npm account with two-factor authentication and read-only tokens

Size Limit:Make the Web lighter
https://evilmartians.com/chronicles/size-limit-make-the-web-lighter
Keep your JavaScript dependencies and polyfills in check and find out what exactly makes your code bloat with Size Limit. To demonstrate, we will code a simple library together, and then shrink its browser bundle so that it takes 5 000 (yes, five thousand) times less space than initially.

Text Editor: Data Structures
http://www.averylaird.com/programming/editor/2017/09/30/the-piece-table/
I researched several data types, and I tried to be language agnostic. I wanted my decision to not be influenced by any particular language, and first see if there was a “best way” out there, solely based on operations. Of course, a “best way” rarely exists. However, in the case of text manipulation and storage, there are some clear “worst ways” and “better ways.” 另附：The Craft of Text Editing

How we created a design system for the U.S. government
https://18f.gsa.gov/2017/10/03/building-a-large-scale-design-system/
I was part of a team of designers and developers who unified a complex system with numerous rules to serve users from all corners of the country. I’ll shed some light on how we built tools to leverage industry-standard best practices and produce a design system with reusable components. You’ll also see how our system is helping agency teams in the federal government create simple, efficient, consistent experiences quickly and at reduced cost.

A Five Minutes Guide to Better Typography
http://pierrickcalvez.com/journal/a-five-minutes-guide-to-better-typography

CSS Grid Challenge: Winners and Templates
https://www.smashingmagazine.com/2017/10/css-grid-challenge-2017-winners/
One of the main reasons behind the idea of the CSS Grid Challenge was to have some starting points for layouts, and show what can be achieved with CSS Grids today. So without a further ado, let’s look at the submissions which we think are the most impressive ones.

Functional Minimalism for Web Design
https://blogs.adobe.com/creativecloud/functional-minimalism-for-web-design/
Minimalist websites simplify interfaces by removing unnecessary elements and paring down content that does not support user tasks. What makes such websites inspiring is the combination of usability and great aesthetics: An easily navigable, beautiful website is a powerful vehicle of communication.

新鲜货

Babel Turns Three
https://babeljs.io/blog/2017/10/05/babel-turns-three
Babel has really come a long way since Sebastian started the project only 3 years ago! A while back it was renamed from 6to5 to Babel; for good reason as it has signficantly contributed to the use of ES2015+ by many companies, libraries, and developers alike.

Announcing Microsoft Edge for iOS and Android, Microsoft Launcher
https://blogs.windows.com/windowsexperience/2017/10/05/announcing-microsoft-edge-for-ios-and-android-microsoft-launcher/
iOS 下用系统的，Android 下用 Blink，所以不用担心兼容性问题。
附：Microsoft Edge for iOS and Android: What developers need to know

HTML 5.1 2ND EDITION IS A W3C RECOMMENDATION
https://www.w3.org/blog/news/archives/6553

An Update on Firefox Containers
https://blog.mozilla.org/tanvi/2017/10/03/update-firefox-containers/
Containers is now available as a Firefox Extension, accessible to all Firefox users.

Structor - React UI Builder
https://github.com/ipselon/structor
nstall Components > Prototype UI > Generate Source Code > Build Application

Moving Letters
http://tobiasahlin.com/moving-letters/
Text animated with JavaScript & anime.js

SentinelJS
https://github.com/muicss/sentineljs
SentinelJS is a tiny JavaScript library that lets you detect new DOM nodes using CSS selectors (653 bytes).

statty
https://github.com/vesparny/statty
statty is meant to manage app-wide state and can be thought of as a simplified version of Redux. It safely leverages context to expose application state to children, along with a function to update it when needed. The update function acts like Redux dispatch, but instead of an action, it takes an updater function as a parameter that returns the new state. This way it’s easy to write testable updaters and to organize them as you prefer, without having to write boilerplate code.

Announcing Node.js for Mobile Apps: a full-fledged Node.js runtime for Android and iOS
http://www.janeasystems.com/blog/announcing-node-js-mobile-apps-true-node-js-runtime-android-ios/
At the heart of it, is a library – available for Android and iOS – that allows an app to host a full-fledged Node.js execution environment. In addition to the core library, we have released plugins for Cordova and React Native – both also compatible with Android and iOS – which make it extremely easy to integrate the Node.js runtime into applications built using on those frameworks.

Walmart Labs open sources its tool for bringing React Native to existing mobile apps
https://techcrunch.com/2017/09/29/walmart-labs-open-sources-its-tool-for-bringing-react-native-to-existing-mobile-apps/
Walmart is placing a big bet on React Native. With Electrode, the company’s Walmart Labs division open sourced the React-based framework that powers Walmart.com’s frontend and today the same group is also launching Electrode Native, its tool for bringing React Native to existing native apps on iOS and Android.

Introducing Cloud Firestore: Our New Document Database for Apps
https://firebase.googleblog.com/2017/10/introducing-cloud-firestore.html
We’re excited to launch Cloud Firestore, a fully-managed NoSQL document database for mobile and web app development. It’s designed to easily store and sync app data at global scale, and it’s now available in beta. 附：Improved Querying and Offline Data with AngularFirestore

Falcor 1.0 Released
https://github.com/Netflix/falcor
A JavaScript library for efficient data fetching.

What the f*ck JavaScript?
https://github.com/denysdovhan/wtfjs
JavaScript 中一些需要注意的地方

Winners of the Recent js13kGames
http://2017.js13kgames.com/#winners
Js13kGames is a JavaScript coding competition for HTML5 Game Developers. The fun part of the compo is the file size limit set to 13 kilobytes.

Roarr
https://github.com/gajus/roarr
JSON logger for Node.js and browser. 附：https://medium.com/@gajus/roarr-the-perfect-json-logger-node-js-and-browser-935180bda529

coolHue
https://github.com/webkul/coolhue
Coolest handpicked Gradient Hues and Swatches for your next super ⚡ amazing stuff. coolHue has 60 coolest Gradients and 🌱 the list is still growing. You can also personalize the coolHue Palette as per as your taste.

ZeroNet
https://github.com/HelloZeroNet/ZeroNet
Decentralized websites using Bitcoin crypto and the BitTorrent network. Why? We believe in open, free, and uncensored network and communication. No single point of failure: Site remains online so long as at least 1 peer is serving it. No hosting costs: Sites are served by visitors. Impossible to shut down: It’s nowhere because it’s everywhere. Fast and works offline: You can access the site even if Internet is unavailable.

Interesting Codebases
https://medium.com/@markpapadakis/interesting-codebases-159fec5a8cc
This list is going to be short — I am definitely forgetting many that were interesting to me at the time — , and it’s mostly out of order, but you may want to consider it if you want to be surprised, like I was, or learn a thing or two perhaps.

URL to PDF Microservice
https://github.com/alvarcarto/url-to-pdf-api
Web page PDF rendering done right. Microservice for rendering receipts, invoices, or any content. Packaged to an easy API.

Learn TLA
https://learntla.com/introduction/
TLA+ is a formal specification language. It’s a tool to design systems and algorithms, then programmatically verify those systems don’t have critical bugs. It’s the software equivalent of a blueprint.

产品及其它

Y Combinator’s Founding Principles
http://www.ycombinator.com/principles/
From the point YC funds a startup we should put the founders’ interests first, before even our own. We must remember that we’re investors, not bosses. We can advise and persuade, but not command. What drove us in starting YC was that it seemed a cool hack: that if we helped founders in the earliest stages, there could be a lot more successful startups. That hypothesis turned out to be correct, and it has a long way to run. Focus on helping founders, and everything else will follow.

Be a Mentor
https://alistapart.com/article/be-a-mentor
Remember, you don’t have to be a famous speaker, a renowned expert, or even at the top of the career ladder to be a good mentor—you just have to be able to articulate what what got you where you are today to someone who’s not there yet. If you are willing to do this authentically by being present, positive, patient, and productive, you can be a great mentor today.

多款重量级产品亮相，Google 认真做起硬件来连苹果都害怕
http://www.geekpark.net/news/222793
AI+硬件+软件，这是 Google 为智能硬件定下的发展方向。在可见的未来内，印有「Made by Google」的产品将在多个领域和竞争对手展开厮杀。