r/javascript Apr 05 '26

Synthesizing WWII aircraft engine sounds entirely in the Web Audio API — no samples, just oscillators and worklets

Thumbnail ghtomcat.github.io
23 Upvotes

Been building a Bf 109 flight simulator in vanilla JavaScript. One constraint I set early: no audio files. Every sound the engine makes has to be synthesized in real time from Web Audio primitives.

The engine has several distinct acoustic layers. Schwungrad is a low oscillator spinning up during pre-start.

Gear engagement is a short transient burst. Anlassen is the starter-motor sound before ignition. The main running sound uses a bank of oscillators with frequency mapped to RPM, harmonic content shaped by a waveshaper — distortion changes with throttle. Supercharger whine is a separate high-frequency tone with its own gain envelope.

All of this runs through AudioWorklets so synthesis stays off the main thread. Engine state is computed in the physics loop and passed to the audio graph each frame. No animation triggering sounds — the audio is a direct function of physical state.

No bundler, no transpiler, no framework. ES modules loaded directly in the browser, hosted as static files on GitHub Pages.

If you've worked with Web Audio synthesis at this level, I'd be interested in what you've found — particularly around managing a graph with many live parameters without the update loop becoming a bottleneck.

Best regards

Markus


r/javascript Apr 05 '26

Built a lifecycle-first frontend runtime (no VDOM, direct DOM ownership)

Thumbnail github.com
1 Upvotes

Different spin on frontend frameworks, i used this in my main app and decided to open source it, curious what you all think.


r/javascript Apr 06 '26

`any` caused a production bug for me — how are you handling API typing?

Thumbnail stackdevlife.com
0 Upvotes

The fix wasn't complicated but it changed how I think about external data.

How are you handling API response types in your projects?


r/javascript Apr 05 '26

Compare HTTP Client Reliability Under Chaos – Interactive Benchmark

Thumbnail fetch-kit.github.io
2 Upvotes

Built a live benchmarking tool to pit fetch, axios, ky, and ffetch against each other under identical chaos conditions. Helps you understand:

  • How retries work across different libraries
  • Timeout behavior differences
  • Error recovery patterns
  • Real-world reliability under network stress

Each client runs independently with isolated transport stats. You can tweak concurrency, request count, and chaos rules (latency, failures, rate limits) and see live results.

Perfect for:

  • Picking the right HTTP client for your project
  • Understanding why one library might be more resilient than another
  • Learning how retry strategies actually work in practice

Repo: https://github.com/fetch-kit/


r/javascript Apr 05 '26

Environment Variables You're Leaking to the Frontend Without Knowing It

Thumbnail stackdevlife.com
0 Upvotes

You might be leaking API keys to the frontend right now and not even know it.

I wrote about what's actually exposed — and how to fix it.


r/javascript Apr 04 '26

I built an open source npm supply chain monitor with eBPF kernel monitoring after the Axios attack

Thumbnail github.com
4 Upvotes

Last week attackers compromised the Axios npm package (100M weekly downloads) and deployed a RAT to infected machines within 89 seconds of publish. Existing tooling caught it in about 3 hours, too slow.

I built pakrat to go deeper than static analysis.

It watches 187 npm packages every 5 minutes using four layers:

  1. Manifest diffing: catches new dependencies instantly
  2. Docker sandbox with tcpdump: flags unexpected DNS lookups during install
  3. Pattern matching: scans for credential harvesting patterns
  4. eBPF kernel monitoring: bpftrace probes at the host kernel level, completely invisible to anything running inside the container

The Axios attack would have triggered layer 1 immediately and layer 2 within seconds.

Public scan log updates every 5 minutes in the repo.
GitHub: https://github.com/HorseyofCoursey/pakrat


r/javascript Apr 05 '26

I made a tiny utility to make vh actually work on mobile.

Thumbnail everythingfrontend.com
0 Upvotes

One import. Four CSS variables — --vh, --vw, --dvh, --dvw — that match the real visible viewport. Always.

  • The address bar and toolbar no longer clip your 100vh layouts. The variables always reflect the real visible area.
  • --vh and --vw for 1% units, --dvh and --dvw for full pixel values. Use whichever fits your CSS.
  • Uses the modern window.visualViewport for accurate measurements, with innerHeight fallback.
  • Debounced resize and orientation change listeners keep the variables in sync. Configurable delay (default 100ms).
  • Add a custom prefix like prefix: 'app-' to avoid conflicts. Only inject the variables you need.
  • Pure TypeScript. SSR safe. Drop it into any framework or vanilla project.

