#522 — January 22, 2021

Unsubscribe  |  Read on the Web

JavaScript Weekly

The JavaScript 'Rising Stars' of 2020 — Fingers crossed this is our final ‘look back’ at 2020, but the ‘Best of JS Rising Stars’ roundup comes out at the start of each year and shows off the fastest growing JavaScript tools and projects over the past year based on GitHub stars (which, yes, is by no means a definitive metric). Stand out projects include Deno, Playwright, esbuild, and Rome, all of which we expect to see great things of in 2021.

Michael Rambeau and Benjamin Blackwood

EStimator.dev: The Modern JavaScript Savings Calculator — Enter a URL and this tool will tell you how much faster the site could be if the code was switched over (or compiled) to modern JavaScript. Read about it here.

Google Chrome Labs

Spreadsheet Viewer: Render XLSX Files In the Browser — Spreadsheet Viewer is a client-side component that allows users to preview XLSX file without the need of opening it in an external app. It is mobile-friendly, and supports all major frameworks such as React, Angular, and Vue. Check out the live demo.

Handsontable sponsor

JerryScript: A Ultra-Lightweight JS Engine for the Internet of Things — If you’ve got a constrained environment (e.g. a microcontroller, a watch, or the like) with only kilobytes of RAM to hand, this is the sort of thing you might want to try. It’s ES 5.1 compliant and, as of this week, supports realms, BigInt, class fields, flatMap, and more.

JerryScript

How I Build JavaScript Apps in 2021 — A freelance developer shares his development approach from avoiding build processes and transpiling, to testing and re-using his own work.

Tim Daubenschütz

Quick Bits

• The Node.js team have opened up their 2021 user survey and want you to take it. Don't forget to name drop us in question 59 😄


• Dr. Axel Rauschmayer is working on a ES2021 edition of his JavaScript for Impatient Programmers book and you can stay up to date on it via this list.


• GitHub has made it easier to rename existing branches in repos – such as if you want to change master to main.



• A look at Google's progress on migrating Puppeteer to TypeScript.
  



• The ▶️ latest episode of the TC39er podcast features Ujjwal Sharma, a compiler hacker and Node.js and V8 contributor.

📖 Articles, Opinion & Tutorials

Some Language-Agnostic Guidelines on Naming Variables — JavaScript is used although the basic principles can be applied to most languages.

Artem Zakharchenko

13 JavaScript One-Liners That’ll Make You Look Like a Pro — I think the title oversells it a little, but nonetheless, you might pick up a tip or two from these well presented examples.

Twan Mulder

Running Rust in WebAssembly in a Pool of Concurrent Web Workers in JavaScript — “I would like to share a little experiment I did for no other reason than to show I could.” Fantastic. This sort of thing is only going to become more popular, too. This will be WebAssembly’s decade.

Alessandro Genova

Breakpoints and console.log Is the Past, Time Travel Is the Future — 15x faster JavaScript debugging than with breakpoints and console.log.

Wallaby.js sponsor

Capturing Hacker News Mentions with Node and MongoDB — If you don’t want to read the ‘orange site’ (as it’s often called) but you’d like to know if something gets mentioned there, here’s one option.

Nic Raboy

Async Loops and Why They Fail — Mixing loops with async calls in JavaScript can produce unexpected results. First in a four part series.

Federico Kereki

▶  10 JavaScript Clean Code Examples — Thoughts on ten examples of approaches worth considering if you’re trying to keep your code clean. It’s based on this article by Ibeh Ubachukwu.

Adrian Twarog

Creating Comic Book Speech Bubbles with SVG and JavaScript — Can comic-style speech bubbles be rendered in both an accessible and visually authentic manner? Yes, with a little work.

Paul Spencer

Drawing 2D Metaballs with WebGL2 — An in-depth tutorial on how to code 2D visuals using WebGL2 (the newest version of WebGL and supported by most browsers save for Safari. (Hands if you misread this as 'meatballs' at first.. 🤚)

Georgi Nikolov

Learn to Do File Uploads from the Client-Side Without Managing Storage

ImageKit.io sponsor

▶  Tips For Your Next JavaScript Interview — A handful of useful suggestions in an eight-minute video.

Chris Power

Using Dexie.js to Write Slick IndexedDB Code

Andy Haskell

Sortable 1.13.0: Create and Reorder Lists with Drag-and-Drop — Supporting all modern browsers and touch devices, this library handles list-to-list dragging with auto scrolling, CSS animations, multi-drag support, and more. Lots of demos on the homepage. GitHub repo.

SortableJS

Forgo: A Tiny UI Runtime for Modern Web Apps — This is a small library that lets you build apps using JSX, similar to React. But unlike React, the syntax carries over from DOM APIs and JS so it’s easy to learn.

forgojs

Boa v0.11: An Experimental JS Lexer, Parser and Compiler — Written in Rust and led by a TC39 member, Boa aims for full spec compliance. Why would you use this? Maybe you’re interested in the current trend of writing JavaScript tooling in Rust or Go and would like an embeddable JavaScript implementation there..

Jason Williams

Scout APM - Leading Edge Performance Monitoring Starting at $39/Month — Streamline troubleshooting with real-time alerts & tracing logic that ties issues to source code. Try free for 14 days.

Scout APM sponsor

jsPDF 2.3: Client-Side PDF Generation for Everyone — There’s a live, interactive demo here.

James Hall

Focus Rings: A Centralized System for Displaying and Stylizing Focus Indicators — From the Discord team, a React-based solution to render clean and consistent focus ring indicators for keyboard navigation.

Discord

JZZ 1.2.0: A MIDI Library for Node and the Browser — Brings the Web MIDI API to Node so you can send, receive and play MIDI messages from both Node and the browser on Linux, macOS and Windows.

Jazz Soft

@vueuse/sound: A Vue Composable for Playing Sound Effects — A Vue version of the useSound React hook.

Yaël Guilloux

eslint-plugin-vue 7.5.0: Official ESLint Plugin for Vue.js

Vue.js Team

💻 Jobs

Software Engineer, Full-Stack (Fully Remote/US) — Supply chain accounts for ~10% of Global GDP. Join our small team to change how organizations work across the global supply chain.

Isometric Technologies

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

Hired

✅ A Neat Looking Extension

CodeCopy: A Browser Extension That Adds 'Copy to Clipboard' Buttons on Every Code Block — Works with GitHub (including gists), MDN, Stack Overflow (and other Stack Exchange sites), Medium, CSS Tricks, and more.

Zeno Rocha