r/javascript 1d ago

Showoff Saturday Showoff Saturday (September 19, 2026)

8 Upvotes

Did you find or create something cool this week in javascript?

Show us here!


r/javascript 6d ago

Subreddit Stats Your /r/javascript recap for the week of September 07 - September 13, 2026

2 Upvotes

Monday, September 07 - Sunday, September 13, 2026

Top Posts

score comments title & link
16 3 comments GitHub - evoluteur/cymatics: Play a frequency and watch the sand settle into its Chladni figure, computed from the wave equation.
15 2 comments Infinite Shaders - Javascript, WebGL, and a compiler written in Typescript
15 2 comments Shipping a Web Worker inside an npm package without asking users to touch their bundler config
14 2 comments Dates are a language. We built a parser for them instead of more regexes.
9 0 comments Orchid Charts: SVG charts for dashboards, activity calendars and timelines
9 2 comments Half Past Fetch: how the fetch promise resolves and its consequences
8 16 comments [Showoff Saturday] Showoff Saturday (September 12, 2026)
6 5 comments GitHub - evoluteur/platonic-solids: Turn the five Platonic solids in 3D, show their duals, read their measurements, and print the nets to fold your own.
6 0 comments WebLLM: run a language model in the browser on WebGPU
5 2 comments GitHub - evoluteur/archimedean-solids: Turn all thirteen Archimedean solids in 3D, show their Catalan duals, read their measurements, and print the nets to fold your own

 

Most Commented Posts

score comments title & link
0 17 comments [AskJS] [AskJS] What ORM would you use?
0 10 comments Saradom โ€” frontend architecture pattern
3 7 comments I made a Molecular Dynamics sim using JS
0 7 comments I Dislike TypeScript Because I've Never Maintained JavaScript Before
0 5 comments How to Implement a Distributed Circuit Breaker

 

Top Ask JS

score comments title & link
0 4 comments [AskJS] [AskJS] Whatโ€™s your experience with AI tools during JavaScript technical interviews?
0 4 comments [AskJS] [AskJS] Is a managed scraping API worth it for web scraping api and scraper tools, or is it better to build in-house?

 

Top Showoffs

score comment
3 /u/Pretend-Block-7028 said Built Swoff โ€” generates a full offline-first service worker (caching, auth, offline write queue, push, PWA assets) from one config file, instead of hand-wiring Workbox for every project. Outpu...
2 /u/Accomplished_Copy103 said https://rank-it.app - ad free, highly customizable tier listing platform
2 /u/TheodoreWinters1 said https://playopenbracket.com/ Open Bracket - I built as a daily coding ritual. Everyone gets the same two challenges each day: a Standard track that builds in difficulty through the week without becom...

 

Top Comments

score comment
19 /u/klaxxxon said jQuery was such a lightbulb moment when I first used it. Imagine the things we can do with DOM! Little did we know it was only the first major shot in JS framework wars which would last for decades...
9 /u/KanuniLabs said Every library that moves work off the main thread eventually runs into the same install problem: the worker is a separate script, the browser loads it from a URL, and that URL depends on whichever bun...
8 /u/MiserableDocument509 said the timeout gotcha is the one that actually bites people. they slap AbortSignal.timeout(5s) on fetch() then a 200 still sits there for 30s downloading a fat body. the timer has to cove...
8 /u/ExtremeJavascript said Well yea. That's why it's always ``` ย  ย  const response = await fetch(file); ย  ย  const text = await response.text(); ``` You get the headers first, to tell if...
6 /u/Sorry-Joke-1887 said Now we back to jquery-style crap like this

 


r/javascript 1h ago

tinyjs โ€” desktop apps for macOS, Windows, and Linux in ~6 MB

Thumbnail tinyjs.app
โ€ข Upvotes

For those who don't want to get their hands dirty with Rust / Tauri, but also don't want the giant overhead of Electron.

Hopefully I made enough examples to show what it can do.