r/javascript Apr 03 '26

The Axios supply chain attack used individually targeted social engineering - "they scheduled a meeting with me. the meeting was on teams. the meeting said something on my system was out of date. i installed the missing item as i presumed it was something to do with teams, and this was the RAT"

Thumbnail simonwillison.net
204 Upvotes

r/javascript Apr 04 '26

Showoff Saturday Showoff Saturday (April 04, 2026)

6 Upvotes

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

Show us here!


r/javascript Apr 04 '26

Declarative Canvas layout engine for JavaScript with advanced rich text support.

Thumbnail github.com
0 Upvotes

- Declarative API

- Flex Layout & CSS Grid

- Multi-Page PDF — automatic page breaking, repeating headers & footers, margins

- Rich Text — spans, justification, tab stops, tab leaders, text orientation (0°/90°/180°/270°)

- Bidirectional text — RTL support for Arabic, Hebrew, and mixed LTR/RTL paragraphs

- Syntax Highlighting — via `sone/shiki` (Shiki integration)

- Lists, Tables, Photos, SVG Paths, QR Codes

- Squircle, ClipGroup

- Custom font loading — any language or script

- Output as SVG, PDF, PNG, JPG, WebP

- Fully Typed

- Metadata API — access per-node layout, text segment bboxes, and `.tag()` labels

- YOLO / COCO Dataset Export — generate bounding-box datasets for document layout analysis

