Node to keep an eye on your code

#​610 — October 14, 2022

Unsubscribe  |  Read on the Web

JavaScript Weekly

Intl Explorer: A Way to Learn and Experiment with the ECMAScript Internationalization API— Supported by all major browsers, the Intl object provides access to the ECMAScript Internationalization API, a suite of functions for language sensitive string comparison, number formatting, and more. This site provides an interactive way to learn about how it operates.

Jesper Orb

▶  Creating Your Own JavaScript Runtime with V8— Want to join the pantheon of developers famed and esteemed for creating things like Node, Deno, and Bun by creating a JS runtime of your own? Erick takes us deep into the main moving parts and shows us how to tie them together for ourselves. While you might not build the next Deno or Bun for yourself, there’s a lot to learn about JS runtimes here.

Erick Wendel

🖊 If you prefer a written alternative, Deno's Bartek Iwańczuk has tackled this topic before (at a higher level) in "Roll your own JavaScript runtime."

Event Driven Node.js Hackathon: +$3k in Prize Value— There are still 14 days left, and more than enough time to still submit a project that could win. Courier Hacks: Open Source is holding a contest to see who can build a casual encrypted messaging app. Get started now and you could be the winner.

Courier.com sponsor

Node v18.11.0 (Current) Released; Gains 'Watch Mode'— Node’s latest release doesn’t gain a lot, but does gain an experimental --watch feature that automatically restarts the running process when imported files are changed (reminiscent of nodemon) – this feature was discussed at length recently.

Danielle Adams (Node.js Project)

Lerna Reborn: What’s New in Version 6?— Far from being obsolete or deprecated, the Lerna monorepo-oriented JavaScript build system is taking big strides forward under Nrwl’s stewardship. v6 gains a lot of speed with efficient task scheduling and caching by default, a VS Code extension, Prettier support, and more. GitHub repo.

Juri Strumpflohner

IN BRIEF:

• Upstart JavaScriptCore-based runtime Bun has a new version out that boasts a big boost in HTTP server performance as well as zero-downtime hot reloading. It's fun seeing the project come along!

• 💄 javascript.makeup is a cute new online JavaScript 'playground' that keeps it minimal. (Alternatives: JSBin, JSFiddle)

• Storybook 7.0 will have first class support for Vite.

• 📊 The results from the first ever State of GraphQL developer survey are out.

RELEASES:

• Volar 1.0– Official IDE tooling support for Vue.js.

• Ant Design 5.0 Alpha– Popular React UI library.

• Rollup 3.1– The ES module bundler.

• RxDB 13.5– Offline-first, reactive database for JS apps.

• Qwik 0.11– 'No hydration', HTML-first framework.

• Jest 29.2& Cypress 10.10– Testing frameworks.

📒 Articles & Tutorials

The Future of Rendering in React— This kicks off with a review of current patterns (CSR/SSR) and then moves on to some of the new rendering patterns such as streaming SSR and server components. This was also the basis of a recent talk at React Bangalore.

Prateek Surana

Choosing the Best Node.js Docker Image— If you feel tempted to just throw FROM node into your Dockerfile, think again – there are other options to consider.

Liran Tal (Snyk)

Why We Use Babylon.js Instead of Three.js in 2022— The Blender addon, support from Microsoft, and Babylon’s rather advanced inspector tooling all won Gordon’s team over.

Gordon Hempton

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

Wallaby.js sponsor

How I Created a GameBoy-Style Game in 13KB— A developer explains his js13KGames 2022 entry (we linked to the winners last week).

Kacper Kula

▶  Full Stack for Front-End Developers: Build Your First AWS Amplify and React App— Ali Spittel leads dev advocacy at AWS Amplify and has released the first in a series of free courses on end-to-end development with the Amplify platform. Check out the ▶️ brief trailer.

Ali Spittel (AWS Amplify)

How to Build SVG Line Charts with React, SSR and Tailwind CSS— How to roll your own SVG based line charts in a server-side rendered React app based around either Next.js or Gatsby.

Paul Scanlon

A Semantic HTML Trick for React Components
Queen Raae

Using TypeScript Type Guards
Robin Wieruch

How Wix Uses Threading in Node.js Apps to Cut Its Kubernetes Pod Costs
Jessica Wachtel (The New Stack)

How Using Default Exports Makes JavaScript Harder to Read
Tomasz Cichociński

🛠 Code & Tools

Javet 2.0.0: Embed Node and V8 in Java Apps— Lets you spin up V8 interpreters or full Node.js runtimes within JVM-based apps. There’s a slide presentation to sell you on the idea and demonstrate how the integration works. The name Javet comes from 'Java, V, and Eight'.

Sam Cao

Knip: Find Unused Files, Dependencies and Exports in TypeScript Projects— Knip is Dutch for “cut” which is appropriate for a tool that trims away things not being used in your project. To compare it to similar existing tools, there’s this handy chart.

Lars Kappert

Don’t Let Your Issue Tracker Be a Four-Letter Word. Use Shortcut

Shortcut (formerly Clubhouse.io) sponsor

Editly 0.14.0: Declarative Command Line Video Editing— Brings Node and FFmpeg together to let you more programatically edit and construct videos instead of wrangling with arcane ffmpeg command line options.

Mikael Finstad

Sortable: 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.

SortableJS

React Table Library: The 'Almost Headless' Table Library— Has an interesting showcase site showing off what you can do with it. It’s happy both on the client and server-side and supports TypeScript too.

Robin Wieruch

Offline Support for React Native Is Here! Try V5 of Stream's Chat SDK

Stream sponsor

melonJS 14.0: A Lightweight 2D Game Engine— It’s over a decade old, but still going strong. While it’s 2D, it’ll use WebGL for performance (if available). Also offers Web Audio API support, polygon based collision detection, input device support, and more. Here’s an example game.

melonJS Team

React Modern Audio Player: An Audio Player with Waveform Visualization— See it in action here.

⚡️ OTHER QUICK RELEASES:

• SlickGrid 3.0
  ↳ Fast JavaScript grid/spreadsheet control. (Demos.)

• Faker 7.6– Fake data generation library.

• React Tooltip 4.4– Bet you can guess what it does.

• Mineflayer 4.5– Build Minecraft bots in JS.

• CsvToMarkdownTable 1.2– Turn CSV into Markdown tables.

♟ Shall we play a game?

Betafish: A Chess Engine and AI Move Finder— The author explains the algorithm used and there’s a playable version online if you fancy a 'nice game of chess.'

Gavin Ong

Or, if you prefer, you can build your own Tic Tac Toe game in just ten (quite meaty) lines of JavaScript..