#476 — February 21, 2020

Unsubscribe  :  Read on the Web

JavaScript Weekly

Fixing Memory Leaks in Web Applications — When the front-end became more dynamic, part of the bargain was that front-end developers would have to deal with “a new class of problems that don’t really exist in the server-rendered world”.. including avoiding memory leaks on 101 different types of client device. Here’s an introduction to client-side memory leaks and how to begin investigating them.

Nolan Lawson

TypeScript 3.8 Released — The latest version of TypeScript (the JS ‘superset’ with static type support) is with us and introduces support for ES private fields, export * as .., top-level await, and more, all demonstrated in detail in this release post.

Daniel Rosenwasser (Microsoft)

Get Best in Class Error Reporting for Your JavaScript Apps — Time is money. Software bugs waste both. Save time with Bugsnag. Automatically detect and diagnose errors impacting your users. Get comprehensive diagnostic reports, know immediately which errors are worth fixing, and debug in minutes. Try it free.

Bugsnag sponsor

A Guide to console Commands — Yes, this topic has been done before, but this is truly the most thorough article I’ve seen on the topic. If console.log is as far as you’ve gone before, this is quite the journey.

Travis Almand

▶  9 Talks from the WebAssembly Summit 2020 — WebAssembly is undoubtedly going to become a more significant technology this decade and these talks provide a glimpse at the cutting edge of WASM with Lin Clark’s talk providing perhaps the best overview of the space.

YouTube

What's Coming in ESLint 7.0 — The next set of features for the popular configurable linter tool has been locked down.

ESLint Team

⚡️ Quick Releases

💻 Jobs

Lead Server-Side Developer (Sydney or Remote across AUS/NZ) — Build back-end frameworks server side software (Express.js + MongoDB + GraphQL) and write server-side code (JavaScript, Node.js).

Compono

Find a Dev Job Through Vettery — Vettery is completely free for job seekers. Make a profile, name your salary, and connect with hiring managers from top employers.

Vettery

ℹ️ If you're interested in running a job listing in JavaScript Weekly, there's more info here.

📘 Articles & Tutorials

▶  Wes Bos Demonstrates Cloudflare WorkersWorkers is Cloudflare’s ‘run JavaScript code at the edge’ service (though it also supports Rust, C and C++ now). This is a good, practical introduction to a common use case and worth watching if you want to use JavaScript to process in-flight HTTP requests.

Wes Bos

What’s Actually New in Angular 9? — We featured the release of Angular 9 a couple of weeks ago – this post digests the release.

John Papa and Kapehe Jorgenson

Aborting a Fetch API Request — The Fetch API didn’t have the ability to abort a request in its early days (unlike XMLHttpRequest) but AbortController and AbortSignal can help you get the job done on all modern browsers.

Ganapati V S

The Ultimate Guide to Container Formats: Decrypting Video Technologies — This is a comprehensive guide of the definitions & processes that you must know when working with back-end video stacks.

Bitmovin Inc. sponsor

How To Use The HTML Drag-And-Drop API in React — How to use the useReducer hook for managing state in a React functional component.

Chidi Orji

An Introduction to Set Objects — A brief introduction to a handy type that was introduced with ES6/ES2015.

Nick Scialli

Make Your Own DevTools? — How creating DevTools specific for your own app can be a way to improve your productivity. I could see this catching on!

Kent C Dodds

Introducing the Page Visibility API — Modern browers generally handle page visibility stuff on their own nowadays, but you can do a little more with the API, which has excellent browser support.

John Au-Yeung

Building an Image Gallery using PixiJS and WebGL — This goes beyond your typical image gallery with an interesting 3D effect. Lots of bits and pieces here to learn.

Luis Torres

Reactivity in Vue 2 vs Vue 3 — This goes into quite some depth though it’s only for Vue developers or anyone generally curious about how to implement reactivity in JavaScript.

Marina Mosti

How to Make a Simple JavaScript Quiz — Although there are tools available to do this sort of thing, this raw step-by-step process might be a way to learn a variety of coding techniques.

Yaphi Berhanu & James Hibbard

Build a Game of Battleship with TypeScript & Spring Cloud. Free Course

Solace sponsor

Moving from React to Ember in 2020 — There’s not a lot of detail here but it’s interesting to see someone make this choice and the reasons for it. Despite a lack of React-level buzz, Ember remains a solid choice for building apps if you lean into its advantages.

John Rodkey

Thoughts and Best Practices on Building Apps with Vue and TypeScript

Stefan Bauer

Lazy Loading Components in Angular 9 — Have you ever wanted to lazy load an Angular component? Here is a technique you can use with Angular 9.

John Papa

What is Type Coercion in Vanilla JavaScript? — Not particularly for those already advanced with JavaScript, but this is a pretty detailed look at type coercion and includes lots of demos.

Chris Ferdinandi

How to Build a Tinder-esque Carousel with Vanilla JS

Simone Manzi

🔧 Code & Tools

Paged.js: Formats HTML Content Suitably for Creating PDF Output — I think this project’s site could win an award for sheer elegance, but it’s not just elegant, there’s tons of well formatted documentation too. Or.. if you prefer, the GitHub repo.

Cabbage Tree Labs

Hex Engine: A Modern 2D Game Engine for the Browser — Still in early development. A TypeScipt- and Canvas-based game engine designed to feel similar to React.

Lily Scott

A Much Faster Way to Debug Code Than with Breakpoints or console.log — Wallaby catches errors in your tests and code and displays them right in your editor as you type, making your development feedback loop more productive.

Wallaby.js sponsor

Serialize JavaScript 3.0: Serialize Objects to a Superset of JSON — Why? So you can serialize regular expressions, dates, functions, and (as of this week) Infinity, as well as the usual things JSON can handle.

Yahoo

Destiny: A 'Prettier' for File Structures — Scans a folder’s contents, creating a graph based on how the JS/TS files import each other, moving files as needed, then builds a “prettified” file structure. Not sure I’m a fan but it’s an interesting idea.

Ben Awad

Chardin.js: Simple Overlay Instructions for Your Pages/Apps — It’s not every week we get to announce a library’s new release after six years, but Pablo has taken over this classic library. Demo.

Pablo Fernandez

The Official Redux Template for Create React App v1.0 — There’s now an official Redux template for Create React App to quickly set up a React app with Redux Toolkit and a Redux store ready to go.

Mark Erikson

Micromodal: A Tiny JavaScript Library for Creating Accessible Modal Dialogs

Indrashish Ghosh

Panolens.js: A Panorama Viewer Control — A striking full-page demo is on display here, or you can jump straight to GitHub.

Ray Chen

Nano Events: A Tiny (78 Bytes) Event Emitter Library

Andrey Sitnik