advanced-javascript

Files (1)

• SKILL.md

SKILL.md (first lines)

<!--
id: SK-045
name: advanced-javascript
description: Advanced JavaScript patterns — TC39 features, V8 optimization, concurrency, TypeScript, performance
keywords: javascript, typescript, tc39, v8, performance, workers, proxy, temporal, signals, branded-types, iterator, weakref, scheduler
version: 1.0.0
-->

# Advanced JavaScript

## When to Use This Skill

Apply when writing performance-critical JS/TS, using modern language features, optimizing for Core Web Vitals, or working with advanced TypeScript patterns.

Auto-activate when code uses: `using`, `Symbol.dispose`, `WeakRef`, `Proxy`, `SharedArrayBuffer`, `scheduler`, branded types, template literal types, `Temporal`, `Iterator.prototype`, `Set.prototype.union`, `AsyncDisposableStack`.

---

## ES2025-2026 Features (Use Now)

### Explicit Resource Management

The `using` and `await using` keywords call `[Symbol.dispose]()` / `[Symbol.asyncDispose]()` automatically on scope exit — no finally blocks needed.

```js
// Synchronous disposal
{
  using file = openFileSync('data.txt');
  // [Symbol.dispose]() called automatically on scope exit — even on throw
}

// Asynchronous disposal
async function process() {
  await using conn = await db.connect();
  // [Symbol.asyncDispose]() awaited automatically
}

// DisposableStack — coordinate multiple resources
await using stack = new AsyncDisposableStack();
const conn = stack.use(await db.connect());
const file = stack.use(await openFile());
// Both disposed in LIFO order on scope exit
stack.defer(() => metrics.record('cleanup'));

// Make your own disposables
class TempFile {
  constructor(path) { this.path = path; }
  [Symbol.dispose]() { fs.unlinkSync(this.path); }
}
```

**Rule**: Replace every try/finally cleanup pattern with `using`. It composes better, handles throws, and is statically analyzable.

---

### Iterator Helpers (Lazy, Chainable)

Generator iterators now have a full method suite. All operations are lazy — nothing executes until consumed.

```js
function* naturals() { let n = 1; while (true) yield n++; }

// Lazy pipeline — only processes what's needed
const first5Evens = naturals()
  .filter(n => n % 2 === 0)
  .take(5)
  .toArray(); // [2, 4, 6, 8, 10]

// Available methods
// .map(fn)         — transform each value
// .filter(fn)      — keep matching values
// .take(n)         — limit to n values
// .drop(n)         — skip first n values
// .flatMap(fn)     — map + flatten one level
// .reduce(fn, init) — fold to single value
// .forEach(fn)     — side-effect iteration
// .some(fn)        — short-circuit exists check
// .every(fn)       — short-circuit all check
// .find(fn)        — short-circuit search
// .toArray()       — materialize to array

// Works on any iterator, not just generators
const result = [1, 2, 3, 4, 5].values()
  .filter(n => n > 2)
  .map(n => n * 10)
  .toArray(); // [30, 40, 50]
```

**Rule**: Replace `.filter().map()` chains on arrays with iterator pipelines when the source is large or infinite — single pass, no intermediate arrays.

---

### New Set Methods

```js
const a = new Set([1, 2, 3]);
const b = new Set([2, 3, 4]);

a.union(b);               // Set {1, 2, 3, 4}
a.intersection(b);        // Set {2, 3}
a.difference(b);          // Set {1}
a.symmetricDifference(b); // Set {1, 4}
a.isSubsetOf(b);          // false
a.isSupersetOf(b);        // false
a.isDisjointFrom(b);      // false (shares 2, 3)
```

All methods accept any iterable, not just other Sets. These replace all lodash set-operation helpers.

---

### Other ES2025 Highlights

**`Array.fromAsync(asyncIterable)`** — collect from async generators or readable streams:
```js
async function* pages() { /* yield fetched pages */ }
const allPages = await Array.fromAsync(pages());
```

**`Promise.try(fn)`** — wrap sync-or-async in promise chain for uniform error handling:

From Leo-Atienza/atlas-claude, MIT.

More from Leo-Atienza/atlas-claude