A case for weak dependencies in JavaScript

#515 — November 20, 2020

Unsubscribe  |  Read on the Web

JavaScript Weekly

TypeScript 4.1 Released — The ever popular ‘JavaScript with types’ takes more steps forward with template literal types, key remapping in mapped types, recursive conditional types, and support for React 17’s upcoming jsx and jsxs factory functions. If you’re a Create React App user though, don’t rush to upgrade just yet as some problems have been reported.

Daniel Rosenwasser (Microsoft)

A Tale of Going from JavaScript to WebAssembly — A developer of a ‘ultra resolution’ storytelling platform tells the tale of upgrading their Web client’s performance by moving from a pure JavaScript approach to one turbocharged with WebAssembly. There’s a lot to learn here.

Marcel Duin

Monitor Frontend Performance With User-Centric Metrics — Traditional metrics like page load aren’t enough to guarantee that you’re providing a solid user experience. Learn to track interactivity metrics like “firstInteraction” so you can build for better impact, and keep users coming back.

New Relic sponsor

Prettier 2.2 Released — The popular opinionated code formatter gains TypeScript 4.1 support, comes as ES modules so you can use it directly within the browser, and supports two new JavaScript parsers: espress and meriyah.

Sosuke Suzuki

Electron 11 Released with Experimental Apple Silicon Support — The popular cross platform desktop app environment upgrades its dependencies across the board (hi Chromium 87!) and begins to take steps into the Darwin arm64 world.

GitHub / OpenJS Foundation

📚 Tutorials, Opinions and Stories

The Case for Weak Dependencies in JS — If you’re using ES modules and want to check if one is present before using it in some optional way, what do you do? Lea explains why this would be useful and shares some ideas with how it could be implemented.

Lea Verou

The Most Accurate Way to Schedule a Function in the Browser — A detailed analysis of three JavaScript timeout strategies and how they perform in thousands of web contexts. A bit of a micro-optimization for sure, but it’s interesting to dig into the weeds like this.

Benoit Ruiz

10 React Security Best Practices — A checklist to help you and your team find and fix security issues in your React applications.

Snyk sponsor

Importing React Through the Ages — Kent looks at the wide variety of ways you can import React now and why he prefers a specific one.

Kent C. Dodds

Creating WebGL Effects with CurtainsJS — A way to add neat WebGL effects to <image> and <video> elements of an already “completed” web page.

Zach Saucier

What’s New In Vue 3? — Vue 3 has already been out for two months, but if you’ve not tried it out or just want to see some practical examples of its changes, this is for you.

Timi Omoyeni

A Super Simple Start to Firebase Functions — I find Google’s cloud services hard to navigate at the best of times so this sort of introduction is always much welcomed.

Kent C Dodds

Introduction to Fullstack, Type-Safe GraphQL — This tutorial teaches you how to build from scratch an entirely type-safe, fullstack web app, using GraphQL with a database attached.

Prisma sponsor

The Difference Between Event Handlers and addEventListener — Let’s say you have a button element. You can assign a function to button.onclick to catch click events or use button.addEventListener("click", ...) – how do they differ?

Twan Mulder beginner

Integrating Cobol(!) with JavaScript — Run COBOL applications and modify them with JavaScript on GraalVM. Not likely to be something many of you will want or need to do, but it’s interesting!

Christoph Schobesberger

We Chose Ember in 2015 and It’s Still A Good Decision in 2020

Tomek Nieżurawski

Building Modern Native Add-ons for Node in 2020

Wu, Schulhof, Schlight, Eady, Dawson, and Del Gobbo

Angular CLI: Three Options You Didn’t Know About the Component Schematic

Amadou Sall

🛠 Code & Tools

How Skypack Lets You Use npm Packages on CodePen — I’m a huge fan of CodePen for throwing together quick Web and JavaScript experiments, but loading dependencies has always been a bit old-school. No more. Skypack and ES6 imports now let you bring in whatever npm packages you need.

CodePen Blog

jose: Universal ‘JSON Web Almost Everything’ — Did you know there were so many “JSON Web” specs? JSON Web Signature, JSON Web Tokens, JSON Web Encryption, and more. This library aims to tackle most of them in both Node and browser. JWA, JWS, JWE, JWT, JWK and more are here.

Filip Skokan

Momoa JSON: A JSON Parser, Tokenizer, Traverser, and Printer — Useful for a more fine-grained approach to parsing JSON data that’s not covered by JSON.parse()

Nicholas C. Zakas

Building the Best Web Gallery, and Why the Heck It Was So Hard

Wix Engineering sponsor

A One Line Function to Generate a Unique String ID — For when a UUID is overkill.

Simon Høiberg

Harold: A CLI Tool That Compares Frontend Project Bundles in Size — This tool makes it easier to compare bundle sizes by taking snapshots that you can then review to manage how a project’s size is changing.

FunBox

Immer 8.0: The Popular Immutable State Library

Cosha 1.1: Add Colorful Shadows to Web Images

VeeValidate: Template Based Validation for Vue.js

vue-use-infinite-scroll: A Vue Composition Function to Make Infinite Scroll Simple

Ditox: ‘Detoxed’ Dependency Injection for JS, TypeScript and Flow

💻 Jobs

Find a Job Through Vettery — Create a profile on Vettery to connect with hiring managers at startups and Fortune 500 companies. It’s free for job-seekers.

Vettery

🎵 A brief musical aside..

Hit play to start the beat and then jam along on the blues guitar to express yourself. This is a fantastic little CodePen demo (written in JavaScript, naturally) and should put a smile on your face 😁 Thanks to Greg Hovanesyan for this!