Getting it into your agent
One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.
npx agentmods add skills/12-studio/tackl/javascript-pronpx skills add 12-Studio/Tackl --skill javascript-progit clone --depth 1 https://github.com/12-Studio/TacklWhat it costs to keep this loaded
Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.
| Model | Per session | Once invoked |
|---|---|---|
| Fable 5 | $0.00084 | $0.01145 |
| Opus 5 | $0.00042 | $0.00573 |
| Sonnet 5 | $0.00017 | $0.00229 |
| Haiku 4.5 | $0.00008 | $0.00114 |
Grade A, and why
javascript-pro scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 2d ago.
A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.
Nothing flagged
None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.
This is a copy
100% identical to javascript-pro — 0 lines differ, which has more behind it and is treated as the original. This page carries a canonical link to it rather than competing with it.
How it starts
The opening of the file, as written. The whole thing — 135 lines — stays where its author put it; the contents beside it link to each section on GitHub.
JavaScript Pro
When to Use This Skill
- Building vanilla JavaScript applications
- Implementing async/await patterns and Promise handling
- Working with modern module systems (ESM/CJS)
- Optimizing browser performance and memory usage
- Developing Node.js backend services
- Implementing Web Workers, Service Workers, or browser APIs
Core Workflow
- Analyze requirements — Review
package.json, module system, Node version, browser targets; confirm.js/.mjs/.cjsconventions - Design architecture — Plan modules, async flows, and error handling strategies
- Implement — Write ES2023+ code with proper patterns and optimisations
- Validate — Run linter (
eslint --fix); if linter fails, fix all reported issues and re-run before proceeding. Check for memory leaks with DevTools or--inspect, verify bundle size; if leaks are found, resolve them before continuing - Test — Write comprehensive tests with Jest achieving 85%+ coverage; if coverage falls short, add missing cases and re-run. Confirm no unhandled Promise rejections
Reference Guide
Load detailed guidance based on context:
| Topic | Reference | Load When |
|---|---|---|
| Modern Syntax | references/modern-syntax.md |
ES2023+ features, optional chaining, private fields |
| Async Patterns | references/async-patterns.md |
Promises, async/await, error handling, event loop |
| Modules | references/modules.md |
ESM vs CJS, dynamic imports, package.json exports |
| Browser APIs | references/browser-apis.md |
Fetch, Web Workers, Storage, IntersectionObserver |
| Node Essentials | references/node-essentials.md |
fs/promises, streams, EventEmitter, worker threads |
Constraints
MUST DO
- Use ES2023+ features exclusively
- Use
X | nullorX | undefinedpatterns - Use optional chaining (
?.) and nullish coalescing (??) - Use async/await for all asynchronous operations
- Use ESM (
import/export) for new projects - Implement proper error handling with try/catch
- Add JSDoc comments for complex functions
- Follow functional programming principles
What ships with it
5 files beside SKILL.md in the same directory: the scripts, references and assets a skill reads on demand. Not counted in the per-session cost; read them before you install if any of them is executable.
What this file has done since we first saw it
Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.
- 2d ago First seen · 135 lines · 84 tokens per session scan A fb73d0545452
javascript-pro is a skill published in the GitHub repository 12-Studio/Tackl (10 stars, last pushed 6d ago), licensed MIT. It adds 84 tokens to every session and 1,145 once invoked, about $0.0004 per session on Opus 5. A static security scan graded it A with 0 findings. It is 100% identical to javascript-pro, differing in 0 lines, and is treated as a copy.
Other skills, from other repositories
table-state
Read automatically reactive Alpine table APIs in bindings and own slices with Alpine.reactive getters plus onChange or external TanStack Store atoms. Load for controlled state, updater callbacks, selector gating, atom precedence, or code incorrectly adding table.Subscribe.
aggregation
Aggregate TanStack Table columns independently of grouping, including grand totals, caller-selected row totals, multiple keyed aggregations, custom context-based definitions, grouped merges, manual values, and worker constraints.
cell-spanning
Merge adjacent body cells with cellSpanningFeature: value-based rowSpan opt-in per column via spanRows, per-row colSpan via spanColumns, and the covered-cell convention where a span of 0 means skip the cell. Load for merged data grids, spans that disappear after sorting or paginating, ragged table rows, or a cell that…
getting-started
Create an Alpine TanStack Table v9 table with createTable, explicit tableFeatures, Alpine.reactive data getters, x-for rendering, and FlexRender through x-html. Load for first-table setup, reactive options, or when nested Alpine directives rendered by x-html do not initialize.
with-tanstack-query
Compose Angular Query with signal-owned Table filtering, sorting, and pagination state using reactive query options, manual row-model boundaries, direct query data, server counts, and valid injection context.
with-tanstack-virtual
Virtualize Angular Table final row or column models inside the correct injection and reactive lifecycle with signal counts, scroll elements, keys, measurement, transforms, sticky regions, grid/flex sizing, and infinite data.