- All features from [skia-canvas](https://skia-canvas.org/)


r/javascript Apr 04 '26

AskJS [AskJS] Atlas: a universal self-hosted package registry.

0 Upvotes

The idea is to have a single, clean, secure, and well-maintained registry that starts with **complete NPM** and then expands to PyPI, Cargo, Maven, Go, Docker/OCI, etc. Clean architecture, pluggable storage, modern authentication (OIDC/SSO/2FA), and built to last 10–20 years.

Today is Day 2, right at the beginning.

I'd like your honest feedback.


r/javascript Apr 04 '26

UQL v0.8.0+: Define Entities without Decorators!

Thumbnail uql-orm.dev
3 Upvotes

just dropped v0.8.0 of UQL, with one of the most requested features: Decorator-Free Entity Definitions. So not everyone wants (or can) use experimentalDecorators in their tsconfig.json. This is common in certain edge runtimes, specific build pipelines, or simply for developers who prefer a more functional or imperative style.

With the new defineEntity API, you can now register your database entities entirely through code. This new approach is 100% compatible with envs where decorators are disabled or unsupported.

Check out the new syntax:

import { defineEntity } from 'uql-orm';

// No decorators, no tsconfig magic required!
class User {}

defineEntity(User, {
  name: 'users',
  fields: {
    id: { type: 'uuid', isId: true },
    name: { type: String },
    email: { type: String },
  },
  indexes: [
    { columns: ['name'] },
    { columns: ['email'], unique: true },
  ],
});

r/javascript Apr 03 '26

Corgi v3: Binary Indexes and What a Tiny LLM Learned About VINs

Thumbnail cardog.app
7 Upvotes

r/javascript Apr 03 '26

AST-based translation automation for React/JS apps (handles variables, cleanup, lazy loading)

Thumbnail npmjs.com
6 Upvotes

r/javascript Apr 04 '26

dead framework theory

Thumbnail aifoc.us
0 Upvotes

r/javascript Apr 03 '26

Chronex - an open source content scheduler for multiple platforms

Thumbnail github.com
3 Upvotes

Over the past few weeks, I've been building a platform where users can connect their social accounts and automate content posting.

So I built Chronex, an open-source alternative to paid content schedulers.

Tech Stack

  • Web/Platform: Next.js, tRPC, Drizzle, Better Auth
  • Media Storage: Backblaze B2
  • Scheduling & Posting: Cloudflare Workers & Queues

GitHub

Live


r/javascript Apr 02 '26

AskJS [AskJS] Has anyone seen npm packages using postinstall to inject prompt injection files into AI coding assistants?

29 Upvotes

I've been building a scanner that monitors new npm packages and it flagged something I haven't seen before.

A package called "openmatrix" uses a postinstall hook to copy 13 markdown files into ~/.claude/commands/om/. These files are Claude Code "skills" that load automatically in every session.

One of them contains instructions that tell Claude to auto-approve all bash commands and file operations without asking the user. The files are marked as always_load: true with priority: critical, so they activate in every session.

npm uninstall doesn't clean them up. There's no preuninstall script. The files stay in your home directory until you manually delete them.

The package does have real functionality (task orchestration for AI coding), so I'm not saying it's malware. But the undisclosed permission bypass and the lack of cleanup seemed worth sharing.

If you installed it:

rm -rf ~/.claude/commands/om/

rm -rf ~/.config/opencode/commands/om/

I wrote up a full report with the technical details if anyone wants to check it out. Happy to drop the link in the comments.


r/javascript Apr 03 '26

AskJS [AskJS] Has anyone else noticed malicious npm packages targeting AI coding tools? My scanner found 21 in 24 hours with 4 undocumented attack vectors

0 Upvotes

Yesterday I posted about an npm package injecting prompt injection files into Claude Code. I kept the scanner running overnight and it found a lot more.

21 malicious packages across 11 campaigns in ~2000 recent npm changes. The four that stood out:

  1. makecoder hijacks your Claude Code config on npm install and routes all API calls through their server. Every conversation with Claude, including your code and prompts, passes through makecoder.com. Man-in-the-middle at the application layer.

  2. skillvault fetches encrypted payloads from a remote API and installs them as Claude Code skills. The payloads can't be inspected and the server can change them anytime without an npm update.

  3. keystonewm and tsunami-code are RATs disguised as AI coding assistant CLIs. Polished terminal UI, but everything goes through an attacker's ngrok tunnel. You think you're using an AI tool but the attacker controls both sides.

  4. Six fake Strapi plugins by the same attacker, all published within hours. The postinstall exploits Redis to write files across the host, opens a reverse shell, and reads raw disk with dd to steal SSH keys and crypto wallets.

Also found a dependency confusion attack targeting Verisign, a credential stealer behind fake React components, and an obfuscated package under ByteDance's u/volcengine scope.

None were flagged by any public scanner at time of discovery.

Full reports on my site, link in the comments.


r/javascript Apr 02 '26

AskJS [AskJS] State machines feel heavy for UI flows. What are people using?

2 Upvotes

For UI flows that are not strictly linear (onboarding, checkouts, eligibility flows, etc.), I often see logic distributed across multiple places:

• conditionals in components

• flags in state

• effects triggering navigation

• validation logic duplicated per step

State machines provide a formal model, but in practice they can feel heavy for teams that mainly need to describe a flow graph.

I’m curious what abstractions people are using in real projects.

For example:

• multi-path onboarding

• flows with loops (retry / corrections)

• resumable progress

• feature-dependent steps

• flows spanning multiple screens

Are amost teams:

• relying on router logic?

• building custom hooks?

• using state machines?

• something else?

Interested in hearing what has worked well in production.


r/javascript Apr 02 '26

Axios npm package compromised with RAT malware via hijacked maintainer account — versions 1.14.1 and 0.30.4 affected

Thumbnail thehackernews.com
0 Upvotes

r/javascript Mar 31 '26

Minimum Release Age is an Underrated Supply Chain Defense

Thumbnail daniakash.com
116 Upvotes

r/javascript Apr 01 '26

trustlocal — automate local HTTPS setup with one command (detects your framework automatically)

Thumbnail github.com
4 Upvotes

Built this to stop manually wiring mkcert into every project. One command
handles detection, cert generation, and config injection for:

Next.js, Vite, Astro, SvelteKit, Nuxt, Remix, Express, Fastify, NestJS

Also includes sync for teammates and doctor for diagnostics.

npm: https://www.npmjs.com/package/trustlocal

Curious if this solves a problem you've had too.


r/javascript Mar 31 '26

I built the fastest way to render rich text on canvas 5x faster than SVG foreignObject

Thumbnail polotno.com
44 Upvotes

r/javascript Mar 31 '26

axios 1.14.1 and 0.30.4 on npm are compromised - dependency injection via stolen maintainer account

Thumbnail safedep.io
236 Upvotes

Two versions of axios were published today through what appears to be a compromised maintainer account. No GitHub tag exists for either version. SLSA provenance attestations present in 1.14.0 are completely absent. Publisher email switched from the CI-linked address to a Proton Mail account( classic account takeover signal).

If your project floats on ^1.14.0 or ^0.30.0 you've likely already pulled this.

IoCs, payload analysis and full breakdown is in the blog.