Happy 26th birthday to JavaScript

asciinema-player, Now 4x Smaller and 50x Faster with JS and Rust — asciinema is a Python-based terminal screen recorder (think Camtasia but for text!) but to play its recordings on the Web asciinema-player is used. Originally written in ClojureScript, a mixed JS + Rust build (plus a little SolidJS) has hugely improved its performance (the demo on the page is neat to play). Will we continue to see more collaborations between Rust and JavaScript in future? Definitely.

Marcin Kulik

Mitosis: Write Components Once, Run Everywhere — In simple scientific terms, mitosis is a process where a cell divides into two child cells, but in this case it’s a single component code base that can compile into different forms usable with Vue, React, Solid, Angular, Svelte, and more. The playground lets you see how it works out.

Builder.io

Introduction to Gatsby Course with Jason Lengstorf — Learn to build blazing-fast apps and websites with React using Gatsby, covering all angles from using GraphQL to store and retrieve data, image optimization, displaying third party data in components, right through to deployment.

Frontend Masters sponsor

Floating UI: Positioning for Tooltips, Popovers, Dropdowns, etc. — If this reminds you of Tippy.js or Popper at all, it’s similar and shares a creator and contributor respectively who says it’s “designed to be a next-generation evolution". It certainly looks and feels nice, is lightweight, and can be customized by way of middleware.

atomiks

'Thank You, Angular' (and Thank You, Igor!) — Igor has been a leader and fundamental part on the Angular team for, amazingly, over 12 years now, but he’s moving on. In this post he reflects on the project’s history, his involvement with it, how Angular is now used in over 2500 apps(!) at Google, and who’s helping to plug the gap he leaves.

Igor Minar

JSON Modules in JavaScript — Typically when you use import it’s for importing JavaScript code, but what if you had some configuration settings in a JSON file and wanted to import it directly? Enter the JSON modules proposal which is at stage 3 with experimental support available in Node or within the Chrome 91 browser.

Dmitri Pavlutin

Publishing a Web Component to npm — Simon’s always good at explaining stuff and, as an aside, his Datasette project is well worth checking out if you work with datasets at all.

Simon Willison

Find and Fix Things Faster Across Your Code with Sourcegraph — Nobody likes feeling caught between the pressure to improve your codebase and the pressure to protect it. Release anxiety– we’ve been there.

Sourcegraph sponsor

Determining the Best Starting Word in a Word Game — WORDLE is an online word game that’s a bit like ‘Mastermind’ but with 5 letter words. And, of course, if you’re a developer, why not use code to improve your guesses?

Bertrand Fan

How to Trim Strings in JavaScript — Specifically, removing whitespace and line terminators safely.

Dmitri Pavlutin

Strapi v4: An Open Source Node.js Headless CMS — Strapi has been around a while and has done a good job building a community around itself. A big new version is out with a new UI, Plugin API, Query Engine and more, plus a focus on refactoring the core to make it easier to extend and twist to your own ends. Here’s the getting started tutorial.

Alexandre Bodin

Plotly.js 2.7: A Data Viz Built on D3 and Stack.gl — It’s been a couple of years since we last featured Plotly, but it continues to get very frequent updates. It ships with over 40 chart types including 3D visualizations – see examples here.

Plotly

Data Visualization: Build React Graphs the Easy Way — Let’s explore an efficient way to create React graphs (Donut, Bar, Line, Sparkline) with the KendoReact Charts library.

Progress KendoReact sponsor

Ladda: Buttons with Built-In Loading Indicators — Sweet and simple. Ideal for form submissions in particular. GitHub repo.

Hakim El Hattab

WMR: A Tiny Multitool for Building Modern Web Apps — Everything you need in a single tool for putting together JS-powered webapps with bundling, JSX, CSS modules support, and more. Ideal for prototyping. GitHub repo.

Preact

noUiSlider: Lightweight Range Slider with Full Touch Support — No dependency. Fits into wherever you need it. Great homepage too. GitHub repo.

Leon Gersen

Deliver Safer & Cleaner Code For Free - Directly in Visual Studio 2022

SonarLint sponsor

jsvu: JavaScript (Engine) Version Updater — A tool for installing new JavaScript engines without compiling them from source.

Google

🕹 TEGA: TypeScript Embedded GameBoy Macro Assembler — Extremely niche, but essentially lets you create GameBoy ROMs from TS or JS. I have zero need to do this, but if you ever do, maybe this example will win you over.

Francis Stokes

🐍 promisio: JavaScript-Style Async Programming for Python — Is this now Python Weekly? No, but Python continues to be on the up and up for many use cases, but what if you want your JS style async functions?

Miguel Grinberg

blockify-yourself — Earlier this week former Twitter CEO Jack Dorsey ‘did a Zuck’ and rebranded Square, Inc. to Block, complete with new logo. Said logo was even incorporated into the headshots on the Board of Directors page…after much mocking, now, you can of course get your own blocky headshot via this Glitch project (which uses Three.js).

Julius Tarng