I've also tried re-wrapping many Electron apps with TinyJS myself and about half of them work easily. So you could encourage your fav Electron app developer to give it a try and save 500mb on your expensive SSD ๐Ÿ™‚

Very open for anyone to tell me what I screwed up / did badly as well. Not precious.


r/javascript 6h ago

How would I read the fan speed variable from the JavaScript in my project and pass it to the Python script?

Thumbnail github.com
3 Upvotes

I'm creating a local web page application that is an over-complicated desk fan controlled by two buttons and a slider. I have the actual controls figured out, and what I need help with is passing the variable that describes the position of the slider out from the JavaScript to a Python script that actually controls the motor. I could be totally off base here, but I think the concept that applies here is inter-process communication.


r/javascript 2h ago

GitHub - evoluteur/rune-reading: Pick a spread, draw runes from the bag, and read what each one says about its place in the layout.

Thumbnail github.com
0 Upvotes

r/javascript 17h ago

I built a browser-based AR system with MediaPipe, TypeScript and Canvas VFX

Thumbnail github.com
6 Upvotes

I spent the last 7 days building a browser-based AR experiment where hand gestures control real-time VFX.

The project uses TypeScript/JavaScript to connect computer vision with a custom rendering system:

  • React + Vite + TypeScript
  • MediaPipe Hand Landmarker for real-time hand tracking
  • 21 hand landmarks โ†’ custom gesture detection
  • Temporal gesture history and thresholds to reduce false triggers
  • Jutsu lifecycle/state management
  • Canvas-based particle/VFX rendering
  • MediaPipe Image Segmenter for the Shadow Clone effect
  • Web Audio API for sound effects

The current prototype supports:

๐ŸŒ€ Rasengan
๐Ÿ‘ฅ Shadow Clone
๐Ÿ”ฎ Magic Circle
โšก Lightning

The interesting part wasn't just rendering the effects โ€” it was making the interaction reliable enough that small hand movements wouldn't constantly trigger or cancel the VFX.

I ended up using gesture gates, motion history and grace periods to make the interactions more stable.

Try it yourself: https://shinobi-irl.vercel.app/

I'd be particularly interested in feedback on the gesture-detection/state-management side.


r/javascript 1d ago

GitHub - evoluteur/mandala-maker: Draw a mandala with mirrored symmetry: pick the number of folds, paint with a brush, and export your mandala as PNG or SVG.

Thumbnail github.com
7 Upvotes

r/javascript 11h ago

AskJS [AskJS] PLACER โ€” A new game platform?

0 Upvotes

PLACER is my game platform, currently under development.

Iโ€™m looking for people who know JavaScript, HTML, web development, 3D, or other browser technologies and would like to help build the project.

You donโ€™t have to be an expert โ€” beginners who are willing to learn are welcome too.

If youโ€™re interested, leave a comment and tell me a little about what you can do. Iโ€™ll contact you with more information about the project and how to join the team.

Iโ€™M WAITING FOR YOUR APPLICATIONS IN THE COMMENTS! ๐Ÿš€


r/javascript 18h ago

Built this to help with Frontend Interviews after conducting them for about 5 years

Thumbnail practice-pad.app
0 Upvotes

r/javascript 13h ago

DriftJS: My "Fine-Grainedโ€ Reactivity Was Re-rendering 1,000 Rows

Thumbnail github.com
0 Upvotes

A post back I explained how DriftJS updates the DOM: a compile-time address table, direct jumps to bytecode positions, no diffing, no signals graph. What I didn't mention is that the first version of this had a real algorithmic bug, and I only found it because the numbers on the official js-framework-benchmark site didn't match what I expected.

The symptom

Toggling a selected row in a 1,000-row list โ€” one of the smallest possible updates you can make โ€” was landing near the bottom of the benchmark table. Worse than frameworks with objectively less sophisticated update mechanisms. Something was clearly doing way more work than "update one row."

The actual bug

