JavaScript Weekly Issue 517: December 4, 2020

#517 — December 4, 2020

Unsubscribe | Read on the Web

✍️ Sometimes we have weak issues, sometimes we have strong issues.. I think this is one of the latter! Lots of both fun and useful stuff here, from a JavaScript driven mannequin(!) to a fantastic serverless use case many of us could benefit from. Enjoy!
__
Peter Cooper, your editor

JavaScript Weekly

WMR: A Tiny All-in-One Development Tool for Modern Web Apps — From the Preact team comes an interesting ‘everything you need in a single box’ tool for putting together webapps with bundling, JSX, CSS modules support, and more. Get started with npm init wmr projectname if you dare or see this Twitter thread for just why this is exciting.

Preact

What People in Tech Had to Say About JavaScript When It Debuted in 1995 — It’s 25 years (today!) since a press release went out from Netscape and Sun Microsystems heralding the arrival of JavaScript. 28 then industry leaders chimed in with what they thought. We’re giving Bud Colligan a C- and Rose Ann Giordano an A+ for their comments.

Chris Brandrick

New Course: Production-Grade TypeScript — Use the TypeScript language at scale to increase the developer experience and productivity of your teams. Learn to manage even the most ambitious TypeScript projects with confidence and ease.

Frontend Masters sponsor

▶ Vue vs. Svelte with Evan You and Rich Harris — Evan You, the creator of Vue.js, and Rich Harris, creator of Svelte, both got on the same podcast to talk about the future of frontend development. (Note: There is cursing.)

The Undefined Podcast podcast

• The first release candidate of Snowpack v3.0 is out and there's a new way to load npm imports on-demand.. no more npm install step needed! We'll feature this again when it's released in January.
• Chrome 88 is in beta but lots of changes are forthcoming, including Atomics, SharedArrayBuffer (gated), the Digital Goods API, and the removal of Web Components v0 support.
• AWS Lambda (the serverless platform you can throw JavaScript - and more - at to have it run at your beck and call) now supports up to 10GB of memory and 6 vCPUS, 1ms billing granularity, and functions in containers.

• PWAdvent is an advent calendar covering progressive browser API techniques, like the Web Share API, manifests, and service workers.

📚 Tutorials, Opinions and Stories

Dynamically Generating Social Share Images Serverlessly — This is a perfect use case for a serverless function and a great example of post that pulls together a variety of ideas for a creative end result.

Ryan Filler

Puppeteer vs Selenium vs Playwright, A Browser Automation Speed Comparison — Spoiler: There are differences in microbenchmarks but in real world scenarios it’s basically a wash. Use whichever suits your use case.

Giovanni Rago (Checkly)

AngularJS Security Fundamentals — A collection of AngularJS security fundamentals for web developers.

Snyk sponsor

Lots of Ways to Use Math.random() in JavaScript — I’m digging the level of creativity being shown in these examples. Lots to play with, perfect for learners.

Jwahir Sundai

▶ Building a Svelte Static Website with Smooth Page Transitions — An 80-minute live coding session walking through building a site with Svelte.js with Three.js and GSAP-powered smooth page transitions.

Yuriy Artyukh

How to Understand the reduce Function in 5 Examples — Summing, seeking, chaining, and generally bringing things together.

Valeri Karpov

▶ Converting an Old jQuery Plugin to Vanilla JS — Lettering.js is a neat jQuery plugin for getting ‘letter level’ control over Web typography. It hasn’t been updated for three years, but here’s a screencast showing an attempt at removing the jQuery dependency.

Chris Ferdinandi

Introducing Repluggable: Solving The Dependency Model Challenge with Micro Frontends & Contracts

Wix Engineering sponsor

Reading John Resig's 'Pro JavaScript Techniques' 14 Years Later — Is anything still relevant from a popular book written by jQuery’s creator back in 2006? Mark thinks so.

Mark Reyes

10 JavaScript Array Methods to Simplify Your Code

A Grab Bag of Handy JavaScript 'Tricks'

JSON Formatter Live: A Minimalist JSON Formatter & Minifier, Installable as a PWA — Doesn’t store any data, is keyboard friendly, and will give you live inline error messages when you add any code.

Alexandru Năstase

JSONEditor: A Component for Viewing and Editing JSON — If your app needs to let users work with JSON, this is worth a look. It supports several models (including a tree view) and is cross browser compatible. Live demo.

Jos de Jong

Stream Chat React Native v2.0.0 Released — The official React Native and Expo library of components for Stream Chat (a service for building chat apps) is now rewritten in TypeScript to ensure type safety for easier-to-read code/debugging.

Stream sponsor

JsDiff: A Visual Comparison of JavaScript Library Metrics — NPM downloads, Google Trends, GitHub stars, open issue count, etc.

Alexey Antipov

Over 100 JavaScript Algorithms and Data Structures Demonstrated — Examples of many common algorithms (e.g. bit manipulation, Pascal’s triangle, Hamming distance) and data structures (e.g. linked lists, tries, graphs) with explanations. Available in other languages too like Chinese, Korean, French, and Spanish.

Oleksii Trekhleb et al.

Mannequin.js: A Library to Render and Manipulate a Mannequin Figure — I can’t think of any use I’d have for a animated human figure, but this is nonetheless a neat piece of work. GitHub repo.

Pavel Boytchev

Compressor.js: Client-Side Image Compressor — The idea is you’d use this if you want to compress supplied images before uploading them, say. GitHub repo.

Chen Fengyuan

noUiSlider: Lightweight Range Slider with Full Multi-Touch Support — No dependency. Fits into wherever you need it. Great homepage too. GitHub repo.

Leon Gersen

auth.js 3.0: GitHub API Authentication Library for Node and Browser — An official library, no less, and it supports four auth strategies.

GitHub

vue-select: Everything You Wish <select> Could Be, as a Vue.js Component
Jeff Sagal

💻 Jobs

Software Developer (Austin, TX) — We're a largely ex-Pivotal tech team looking for developers with all levels of experience. If you enjoy learning, collaborating, and creative problem solving then let's talk.

Stronghold Resource Partners

JavaScript Developer at X-Team (Remote) — Join the most energizing community for developers and work on projects for Riot Games, FOX, Sony, Coinbase, and more.

X-Team

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