Weekend JavaScript



ISSUE #106

What is new in Chrome 60, finally proposal, JS reduce, and other tutorials


HEADLINES

Chrome 60: Paint Timing API, Control Font Loading with Font-Display and WebAssembly - YouTube

With Chrome 60, you can now measure time to first paint and time to first contentful paint with the Paint Timings API. You can control how fonts are rendered...


MODERN JAVASCRIPT

A Quick Practical Example of JavaScript’s Reduce Function | JP Sio

As I worked through Whiz Tutor’s new mobile app, I found a great use for reduce. Tutors are able to set their availability by choosing time blocks that they are free to tutor.


The JavaScript Way book | Baptiste Pesquet

A modern introduction to an essential language.


ES proposal: class fields

The ECMAScript proposal “Class Fields” by Daniel Ehrenberg and Jeff Morrison is currently at stage 3. This blog post explains how it works.


Community Picks

\* Books recommended by the redditors


ECMAScript Proposal for Promise.prototype.finally

Many promise libraries have a "finally" method, for registering a callback to be invoked when a promise is settled (either fulfilled, or rejected). The essential use case here is cleanup - I want to hide the "loading" spinner on my AJAX request, or I want to close any file handles I’ve opened, or I want to log that an operation has completed regardless of whether it succeeded or not.


3 really cool potential features in JavaScript | Just In Time Coder

I thought I'd take a look at some of the features being proposed to the TC39 committee (the guys who decide what will become part of the language) that may become part of our everyday toolkit.


VIDEO

How to pass JavaScript interviews. Guide for Junior Developers - YouTube

A short guide to passing interviews as Junior JavaScript Developer based on my own experience conducting those interviews. Sorry for terrible echo, in an un-...


VUE

From Android to Web Development with Vue.js | Remy Chantenay, Travelex

As a software engineer, it’s very important to get out of your comfort zone from time to time and get a broader picture of the different technologies out there.


ANGULAR

Dynamically Loaded Angular 1.x ModulesDynamically Loaded Angular 1.x Modules | Evan Williams, Aviture Tech Blog

Angular 2 was developed with more awareness of the changing world of web development. It was developed to allow for easy integration of modules that can be loaded on demand with the idea of bundle splitting in mind. But what about those of us stuck in Angular 1.x land? We have all the benefits of webpack and its code splitting tools, but on a framework that had no notion of dynamic module support.


REACT

The first React 16 beta is now available for public testing

React 16 depends on the collection types Map and Set. If you support older browsers and devices which may not yet provide these natively, consider including a global polyfill in your bundled application, such as core-js or babel-polyfill.


Function as Child Components (React) | Merrick Christensen

I recently polled on Twitter regarding Higher Order Components and Function as Child, the results were surprising to me.


A cartoon guide to Flux | Lin Clark, Code Cartoons

Flux is both one of the most popular and one of the least understood topics in current web development. This guide is an attempt to explain it in a way everyone can understand.


HYBRID APPS

Hybrid Mobile Apps are Overtaking Native | Matt Netkow

I typically encounter two types of hybrid app dissenters: those that haven’t tried the approach yet or those that did several years ago. Regardless of your current position, the space has evolved significantly for the better. The native vs. hybrid playing field hasn’t just been leveled — hybrid is taking over! Let’s review the top concerns and see how they’ve progressed.


SERVERLESS

Testing AWS Lambda with AVA | Max Gallo

In this post I'll show you how I used the “Futuristic JavaScript test runner” AVA to test AWS Lambda functions.


Build a Serverless Live Blog System with Flybase, Twilio and StdLib | The Flybase Blog

Flybase and Twilio work great together, we've posted several posts before about using these two services in one place, but what about if you want to go serverless?


TYPESCRIPT

JavaScript for squares: The incredible rise of TypeScript | Matt Asay, InfoWorld

The web needed a freewheeling programming language like JavaScript, but now it’s time to set some rules


PLAYING AROUND

Unknown pleasures with JavaScript | Max Halford

This time I randomly generated images resembling the cover of the album by Joy Division called “Unknown Pleasures”.


16-Bit VM in javascript | Francis Stokes

A little while ago I started working on a 16 bit virtual machine running in node. I'd been watching these amazing series of videos from Ben Eater about how he build a fully functional 8 bit computer from scratch, and wanted to see if I could put into practice some of the things I'd learned.…


RXJS

RxJS: An object lesson in terrible good software | Alex Holmes, Isotoma

We recently used RxJS on a large, complex asynchronous project integrated with a big third-party distributed system. We now know more about it than, frankly, anyone would ever want to.


TOOLING

egoist/presite: Prerender your website using jsdom or Chrome headless.

Prerender your website using jsdom or Chrome headless.


Critical CSS and Webpack: Automatically Minimize Render-Blocking CSS | ANTHONY GORE

If we only load the CSS that's useful for the initial page render, our users will see the page quicker. Isolating critical CSS and loading non-critical CSS in idle time is something that can be done programmatically in your Webpack pipeline.


WORKFLOW

How Flowtype moved me from Webstorm to VS Code | Vahid Panjganj

I’m going to be honest, writing tests is not my favorite thing to do (but it doesn’t mean that I don’t do it). I remember at some point for instance, I had to check whether a function rejected a…