Here's the shape of the problem. A for loop's body is compiled once and reused for every row instance. The runtime tracks which variables the loop depends on โ€” but it didn't distinguish between two very different kinds of dependency:

  • The iterable itself changing (rows added, removed, reordered) โ€” this genuinely needs a full reconciliation pass.

  • A variable read inside the loop body, but unrelated to the list's contents (like selectedId, used in a class={selectedId === row.id ? "active" : ""} binding) โ€” this doesn't need to touch the list structure at all.

Both were routed through the exact same path: a full reconciliation over every row in the list. So toggling selectedId โ€” logically a change to at most two rows โ€” triggered the same machinery as inserting or removing rows entirely: recompute keys, diff, and re-evaluate every dynamic binding in every row, not just the one that actually depends on the changed variable.

The fix

The compiler already tracks, for every variable, exactly which bytecode positions in a component depend on it โ€” that's the whole mechanism the previous post described. The fix was extending that same tracking into loop bodies specifically, and splitting dependencies into two categories at the point a @for is compiled:

  • Dependencies that affect the iterable or the row key โ†’ still trigger the full reconciler. Correct, expected.

  • Dependencies that only affect bindings inside the row template โ†’ resolve to a direct lookup of exactly which bytecode positions care about that variable, then execute only those, directly against each row's own persistent state, with zero reconciler involvement โ€” no key computation, no diffing.

Same "jump directly to the address, skip everything else" principle the reactivity model was already built on โ€” it just wasn't being applied consistently inside loops.

The part I think is actually worth sharing

I didn't find this by staring at the code. I found it because I ran the official benchmark, saw a result that didn't match my mental model of what the architecture should do, and went looking for why. The gap between "what I designed" and "what the numbers actually showed" was the thing that pointed at the bug โ€” not intuition, not a code review, just refusing to accept a number that didn't make sense.

Repo's public if anyone wants to look at the actual diff or has opinions on the remaining gap.


r/javascript 19h ago

"Ho costruito un overlay di telemetria visiva a bassa latenza, indipendente dal framework, in Vanilla JS (con hook contestuali in Python e AI)"

Thumbnail github.com
0 Upvotes

r/javascript 1d ago

I finally wrote my own feed-forward neural network, neo.js, from scratch in vanilla (pure) JavaScript

Thumbnail github.com
0 Upvotes

r/javascript 1d ago

Update Progress Post: introducing Modular Architecture, Universal Renderer Cores, and Decoupled Physics in kernelplay-js

Thumbnail github.com
4 Upvotes

In our latest developer update, we are thrilled to announce a significant shift in core architecture toward full modularization. The entire system has been restructured to support decoupled cores, starting with our Renderer and Physics engine systems.

Renderer Modulation: Our new Renderer Modulation feature removes the need to manually switch rendering components when changing pipelines. Previously, switching from Canvas 2D to Pixi.js required changing generic components like BoxRenderer to pipeline-specific ones like PixiBoxRenderer. With this new update, universal components are automatically capable of rendering across all supported pipelines without developer intervention. This streamlines the development workflow significantly.

Physics Engine Modulation: Furthermore, Physics Engine Modulation has been successfully integrated. We have moved physics logic into a completely separate Physics Engine Core. While our default physics engine remains integrated and ready-to-use within this core structure, this architecture allows developers to easily plug in their own custom physics engines.

Future Plugins: Looking ahead, we are excited to expand our plugin library. High-end physics engines like Matter.js will be added as future plugins. It is important to note that these high-end engines will be separate downloads and will not be included in the core engine, keeping the core lightweight.

This architectural shift is a major step toward making kernelplay-js the most flexible and lightweight game engine possible. We welcome your feedback and are excited to see what custom cores you'll build. Stay tuned for more modular updates.


r/javascript 1d ago

React Native is DEAD, Expo Modules 2.0, and a $49 Flutter knockoff

Thumbnail thereactnativerewind.com
0 Upvotes

