--- title: "19 hours of D3.js??" publication: "JavaScript Weekly" issue: 589 published_at: "2022-05-13" canonical_url: "https://javascriptweekly.com/issues/589" --- Plus building a JavaScript accordion, Jest goes to the OpenJS Foundation, comparing framework performance, and TypeScript 4.7 RC. | 🇺🇦 #​589 — May 13, 2022 [Unsubscribe](https://javascriptweekly.com/leave/*|UID|*)|[Read on the Web](https://javascriptweekly.com/issues/589) JavaScript Weekly [![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60/fd1lbcj83cptwwhjybcm.jpg)](https://www.smashingmagazine.com/2022/05/google-crux-analysis-comparison-performance-javascript-frameworks/) [Using Google's CrUX to Compare Performance of JS Frameworks](https://www.smashingmagazine.com/2022/05/google-crux-analysis-comparison-performance-javascript-frameworks/) — Chrome User Experience Report ([CrUX](https://developers.google.com/web/tools/chrome-user-experience-report)) is a dataset of user experience metrics collected from real world Chrome users and it’s possible to use it to analyze and compare the performance profiles of different UI frameworks, as done by Dan here. Dan Shappir [Thoughts on React's Forthcoming `useEvent` Hook](https://typeofnan.dev/what-the-useevent-react-hook-is-and-isnt/) — Last week, Dan Abramov posted [an RFC](https://github.com/reactjs/rfcs/blob/useevent/text/0000-useevent.md) for a new fundamental React hook or defining an event handler that ‘sees’ fresh props/state but has a stable function identity. _(Don't miss [this week's issue of React Status](https://react.statuscode.com/issues/288) for more like this.)_ Nick Scialli [![\](https://copm.s3.amazonaws.com/db2866f5.png)](https://postlight.com/podcast?utm_source=jsweekly&utm_medium=email&utm_campaign=editaudio) ▶[Are You Looking for Answers to Tough Leadership Questions?](https://postlight.com/podcast?utm_source=jsweekly&utm_medium=email&utm_campaign=editaudio) — Postlight designs and builds software platforms for some of the biggest companies in the world. Join Postlight leaders Rich Ziade, Paul Ford, Gina Trapani and Chris LoSacco for honest conversations on tech, business, ethics, and culture. Postlight sponsor ▶[Data Visualization with D3: A 19 Hour(!) Course](https://www.youtube.com/watch?v=xkBheRZTkaw) — I hope you’ve got some spare time for this. This is basically a mashup of D3 data visualization tutorial livestreams made by [a popular datavis YouTuber.](https://www.youtube.com/c/currankelleher/videos) There’s a _lot_ jammed in here and I love how easy it is to see everything as he uses a huge font size :-) Dr. Curran Kelleher / freecodecamp Note: freeCodeCamp seems to be posting a lot of long 'course' style screencasts recently if you're interested. Topics include [React Router 6](https://www.youtube.com/watch?v=59IXY5IDrBA), [neural networks in JS](https://www.youtube.com/watch?v=Rs_rAxEsAvI), [React](https://www.youtube.com/watch?v=bmpI252DmiI), and [Firebase](https://www.youtube.com/watch?v=fgdpvwEWJ9M). [Meta Transferring Jest Project to the OpenJS Foundation](https://engineering.fb.com/2022/05/11/open-source/jest-openjs-foundation/) — Meta, née Facebook, created the now popular Jest JavaScript testing framework over 10 years ago and while it’s going to continue using it internally, they now consider it ‘feature complete’ and so think it may thrive better being managed in the broader community. Rick Hanlon (Meta) **IN BRIEF:** - Serverpless platform AWS Lambda now has [an official Node.js 16 (LTS) runtime.](https://aws.amazon.com/blogs/compute/node-js-16-x-runtime-now-available-in-aws-lambda/) As [does Vercel](https://vercel.com/changelog/node-js-16-lts-is-now-available). - 📅 [NodeConf EU](https://www.nodeconfremote.com/) is taking place this October 3-5 in Ireland. There's a [call for speakers](https://sessionize.com/nodeconf-eu-2022) open until July 6 if you want to speak. - [An enhanced 2FA experience](https://github.blog/2022-05-10-enhanced-2fa-experience-for-your-npm-account/) is on its way to your npm account soon. Why? Security and [shenanigans like this](https://www.theregister.com/2022/05/10/security_npm_email/). - Cloudflare, Vercel, Shopify and contributors to both Node and Deno [have established a new community group](https://blog.cloudflare.com/introducing-the-wintercg/) focused on the interoperability of standard Web APIs in non-browser JS environments. It's called WinterCG for short and _The New Stack_ has [more of a writeup here](https://thenewstack.io/wintercg-to-standardize-browser-apis-for-js-server-side-runtimes/). - 🎂 Talking of Deno, [it's 4 years old today.](https://twitter.com/deno_land/status/1525119512277725184) - [TypeScript 4.7 Release Candidate](https://devblogs.microsoft.com/typescript/announcing-typescript-4-7-rc/) is now available – we'll focus on it more when the final release drops. **RELEASES:** [Solid 1.4](https://github.com/solidjs/solid/releases/tag/v1.4.0) – Fantastic declarative UI library. [Wild Wild Path 3.0](https://github.com/ehmicky/wild-wild-path) – Dig into objects with paths and queries. [GraphQL Yoga 2.0](https://www.the-guild.dev/blog/announcing-graphql-yoga-v2) – Complete GraphQL server functionality. [Hexo 6.2.0](https://github.com/hexojs/hexo) – Node.js blog framework. [graphql-schema-linter 3.0](https://github.com/cjoudrey/graphql-schema-linter) – Validate GraphQL schema definitions. [pnpm 7.1.0](https://github.com/pnpm/pnpm) 💻 Jobs [Frontend Developer](https://grnh.se/aab98d483us) — Konrad is hiring Frontend developers to join our team in building products for the world’s most exciting companies. Konrad Group [JavaScript Developer at X-Team (Remote)](https://x-team.com/remote-javascript-developer-jobs/?utm_source=cooperpress&utm_medium=email-ad&utm_campaign=cooperpress-js&utm_content=js) — Join the most energizing community for developers and work on long-term projects for Riot Games, FOX, Sony, Coinbase, and more. X-Team [Senior Software Engineers at Turo (SF | Remote/Hybrid Options)](https://www.beforeyouapply.com/team/engineering-at-turo?) — The world's largest car sharing marketplace on a mission to put the world’s 1.5B cars to better use. We're hiring BE, FE, ML, iOS, Android & DevOps roles at all levels. Turo [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) — Create a profile on Hired to connect with hiring managers at growing startups and Fortune 500 companies. It's free for job-seekers. Hired 📒 Articles & Tutorials [![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60/z0v9gwfo7ewhh3uask6b.jpg)](https://www.taniarascia.com/musical-instrument-web-audio-api/) [Building a Musical Instrument with the Web Audio API](https://www.taniarascia.com/musical-instrument-web-audio-api/) — One of our favorite writers in the frontend space is back with an easy to follow walkthrough of how she built [Keyboard Accordion](https://www.keyboardaccordion.com/), a Web based diatonic accordion (which I struggle to play in any coherent fashion at all but it sounds great). Tania Rascia [Get to Know Your Browser's Performance Profiler](https://blog.atomrc.dev/p/js-performance-profiling/) — If the _Performance_ tab in your browser’s devtools seems a bit intimidating, this article tries to boil down the absolute basics you need to know about what it’s showing you. Thomas Belin [Integrate eSignatures in Your App in Less Than a Week](https://www.hellosign.com/products/api?utm_campaign=cooperpress_direct_51322&utm_medium=cpm&utm_source=programmatic&utm_content=newsletter) HelloSign, a Dropbox Company sponsor [Rust From 0 to 80% for JavaScript Developers](https://michaelsalim.co.uk/blog/rust-from-0-to-80-for-js-dev/) — If the never ending news about JavaScript tools being (re)written in Rust hasn’t tired you out yet, maybe you’d like to know how to approach learning Rust from a JS perspective. Daniel Bulant’s [Rust basics, from the perspective of a high level programmer](https://danbulant.eu/posts/rust-basics) is also quite a good explainer. Michael Salim ▶[Using PyScript to Run Python in the Browser](https://www.youtube.com/watch?v=du8vQC44PC4) — From Rust to Python we go.. The recently unveiled [PyScript](https://pyscript.net/) provides an easy way to write Python code on Web pages much as you might write JavaScript now. This eight-minute screencast shows it off a little. Python Engineer [Making a Basic 'Falling Sand' Game in JavaScript](https://jason.today/falling-sand) — A calm and peaceful tutorial with embedded examples throughout. Jason McGhee 🤡 [In Defence of the Single Page Application](https://williamkennedy.ninja/javascript/2022/05/03/in-defence-of-the-single-page-application/) — _(Be warned, this is meant to be funny!)_ William Kennedy [Storybook Performance: Vite vs Webpack](https://storybook.js.org/blog/storybook-performance-from-webpack-to-vite/) Ian VanSchooten (Storybook) 🛠 Code & Tools [![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60/lysq1wzp1egvetwsmviz.jpg)](https://naver.github.io/egjs-infinitegrid/) [InfiniteGrid 4.3: Arrange Card Elements Infinitely on a Grid Layout](https://naver.github.io/egjs-infinitegrid/) — Very mature and established and makes it easy to create grids formed of card elements of varying sizes. It’ll work with your framework of choice too and is happy on both desktop and mobile. [GitHub repo](https://github.com/naver/egjs-infinitegrid). NAVER [fuzzysort 1.9: Fast Fuzzy Search Library](https://github.com/farzher/fuzzysort) — Inspired by the fuzzy search in Sublime Text. Check out [the live example](https://rawgit.com/farzher/fuzzysort/master/test.html) – it certainly feels quick. Stephen Kamenar [Self-Hosted, Open-Source Firebase Alternative](https://appwrite.io/?utm_source=newsletter&utm_medium=homepage&utm_campaign=javascriptmay13) — Appwrite provides APIs that cover your core backend needs. Build secure and fast with Appwrite. Click to learn more. Appwrite sponsor [Parvus: Accessible Lightbox with No Dependencies](https://github.com/deoostfrees/Parvus) — I love how it says not to use overlays on Web pages but if you have to, use this! There’s [a CodePen example](https://codepen.io/deoostfrees/pen/GRqdEPY). Benjamin de Oostfrees [crypto-random-string 5.0: Generate a Cryptographically Strong Random String](https://github.com/sindresorhus/crypto-random-string) — For example: `cryptoRandomString({length: 10})` might return `2cf05d94db` (although I really hope it doesn't when you try it otherwise it defeats the point 😆). Now works in both Node.js and the browser. Sindre Sorhus [Reagraph: WebGL Graph Visualizations for React](https://github.com/reaviz/reagraph) — A high-performance network graph visualization library that uses WebGL under the hood. [A basic example](https://codesandbox.io/s/reagraph-example-mwh96q) you can play with. REAVIZ [Project Management for Today's (and Tomorrow's) Software Teams](https://shortcut.com/?utm_source=cooperJSWeekly&utm_medium=spon_nl&utm_campaign=prospecting&utm_content=tomorrow) Shortcut (formerly Clubhouse.io) sponsor [DFlex: A Drag-and-Drop Library for All JS Frameworks](https://www.dflex.dev/) — This is a vanilla JavaScript solution with a focus on good performance and easy implementation. Try some demos [here](https://www.dflex.dev/demo/lists/symmetric/). DFlex ✌️ [Vody: A New Solid-Like Reactive UI Framework](https://github.com/vobyjs/voby) — Another month, another new UI framework, but it’s always good to see innovation in the space especially when quite a bit of effort has clearly been put in. Oh, and it doesn’t need Babel either. Fabio Spampinato [actions/github-script: Write Workflows Scripting the GitHub API in JavaScript](https://github.com/actions/github-script) — If you want to write GitHub actions that perform operations via the GitHub API, this could make your life a lot easier. GitHub Actions Published by [Cooperpress](https://cooperpress.com/) and edited by [Peter Cooper](https://twitter.com/peterc) '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