---
title: "The tale of how static typing came to JavaScript"
publication: "JavaScript Weekly"
issue: 648
published_at: "2023-07-20"
canonical_url: "https://javascriptweekly.com/issues/648"
---

Plus a neat grid control, how React 18 improves performance, and how JavaScript is keeping old music alive. |        

#​648 — July 20, 2023 

[Read on the Web](https://javascriptweekly.com/issues/648)  

Together with [![AWS\](https://res.cloudinary.com/cpress/image/upload/c_fill,g_auto,e_trim,w_700/e_make_transparent/co_white,e_outline:10/v4cjjkcunep8a0x8edt9.png)](https://dev.to/aws/creating-a-real-time-multi-host-video-chat-in-a-browser-with-amazon-ivs-m44)  

JavaScript Weekly 

[![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60,q_auto/uiwyvxvbwgzcku5alq7l.jpg)](https://pkg-size.dev/)  

[pkg-size: Find the True, Current Size of an npm Package Without Leaving Your Browser](https://pkg-size.dev/) — A beautifully designed site that can show you the true size of an npm package (including dependencies) using the _actual packages_ which are 'installed' in a browser-based [WebContainers](https://blog.stackblitz.com/posts/introducing-webcontainers/)-powered environment. Hiroki has [🐦 a Twitter thread](https://twitter.com/privatenumbr/status/1681206731127554048) where he explains more about how it works. 

Hiroki Osame   

[TypeScript and the Dawn of Gradual Types](https://github.com/readme/featured/typescript-gradual-types) — From GitHub’s ReadME project comes a thorough journalistic take on how static typing made it into the JavaScript world, what TypeScript offers, some alternative approaches, and the possibility of adding type annotations to JavaScript iself. 

Mike Melanson (GitHub)   [![\](https://copm.s3.amazonaws.com/f79ce1dc.png)](https://dev.to/aws/creating-a-real-time-multi-host-video-chat-in-a-browser-with-amazon-ivs-m44) 

[Create a Real-Time Multi-Host Livestream with Amazon IVS](https://dev.to/aws/creating-a-real-time-multi-host-video-chat-in-a-browser-with-amazon-ivs-m44) — Amazon Interactive Video Service (Amazon IVS) enables developers to create dynamic video experiences, such as collaborative livestreams with multiple hosts. [Click here to learn more.](https://dev.to/aws/creating-a-real-time-multi-host-video-chat-in-a-browser-with-amazon-ivs-m44) 

Amazon Web Services (AWS) sponsor   

[Storybook 7.1: The Workshop for Building UI Components](https://github.com/storybookjs/storybook/releases/tag/v7.1.0) — v7.1 introduces [in-app onboarding](https://storybook.js.org/blog/in-app-tour-for-new-users/) for your newest team members, [zero-config styling support](https://storybook.js.org/blog/zero-config-support-for-tailwind-mui-styled-components-and-emotion/) for Tailwind, MUI, styled-components and MUI, Vue 3 source snippets, and more. 

Storybook Team   

[Five Inconvenient Truths about TypeScript](https://oida.dev/5-truths-about-typescript/) — A brief dose of reality for a world seemingly obsessed with TypeScript: _“If you want to get into TypeScript, don’t think you can leave JavaScript behind. It will find you, and it will get you.”_ 

Stefan Baumgartner   

**🎉 RELEASES:** 

- [Fresh 1.3](https://deno.com/blog/fresh-1.3) – The Deno web framework. Plugins can now inject routes and middleware into apps, there's `Deno.serve` support, and you can create async route components.
- [Downshift 8.0](https://github.com/downshift-js/downshift) – Primitives to build WAI-ARIA compliant React autocomplete, combobox & select components.
- [Node.js v18.17.0 (LTS)](https://nodejs.org/en/blog/release/v18.17.0) – Node 18 gets the Ada 2.0 WHATWG URL parser.
- [Fastify 4.20](https://github.com/fastify/fastify) – The fast, low overhead web Node.js framework.   

**⚡️ IN BRIEF:** 

- The [`Promise.withResolvers` proposal](https://github.com/tc39/proposal-promise-with-resolvers) has progressed from stage 2 to 3 at TC39, as has the [array grouping proposal](https://github.com/tc39/proposal-array-grouping), as well as [source phase imports.](https://github.com/tc39/proposal-source-phase-imports)
- 🗣 The folks on Hacker News [discussed why the site isn't being indundated](https://news.ycombinator.com/item?id=36780295) with links to new JavaScript frameworks recently. Has React 'won'? Has AI stolen the limelight? Or is [a JavaScript revolution quietly brewing..?](https://news.ycombinator.com/item?id=36780801)
- 👴🏻 A blog post from _1996_ popped up telling us [about the newest JavaScript features in Netscape 3.0](https://www.infoworld.com/article/2077267/new-javascript-features-in-navigator-3-0.html) – definitely a blast from the past. Say hello to the `typeof` operator!  

📒 Articles & Tutorials 

[![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60,q_auto/aubvqtdndifccxpvxokv.jpg)](https://postgresml.org/blog/how-we-generate-javascript-and-python-sdks-from-our-canonical-rust-sdk)  

['How We Generate JS and Python SDKs from a Canonical Rust SDK'](https://postgresml.org/blog/how-we-generate-javascript-and-python-sdks-from-our-canonical-rust-sdk) — [PostgresML](https://postgresml.org/) is an extension that adds machine learning functions into Postgres. Its team loves and prefers Rust but most of its users are using JavaScript or Python. What to do? Simultaneously write multi-language libraries using Rust.. 

Silas Marvin (PostgresML)   

💡 Psst.. if you use Postgres at all, [we have a Postgres newsletter too!](https://postgresweekly.com/)  

[Updating Code with `jscodeshift`](https://dev.clintonblackburn.com/2023/07/15/upgrading-typeorm-with-jscodeshift.html) — [TypeORM](https://typeorm.io/) is an ORM for Node that introduced some breaking changes requiring the author to update lots of calls in his code. A perfect time to use a ‘codemod’ to automate the job. Even if you don’t use TypeORM, this post might give you some ideas for other places to use such an approach. 

Clinton Blackburn   

[AI-Proofing Your Career For Tomorrow: Free Session by _Interview Kickstart_](https://learn.interviewkickstart.com/course/become-a-machine-learning-engineer-in-12-months-v4?utm_source=cooperpress&utm_campaign=cooperpress_java_soham) — Discover Your AI Career Path (AI/ML vs Data Science). Take an informed decision: Insights from FAANG+ AI/ML Engineers. Register for a free session. 

Interview Kickstart sponsor   

[How React 18 Improves App Performance](https://vercel.com/blog/how-react-18-improves-application-performance) — If you’ve not entirely kept up with how things have changed or developed in React with regards to concurrent rendering, transitions, Suspense, and even React Server Components, this is a fantastic review and primer to get up to speed on how React's newer features dramatically help with performance. 

Lydia Hallie (Vercel)   

[300ms Faster: Measures Taken to Reduce Wikipedia's Total Blocking Time (TBT)](https://www.nray.dev/blog/300ms-faster-reducing-wikipedias-total-blocking-time/) 
Nicholas Ray   

[On the Origins of JSX and Why It Exists](https://dodov.dev/blog/origins-of-jsx-and-why-it-exists) 
Hristiyan Dodov  

🛠 Code & Tools 

[![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60,q_auto/rda5qopgxfecarlaqec3.jpg)](https://wavesurfer-js.org/)  

[wavesurfer.js 7: Audio Waveform Player](https://wavesurfer-js.org/) — If you’re creating a podcast player, audio experience, or anything where seeing an interactive audio waveform could be useful, check this out. [GitHub repo.](https://github.com/katspaugh/wavesurfer.js) 

katspaugh and contributors   

[TOAST UI Grid: A Customizable Grid Control for the Web](https://ui.toast.com/tui-grid) — A powerful MIT-licensed grid-style control for the display, editing, and management of data. It comes from the same folks as [TUI Editor](https://github.com/nhn/tui.editor) and [TUI Calendar](https://ui.toast.com/tui-calendar/) and while it’s happy on its own, there are wrappers for Vue and React too. [GitHub repo.](https://github.com/nhn/tui.grid) 

NHN   

[Breakpoints and `console.log` is the Past, Time Travel is the Future](https://wallabyjs.com?utm_source=cooperpress&utm_medium=javascriptweekly&utm_content=javascriptweekly) — 15x faster JavaScript debugging than with breakpoints and console.log, supports Vitest, jest, karma, jasmine, and more. 

Wallaby.js sponsor   

[Pines: A Library of UI Components for Alpine.js and Tailwind Projects](https://devdojo.com/pines) — Includes sliders, tooltips, accordions, modals, and others. The CSS-only components are usable in any Tailwind project while the ones that require JS are designed for use with Alpine.js. 

devdojo   

[YouTube.js 5.5: A Wrapper Around YouTube's Private API](https://github.com/LuanRT/YouTube.js) — One of those things you'd expect to be quickly blocked somehow, but it's 18 months old, so... 😆 The fun isn't just for Node or Deno users – it'll work in the browser _if_ you can proxy the requests through your own server. 

LuanRT   

[Eruda 3.0: A Console for Mobile Browsers](https://github.com/liriliri/eruda) — If you’re in a situation where you have no access to DevTools, you can add Eruda to your page and it provides a sort of virtual devtools you can use from any browser, including on mobile. 

LiriLiri   

[Reagraph 4.10: WebGL Graph Visualization Library for React](https://reagraph.dev/?path=/story/demos-cluster--three-dimensions) — Here’s [a basic code example.](https://reagraph.dev/?path=/docs/docs-getting-started-basics--docs) This week’s release adds support for three dimensional clustering. [GitHub repo.](https://github.com/reaviz/reagraph) 

REAGRAPH   

[brotli-wasm 2.0: A Brotli Compressor and Decompressor](https://github.com/httptoolkit/brotli-wasm) — Covers both Node _and_ the browser by means of WebAssembly. 

HTTP Toolkit   

[Pacquet: A New, _Experimental_ Package Manager for Node](https://github.com/anonrig/pacquet) — From a Node.js core member, no less. 

Yagiz Nizipli   

- [Shareon 2.2](https://shareon.js.org/)
 ↳ Lightweight, stylish 'share' buttons for social networks.
- [Helipopper 8.0](https://github.com/ngneat/helipopper)
 ↳ Tooltips and popovers for Angular. ([Demos.](https://ngneat.github.io/helipopper/))
- [Ink 4.3](https://github.com/vadimdemedes/ink)
 ↳ React for interactive command-line apps.
- 📅 [React Calendar 4.4](https://github.com/wojtekmaj/react-calendar)
- ♖ [React Chessboard 4.0](https://github.com/Clariity/react-chessboard)    

💻 Jobs  

[Find JavaScript Jobs with Hired](https://hired.com/join/?utm_source=newsletter&utm_medium=sponsor&utm_campaign=%28b2c%29%28l-all%29%28r-all%29%28cooper-javascriptweekly%29&utm_content=find-your-next-job) — Hired makes job hunting easy-instead of chasing recruiters, companies approach you with salary details up front. Create a free profile now. 
Hired   

🧑‍💻 Got a job listing to share? _[Here's how](https://booking.cooperpress.com/jobs)_.   

🎵 Thank you for the music.. 

[![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60,q_auto/wvru00a9exmtyeyp4zxj.jpg)](https://chiptune.app/)  

[Chip Player JS: Browser-Based MIDIs, MODs and Game Music](https://chiptune.app/) — The creator of this site has, like me, a fascination with old digital music – MIDI files, trackers, and the like. Rather than keep an old computer running, he decided to [build a browser based music player](https://www.mattmontag.com/music/chip-player-js) for such files. 

Matt Montag   

P.S. If you're looking for something specific to listen to, [the music by famed Norwegian tracker Jogeir Liljedahl](https://chiptune.app/browse/Modland/coma's%20favorite%20Protracker/Jogeir%20Liljedahl/) is well worth a try – particularly _Overture_ or _Guitar Slinger._ Or how about [Donkey Kong Country's](https://chiptune.app/browse/Nintendo%20SNES/Donkey%20Kong%20Country/) dreamy _Aquatic Ambience?_ It's striking how trackers managed to squeeze so much down into a few hundred kilobytes by the heavy reuse and manipulation of samples.         

Published by [Cooperpress](https://cooperpress.com/) and edited by [Peter Cooper](https://twitter.com/cooperx86) 

'JavaScript' is a trademark of Oracle Corporation in the US
We are not endorsed by or affiliated with Oracle. 

[Change your email address](https://javascriptweekly.com/edit_subscription/*|UID|*) or [stop getting this newsletter](https://javascriptweekly.com/leave/*|UID|*). 

© Cooper Press Ltd · Fairfield Enterprise Centre, Louth, LN11 0LS, United Kingdom