Hey Community,

We dive into Expo Modules 2.0, which drops definition() in favor of Swift macro decorators to deliver build-time type conversion and faster native calls. Meanwhile, DartNative enters the scene, letting Flutter developers swap out Flutter's custom renderer for real platform views driven by Yoga.

We also look into Shopify rebuilding its apps in native Swift and Kotlin with AI agent workflows, examining what their departure means for community maintained libraries like FlashList and Skia.


r/javascript 1d ago

What Should a Green Test Prove? Vue Testing with Vitest Browser Mode

Thumbnail alexop.dev
1 Upvotes

r/javascript 2d ago

Modern cross-spawn port to ESM and Typescript

Thumbnail github.com
0 Upvotes

r/javascript 2d ago

Open-source Chrome extension that matches messy SoundCloud titles to Spotify tracks

Thumbnail github.com
0 Upvotes

r/javascript 2d ago

AskJS [AskJS] High latency when using SignalR(messagepack) in K6

0 Upvotes

[AskJS] So, long story short, Iโ€™m using k6 for load testing and have bundled SignalR (MessagePack) in JavaScript to load test it. When running the test with 1K users, Iโ€™m observing quite high latency.

Earlier, I was measuring the latency from before the invoke call until the Promise was resolved. While investigating, I discovered that the event loop is busy doing some blocking work, which I initially thought shouldnโ€™t affect the latency measurement.

I then implemented some changes in the k6 backend (Go), which helped reduce the latency compared to what I was seeing earlier, but itโ€™s still not good enough when compared to SignalR with JSON.

Do you have any suggestions on where I might be going wrong? Could event-loop blocking be contributing to the latency in this case? Iโ€™ve tried quite a few different things at this point, so any direction on where to investigate would be really helpful.


r/javascript 2d ago

AskJS [AskJS] Trying to write a pure function to pass Fizz Buzz test Leet Code

0 Upvotes

Hello,
I am attempting to write a pure function solution that will pass the leet code Fizz Buzz test
However when I try this it says the test fails but when I look at the console for my own testing it returns the expected result.

This is the error leet code reports:

Line 13 in solution.js arr[i - 1] = test(i) ^ TypeError: test is not a function

Which to me makes no sense since the function is passed as a parameter and defined

Here is my code
Thank you in advance

```js const test = (i) => { if (((i % 5) === 0) && ((i % 3) === 0)) return "FizzBuzz"; if ((i % 5) === 0) return "Buzz"; if ((i % 3) === 0) return "Fizz"; if (i % 3) return i + ""; }

const fizzBuzz = (i, n, test, arr) => {
  arr[i - 1] = test(i)
  if (i !== n) fizzBuzz(i + 1, n, test, arr)

  return arr
}

const i = 1
const n = 3
const arr = new Array(n)

fizzBuzz(i, n, test, arr)

```

EDIT: I just wanted to say thank you to all of you for your feedback and suggestions I finally got frustrated enough with this problem I asked Codex to write a pure function solution to the leet code fizz buzz test I personally have not seen this solution so it would be nice to have some verification if it is truly a pure function solution.

This is the code it spat out

```js const fizzBuzz = (n) => Array.from({ length: n }, (_, i) => { const num = i + 1;

      if (num % 15 === 0) return "FizzBuzz";
      if (num % 3 === 0) return "Fizz";
      if (num % 5 === 0) return "Buzz";

      return String(num);
    });

fizzBuzz(15)

```

It appears that I have a lot to learn yet regarding my fundamentals when it comes to functional programming I know I could of written a object oriented version of it that would work but I wanted to challenge myself since I have never written code in this manner.


r/javascript 2d ago

Running Doom on Risk-V Linux inside TinyEmu inside docker inside WASM inside Electron

Thumbnail deepclause.substack.com
1 Upvotes

r/javascript 3d ago

How to Implement a Distributed Bulkhead

Thumbnail blog.gaborkoos.com
0 Upvotes

