---
title: "Visualizing algorithms"
publication: "JavaScript Weekly"
issue: 684
published_at: "2024-04-18"
canonical_url: "https://javascriptweekly.com/issues/684"
---

Plus a campaign to upgrade jQuery, Biome 1.7, and a silly JavaScript 'interview' video. |        

#​684 — April 18, 2024 

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

Together with [![WorkOS\](https://res.cloudinary.com/cpress/image/upload/c_fill,g_auto,w_514,h_98/e_make_transparent/co_white,e_outline:9/tdfxwgk852ui9leli4wm.png)](https://workos.com/?utm_source=cpjavascript&utm_medium=newsletter&utm_campaign=q22024)   

JavaScript Weekly 

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

[Quill 2.0: A Powerful Rich Text Editor for the Web](https://quilljs.com/) — A major release and significant modernization for the open source WYSIWYG editor. In [Announcing Quill 2.0](https://slab.com/blog/announcing-quill-2-0/), we learn about Quill’s transition to TypeScript and improved use of modern browser features, but there’s [more going on](https://github.com/quilljs/quill/releases/tag/v2.0.0) too, such as its ESM packaging. Want to play with some code? [There’s a playground.](https://quilljs.com/playground/snow) 

Slab Inc.   

[Airbnb's Extensive JavaScript Style Guide](https://github.com/airbnb/javascript) — It’s been years since we mentioned this popular, opinionated style guide, but it keeps getting little tweaks and repairs and remains a handy resource nonetheless. 

Airbnb   [![\](https://copm.s3.amazonaws.com/742f992f.png)](https://workos.com/?utm_source=cpjavascript&utm_medium=newsletter&utm_campaign=q22024) 

[WorkOS: Enterprise-Grade Auth for Modern SaaS Apps](https://workos.com/?utm_source=cpjavascript&utm_medium=newsletter&utm_campaign=q22024) — WorkOS supports both the foundational auth and complex enterprise features like SSO. It provides flexible and easy-to-use APIs, helping companies like Vercel, Loom, and Webflow become Enterprise Ready. Best of all, WorkOS User Management supports up to 1 million MAUs for free. 

WorkOS sponsor   

[Upgrading jQuery: Working Towards a Healthy Web](https://blog.jquery.com/2024/04/17/upgrading-jquery-working-towards-a-healthy-web/) — jQuery remains all over the Web, and the jQuery team and OpenJS Foundation have joined forces to make sure sites get up to date. Their ['Healthy Web Checkup' tool](https://healthyweb.org/) can tell you if the version of jQuery on a site is outdated (.. most likely 'yes' 😅). 

Timmy Willison (jQuery)   

[Biome v1.7: Faster Formatting and Linting, Now Even Easier to Migrate To](https://biomejs.dev/blog/biome-v1-7/) — [Biome](https://biomejs.dev/) is an increasingly compelling, all-in-one JavaScript, TypeScript and JSX Prettier-compatible formatter and linter. v1.7 makes it easier to migrate to from ESLint and Prettier, can emit machine-readable JSON reports, and has some rule updates. 

Biome Core Team   

**IN BRIEF:** 

- 🤡 [▶️ Interview with Senior JS Developer 2024](https://www.youtube.com/watch?v=aWfYxg-Ypm4) is a satirical(?) take on the state of modern development and increasingly complex ecosystems. Watch to either laugh or cry. _(6 minutes.)_
- 📺 Bartek Szwej has put together a [list of 300 JavaScript-related videos](https://techtalksweekly.substack.com/p/ttw-extra-3-all-javascript-conference) from the past year, ordered by their YouTube view count.
- [f(x) (a.k.a. fx)](https://fx.wtf/) is a great CLI tool for viewing JSON data. [It now includes](https://github.com/antonmedv/fx/releases/tag/34.0.0) a JS engine so you can process JSON with JavaScript one-liners at the terminal, too.
- [Joyee Cheung shares a trip report](https://nodejs.org/en/blog/events/collab-summit-2024-london) from Node.js's latest collaboration summit, touching on the topics the Node team is thinking about lately.
- The folks at Deno [go into depth about how they built JSR](https://deno.com/blog/how-we-built-jsr), the newest JavaScript registry, and how it can operate at scale.
- ["Much faster JSX element creation"](https://github.com/facebook/react/pull/28768) is on the way for React developers.  

📒 Articles & Tutorials 

[![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60,q_auto/rvyzuvlvsc9pqf4xgzlj.jpg)](https://www.joshcanhelp.com/oclif/)  

[Building a CLI from Scratch with TypeScript and oclif](https://www.joshcanhelp.com/oclif/) — [oclif](https://oclif.io/) is a mature CLI tool development framework maintained by Salesforce. This tutorial goes from zero to something that works. 

Josh Cunningham   

[Qwik vs. Next.js: Which is Right for Your Next Web Project?](https://outshift.cisco.com/blog/qwik-vs-nextjs) — A point by point faceoff between Qwik vs Next.js and why the author thinks Qwik takes the gold medal. 

Samuel Mendenhall (Cisco)   

[RAG to Riches Developer Quest](https://www.mongodb.com/events/rag-to-riches?utm_campaign=js_weekly_rag_to_riches_apr_18&utm_source=node_weekly&utm_medium=sponsored_newsletter) — Interact with AI-enhanced bots and learn to build your own RAG chatbot with Atlas Vector Search and Node.js. 

MongoDB sponsor   

[CSS in React Server Components](https://www.joshwcomeau.com/react/css-in-rsc/) — An exploration of compatibility issues between React Server Components and CSS-in-JS libraries like styled-components. 

Josh W Comeau   

[Profiling Node.js Performance with Chrome's Performance Panel](https://developer.chrome.com/docs/devtools/performance/nodejs) — Learn how to profile Node performance with Chrome's _Performance_ panel. _([The JS Profiler is going away](https://developer.chrome.com/blog/profiling-cpu) in Chrome 124, so you'll need to become familiar with the newer approach.)_ 

Chrome for Developers   

📄 [Keeping Up with the Node-ish Ecosystem](https://www.mux.com/blog/keeping-up-with-the-node-ish-ecosystem) – How Mux updated its legacy Node SDK to work with new JS runtimes. Dylan Jhaveri (Mux) 

📄 [Building an Interactive 3D Event Badge with React Three Fiber](https://vercel.com/blog/building-an-interactive-3d-event-badge-with-react-three-fiber) Paul Henschel (Vercel) 

📄 [A Deep Dive into Rspack and Webpack Tree Shaking](https://github.com/orgs/web-infra-dev/discussions/17) hardfist 

📄 [Things I Like Better in Vue Than in React](https://jaydevm.hashnode.dev/things-that-i-like-better-in-vue-than-in-react) Jaydev Mahadevan 

📄 [Converting Plain Text To Encoded HTML With Vanilla JS](https://www.smashingmagazine.com/2024/04/converting-text-encoded-html-vanilla-javascript/) Alexis Kypridemos  

🛠 Code & Tools 

[![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60,q_auto/rqj3h15nmlfmv4lglwgc.jpg)](https://tresjs.org/)  

[TresJS: Build 3D Experiences with Vue.js](https://tresjs.org/) — Create 3D scenes with Vue components and Three.js. Think [React-three-fiber](https://docs.pmnd.rs/react-three-fiber/getting-started/introduction) but more.. _Vue flavored._ There’s [an online playground](https://play.tresjs.org/) if you want to give it a quick spin (literally). 

Alvaro Sabu   

[Next.js 14.2 Released](https://nextjs.org/blog/next-14-2) — Approaching its eighth birthday, Next.js has passed [1 million monthly active developers](https://twitter.com/rauchg/status/1777759530782515216) and landed a release with support for using Turbopack to improve local development, memory usage, CSS and caching optimizations, improved error messages, and more. 

Delba de Oliveira and Tim Neutkens   

[Porkbun — The Best Domain Registrar for JavaScript Developers](https://sponsr.is/tld_javascriptweekly) — JavaScript developers choose Porkbun to register their domains. Get .dev, .app, or .foo for just $5 from Porkbun now. 

Porkbun sponsor   

[Otto 0.4: A JavaScript Parser and Interpreter in Go](https://github.com/robertkrimen/otto) — A JavaScript parser and interpreter written natively in Go (yes, we have [a newsletter](https://golangweekly.com/) for that) which could be of interest if you want to add scripting to Go apps. 

Robert Krimen   

[Wedges: A Collection of UI Components for React](https://www.lemonsqueezy.com/wedges) — Built and used by the folks at [Lemon Squeezy](https://www.lemonsqueezy.com/), this is a well thought, aesthetically pleasing set of Radix UI and Tailwind CSS based components. You can also download a Figma file of them to use when mocking up layouts. [GitHub repo](https://github.com/lmsqueezy/wedges). 

Lemon Squeezy   

[HyperFormula: A Headless Spreadsheet System](https://hyperformula.handsontable.com/) — A headless spreadsheet system – it provides the parsing, evaluation and representation of a spreadsheet, with you providing the UI, if you need one. Boasts [‘nearly full compatibility’ with Excel](https://hyperformula.handsontable.com/guide/compatibility-with-microsoft-excel.html). _Note the dual GPLv3 and commercial licensing._ 

Handsoncode   

[svelte-dnd-action: An Action-Based Drag and Drop Container for Svelte](https://github.com/isaacHagoel/svelte-dnd-action) — Makes the bold claim that it _“supports almost every imaginable drag and drop use-case, any input device and is fully accessible.”_ 

Isaac Hagoel   

⚙️ [Zoompinch: A Natural Feeling 'Pinch to Zoom' for Vue 3](https://zoompinch.pages.dev/) – Expected to come in React and Web Component variants in time. Maurice Conrad 

⚙️ [Craft.js](https://craft.js.org/) – A React framework for building drag and drop page editors. Prev Wong 

⚙️ [Kotekan](https://github.com/bndkt/kotekan) – A simple React framework built on Bun and supporting React Server Components. Benedikt Müller 

⚙️ [Cytoscape.js 3.29](https://github.com/cytoscape/cytoscape.js) – Graph theory/network visualization and analysis library. 

⚙️ [Tailwind Next.js Starter Blog 2.2](https://github.com/timlrx/tailwind-nextjs-starter-blog) – A blogging starter template. 

⚙️ [RxDB 15.18](https://github.com/pubkey/rxdb/releases/tag/15.18.0) – Offline-first, reactive database for JS apps. 

⚙️ [JZZ 1.8.2](https://jazz-soft.net/doc/JZZ/) – MIDI library for Node and browsers. 

⚙️ [Ember.js 5.8](https://github.com/emberjs/ember.js/releases/tag/v5.8.0)  

⏳ A Blast from the Past 

[![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60,q_auto/cyaopitavitkcgcw2vnb.jpg)](https://bost.ocks.org/mike/algorithms/)  

[Visualizing Algorithms](https://bost.ocks.org/mike/algorithms/) — This _fantastic_ post is now ten years old, but I revisited it recently and it’s such a joy. Mike Bostock (of D3.js fame) visually guides us through some algorithms using both demos and code. 

Mike Bostock         

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