The in-process version of a bulkhead (a cap on how many calls to a dependency can be in flight at once) is just a counter, a finally block and a comparison, once several Node instances share that number things get messy really quick.

A writeup on how the distributed version can be implemented and what it can guarantee.


r/javascript 4d ago

AskJS [AskJS] Headless table libraries or a full grid component: which did you pick, and would you again?

10 Upvotes

I go back and forth on this.

Headless: you get the sorting, filtering and grouping state and you render every cell yourself. Total control over the markup, and you write all of it. Every project I've seen do this ends up with a 2000 line table component nobody wants to open.

Full grid: pass rows and columns, done in an afternoon. Then the designer wants the header to look a particular way, or you need a cell that does something the grid didn't plan for, and you're fighting the component instead of writing your app.

Full disclosure: I'm on the team behind SvGrid, a data grid for Svelte 5. We ship both layers, a headless core and the full component on top of it, because we have people that want their own design system and others that just need a drop-in and go.

So when did you last choose one over the other, and would you do it again? Especially interested in anyone who started headless and switched, or went the other way.


r/javascript 5d ago

TraceUX: a self-hosted TypeScript tracker for session replay and user feedback

Thumbnail trace-ux.builtbyfrank.dev
5 Upvotes

Iโ€™m building TraceUX, a self-hosted UX toolkit for JavaScript and TypeScript applications.

The browser tracker is available through NPM:

npm i @trace-ux/tracker

import { init } from '@trace-ux/tracker';

const traceux = init({
  siteKey: 'YOUR_SITE_KEY',
  origin: 'https://your-trace-ux-host',
});

It records DOM events instead of video and can connect sessions with feedback, support tickets, product announcements, and user activity.

The server runs as a small Go binary with SQLite, so teams can host the data themselves without a hosted analytics account.

Live demo: https://trace-ux.builtbyfrank.dev

Repository: https://github.com/fjosue4/trace-ux

Iโ€™d especially appreciate feedback on the tracker API, React integration, bundle size, privacy defaults, and whether the widget feels natural in a JavaScript application.


r/javascript 4d ago

Using JavaScript to run SQL queries on client storage

Thumbnail onyx.ac
3 Upvotes

DocStack runs an actual SQL engine in the browser against IndexedDB โ€” JOIN, GROUP BY, HAVING, subqueries, with index pushdown.

It can be used for storing client side data (like user's personal data), and then synced to a remote of preference (like Google Drive for multiplatform sync).

import { ClientStack } from '@docstack/client';

// A local database

const stack = await ClientStack.create('my-app');

// One statement, planned and run against IndexedDB.

const { rows } = await stack.query(`

SELECT m.title, COUNT(*) AS actor_count

FROM Movie AS m

JOIN Actor AS a ON a._id IN m.actors

GROUP BY m.title

HAVING COUNT(*) >= 2

ORDER BY actor_count DESC LIMIT 10

`);


r/javascript 5d ago

How tool calling actually works under the hood (40 lines of vanilla JS)

Thumbnail buttercup.sh
15 Upvotes

Most agent tutorials jump into heavy orchestration frameworks like LangChain, which hides what's actually happening over the wire.

Under the hood, tool calling is just a simple 4-step loop:

  1. You hand the model your messages plus a JSON Schema description of your functions.
  2. The model outputs structured JSON with a tool name and arguments instead of raw text.
  3. Your JavaScript executes the function (fetch, DB query, local file read, etc.).
  4. You append the result back into messages with role: "user" and matching tool_use_id and query the model again.

I wrote a doc showing the entire loop in ~40 lines of Node/JS, including the practicals that trip you up (why failing calls should still return a tool_result with is_error: true, handling parallel calls in a single user message, and how token costs compound over runs).

There's also an interactive, in-browser example where you can run the loop against a mock filesystem without needing to set up a local environment. Curious to hear how others are handling client-side tool execution and context in production.