Performance Attribution
HKUDS/Vibe-Trading
Explains why a portfolio beat or lagged its benchmark with Brinson sector attribution, factor alpha and beta decomposition, timing evaluation and benchmark comparison.
Use Datastar data- attributes and actions in HTML and Templ templates, including signals, bindings, events, server actions and request options.
MITAuto-check passed
Install Datastar
$ npx skills add romshark/datapages --skill datastar -a claude-codeProject install by default; add -g for ~/.claude/skills/.
$ gh skill install romshark/datapages datastar --agent claude-codeProject scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).
$ git clone --depth 1 https://github.com/romshark/datapages.git skills-src && mkdir -p .claude/skills && cp -r skills-src/internal/generator/agentdocs/data/skills/datastar .claude/skills/datastar && rm -rf skills-srcUse ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.
Claude Code skills documentation · loads skills from .claude/skills/
Install the "datastar" agent skill from https://github.com/romshark/datapages/tree/main/internal/generator/agentdocs/data/skills/datastar into .claude/skills/datastar/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "datastar", then confirm the skill loads.Claude Code copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$skill-installer install https://github.com/romshark/datapages/tree/main/internal/generator/agentdocs/data/skills/datastarType this inside Codex. $skill-installer <name> installs a curated skill from openai/skills. The installer writes to $CODEX_HOME/skills (default ~/.codex/skills). Restart Codex if the skill does not show up.
$ npx skills add romshark/datapages --skill datastar -a codexProject install goes to .agents/skills/; add -g for ~/.codex/skills/.
$ gh skill install romshark/datapages datastar --agent codexProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/romshark/datapages.git skills-src && mkdir -p .agents/skills && cp -r skills-src/internal/generator/agentdocs/data/skills/datastar .agents/skills/datastar && rm -rf skills-srcUse ~/.agents/skills/ instead of .agents/skills for a personal install.
Codex skills documentation · loads skills from .agents/skills/
Install the "datastar" agent skill from https://github.com/romshark/datapages/tree/main/internal/generator/agentdocs/data/skills/datastar into .agents/skills/datastar/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "datastar", then confirm the skill loads.Codex copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add romshark/datapages --skill datastar -a cursorProject install goes to .agents/skills/; add -g for ~/.cursor/skills/.
$ gh skill install romshark/datapages datastar --agent cursorProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/romshark/datapages.git skills-src && mkdir -p .cursor/skills && cp -r skills-src/internal/generator/agentdocs/data/skills/datastar .cursor/skills/datastar && rm -rf skills-srcUse ~/.cursor/skills/ instead of .cursor/skills for a personal install.
Cursor skills documentation · loads skills from .cursor/skills/, .agents/skills/, .claude/skills/, .codex/skills/
Install the "datastar" agent skill from https://github.com/romshark/datapages/tree/main/internal/generator/agentdocs/data/skills/datastar into .cursor/skills/datastar/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "datastar", then confirm the skill loads.Cursor copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ gemini skills install https://github.com/romshark/datapages.git --path internal/generator/agentdocs/data/skills/datastar--scope user (default) or --scope workspace; --path is the subfolder of the repo that holds the skill; --consent skips the security confirmation prompt.
$ npx skills add romshark/datapages --skill datastar -a gemini-cliProject install goes to .agents/skills/; add -g for ~/.gemini/skills/.
$ gh skill install romshark/datapages datastar --agent gemini-cliProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/romshark/datapages.git skills-src && mkdir -p .gemini/skills && cp -r skills-src/internal/generator/agentdocs/data/skills/datastar .gemini/skills/datastar && rm -rf skills-srcUse ~/.gemini/skills/ instead of .gemini/skills for a personal install, then run /skills reload.
Gemini CLI skills documentation · loads skills from .gemini/skills/, .agents/skills/
Install the "datastar" agent skill from https://github.com/romshark/datapages/tree/main/internal/generator/agentdocs/data/skills/datastar into .gemini/skills/datastar/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "datastar", then confirm the skill loads.Gemini CLI copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ gh skill install romshark/datapages datastarInstalls for Copilot at project scope by default; add --scope user for a personal install. Preview a skill first with gh skill preview. Needs GitHub CLI 2.90.0 or later (public preview).
$ npx skills add romshark/datapages --skill datastar -a github-copilotProject install goes to .agents/skills/; add -g for ~/.copilot/skills/.
$ git clone --depth 1 https://github.com/romshark/datapages.git skills-src && mkdir -p .github/skills && cp -r skills-src/internal/generator/agentdocs/data/skills/datastar .github/skills/datastar && rm -rf skills-srcUse ~/.copilot/skills/ instead of .github/skills for a personal install. Commit .github/skills so cloud agent and code review can use it.
GitHub Copilot skills documentation · loads skills from .github/skills/, .claude/skills/, .agents/skills/
Install the "datastar" agent skill from https://github.com/romshark/datapages/tree/main/internal/generator/agentdocs/data/skills/datastar into .github/skills/datastar/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "datastar", then confirm the skill loads.GitHub Copilot copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add romshark/datapages --skill datastar -a opencodeOpenCode documents no install command of its own. Project install goes to .agents/skills/; add -g for ~/.config/opencode/skills/.
$ gh skill install romshark/datapages datastar --agent opencodeProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/romshark/datapages.git skills-src && mkdir -p .opencode/skills && cp -r skills-src/internal/generator/agentdocs/data/skills/datastar .opencode/skills/datastar && rm -rf skills-srcUse ~/.config/opencode/skills/ instead of .opencode/skills for a personal install.
OpenCode skills documentation · loads skills from .opencode/skills/, .claude/skills/, .agents/skills/
Install the "datastar" agent skill from https://github.com/romshark/datapages/tree/main/internal/generator/agentdocs/data/skills/datastar into .opencode/skills/datastar/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "datastar", then confirm the skill loads.OpenCode copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
Facts
- Skill name
datastar- GitHub stars
- 113
- Token cost
- ~1.5k tokens
- SKILL.md length
- 707 words
- Files
- 1
- Skills in repo
- 15
- Repo updated
- First seen
- Licence
- MIT
At a glance
Use Datastar data- attributes and actions in HTML and Templ templates, including signals, bindings, events, server actions and request options.
- Writing template markup that uses Datastar
- SKILL.md covers Attributes, Actions and Practice
- Instructions only: no scripts, shell commands, URLs or credentials in SKILL.md
What it does
Datastar is an agent skill from romshark/datapages. Use Datastar data- attributes and actions in HTML and Templ templates, including signals, bindings, events, server actions and request options. Use when writing template markup that uses Datastar.
Its SKILL.md is about 1.5k tokens, which your agent loads only when the skill is triggered. It is a single SKILL.md file with no bundled scripts.
The repository describes itself as: A Datastar Go web frontend framework. The licence is MIT.
When your agent uses it
- Writing template markup that uses Datastar
Example prompts
- “/datastar”
What it can do on your machine
Read from SKILL.md and the folder at commit 87d5a44. It shows what the files ask for, not the result of running them.
Tool permissions
Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.
From allowed-tools in the SKILL.md frontmatter.
Runs code
No scripts in the folder and no shell commands in SKILL.md.
From the folder's file list and the shell code blocks in SKILL.md.
Network
Links to these hosts (documentation or services it may open):
data-star.dev
From URLs in SKILL.md, links to its own repository left out.
Credentials
Names no API keys, tokens, secrets or passwords.
From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.
Context cost
Datastar loads about 1.5k tokens when it runs. Until then it costs about 52 tokens; SKILL.md has 707 words of instructions outside code blocks.
Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.
Safety
Auto-check passed
The automated check found no risky patterns in SKILL.md.
Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.
SKILL.md
The full file from romshark/datapages at commit 87d5a44, republished under its MIT licence (© romshark). 707 words, ~1,527 tokens.
Download SKILL.mdSave it as
.claude/skills/datastar/SKILL.md (or your agent's skills folder).- name
- datastar
- description
- Use Datastar data-* attributes and actions in HTML and Templ templates, including signals, bindings, events, server actions and request options. Use when writing template markup that uses Datastar.
Datastar
Datastar provides client-side reactivity through data-* attributes. Datapages serves Datastar v1.0.4 and manages its script tag and SSE streams. Docs: https://data-star.dev/docs.md
Signals are reactive variables written as $name. In an expression, Datastar replaces $signal references and binds el to the current element. The sandbox allows calls only to @name() action helpers.
Use hyphens in signal keys. data-signals:new-title declares $newTitle. HTML lowercases attribute names, so data-signals:newTitle declares $newtitle. To preserve case without hyphens, put the name in an attribute value, as in data-bind="newTitle".
Signal keys occur in data-bind:*, data-signals:*, data-computed:*, data-indicator:* and data-ref:*. Other keys remain in kebab-case. Use __case.camel|kebab|snake|pascal to override conversion. For example, data-on:widget-loaded__case.camel listens for widgetLoaded. A signal name must not contain __.
Datastar applies attributes depth first in DOM order. It applies them again when a patch changes them. Morphing preserves attributes that a patch does not change.
Attributes
| attribute | effect |
|---|---|
data-attr:aria-label="$foo" | sets an HTML attribute from an expression, kept in sync |
data-bind:name | two-way binding on input, select, textarea and web components; keeps a predefined signal's type; type=file gives base64 |
data-class:font-bold="$x" | adds or removes a class |
data-computed:foo="$a + $b" | read-only derived signal |
data-effect="$a = $b" | runs on load and whenever a signal it reads changes |
data-ignore | skip the element and its subtree; __self for the element alone |
data-ignore-morph | skip it while morphing |
data-indicator:fetching | true while a fetch is in flight; put it on the element that triggers one |
data-init="@get('/x')" | runs when the attribute initializes; __delay.500ms |
data-json-signals | dumps signals as JSON for debugging; __terse |
data-on:click="$x = 1" | event listener |
data-on-intersect | on viewport intersection; __once, __exit, __half, __full |
data-on-interval | repeatedly, default 1s; __duration.500ms |
data-on-signal-patch | whenever signals are patched; narrow it with data-on-signal-patch-filter |
data-preserve-attr="open class" | keeps those attributes across morphs |
data-ref:foo | exposes the element as $foo |
data-show="$x" | toggles display |
data-signals:count="0" | declares signals, dot notation nests them; null removes one; __ifmissing keeps an existing value; a _ prefix keeps it out of requests |
data-style:color="$c" | sets a style property, falsy restores the original |
data-text="$x" | sets the text content |
data-on modifiers: __once, __passive, __capture, __prevent, __stop, __window, __document, __outside, __delay.500ms, __debounce.500ms[.leading|.notrailing], __throttle.500ms[.noleading|.trailing], __viewtransition, __case.*.
Show full SKILL.md (370 more words)Show less
Actions
@get(url, opts), @post, @put, @patch, @delete and @query send a fetch request. In a Datapages app, use them through the generated action package. See datapages-templates.
@peek(fn) reads signals without subscribing to them. @setAll(value, {include, exclude}) and @toggleAll({include, exclude}) write every matching signal. The filters are regular expressions over signal paths.
Request options:
| option | values and effect |
|---|---|
contentType | json sends signals; form sends the closest form or the form selected by selector |
filterSignals | {include, exclude} regular expressions; signals prefixed with _ are excluded by default |
selector | selects the form for contentType: form |
headers | adds request headers |
openWhenHidden | defaults to false for GET and true for other methods |
payload | sets a request payload expression |
retry | auto for network errors, error for 4xx and 5xx, always or never |
retryInterval | defaults to 1000 ms |
retryScaler | defaults to 2 |
retryMaxWaitMs | defaults to 30000 ms |
retryMaxCount | defaults to 10 |
requestCancellation | auto, cleanup, disabled or an AbortController |
auto cancels an active request from the same element. cleanup also cancels the request when the element or attribute is removed.
Datastar handles a response by content type:
| content type | result |
|---|---|
text/event-stream | applies Datastar SSE events |
text/html | patches elements |
application/json | patches signals |
text/javascript | executes the response |
Each request fires datastar-fetch events. evt.detail.type is started, finished, error, retrying or retries-failed.
Practice
- Keep authoritative state on the server and transient UI state in signals. Use signals only when needed. Keep expressions to one statement and put application logic in Go.
- Patch elements instead of signals. Prefer one complete fragment over several small targeted updates.
- Encode a value with
json.Marshalbefore putting it in an attribute, or wrap the element indata-ignore. The browser decodes Templ's escaping before the expression is parsed, hence an apostrophe in the value ends the string and what follows runs as script. - Never put a secret in a signal. The browser can read signals, and requests send them to the server.
- Put
data-indicatoron the element that sends the request to show a loading state without JavaScript. - Navigate with
<a href>, not an action, so the browser keeps its history. Use default request options unless a requirement needs a different value.
A misused attribute logs Uncaught datastar runtime error: <name> with a link to a page explaining it.
© romshark, MIT. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file
Files
Just SKILL.md in internal/generator/agentdocs/data/skills/datastar of romshark/datapages.
Open the folder on GitHubat commit 87d5a44
Compare with similar skills
Datastar next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.
| Skill | Stars | Used in | Tokens | Auto-check | Licence | Repo updated |
|---|---|---|---|---|---|---|
| Datastar this skillromshark/datapages | 113 | — | ~1.5k | Automated safety check: Pass | MIT | |
| Performance AttributionHKUDS/Vibe-Trading | 35k | — | ~3.1k | Automated safety check: Pass | MIT | |
| Direction Attributethedaviddias/Front-End-Checklist | 74k | — | ~534 | Automated safety check: Pass | MIT | |
| Fetchpriority Attributethedaviddias/Front-End-Checklist | 74k | — | ~535 | Automated safety check: Pass | MIT | |
| Lang Attributethedaviddias/Front-End-Checklist | 74k | — | ~995 | Automated safety check: Pass | MIT | |
| Ads AttributionAgriciDaniel/claude-ads | 9.8k | — | ~499 | Automated safety check: Pass | MIT |
Similar skills
Direction Attribute
thedaviddias/Front-End-Checklist
A skill your agent uses when reviewing templates, rendered HTML, or shared components related to Set text direction for RTL languages.
Fetchpriority Attribute
thedaviddias/Front-End-Checklist
A skill your agent uses when optimising Largest Contentful Paint (LCP), reducing render-blocking resource contention, or fine-tuning resource loading order in the critical rendering path.
Lang Attribute
thedaviddias/Front-End-Checklist
A skill your agent uses when applies to all HTML documents. An agent skill from thedaviddias/Front-End-Checklist.
Ads Attribution
AgriciDaniel/claude-ads
Audit cross-platform attribution, conversion definitions, reporting windows, GA4, AdServices and AdAttributionKit, MMPs, browser and server events, offline conversions, and platform reconciliation.
Campaign Attribution Evidence Analysis
mukul975/Anthropic-Cybersecurity-Skills
Weighs infrastructure, TTP, malware code and timing evidence with the Diamond Model and competing hypotheses to reach a confidence-rated attribution.
More from romshark/datapages
All 15 skills in this repoDatapages
romshark/datapages
Apply the Datapages framework rules, build loop and naming conventions, and select the relevant task skill.
Datapages Events
romshark/datapages
Datapages real-time events: event types and subjects, dispatchers, On handlers, per-user and signal-bound subject fields, and the StreamOpen and StreamClose hooks.
Datapages Sessions
romshark/datapages
Add Datapages authentication: define and read the Session type, open and close sessions, configure CSRF protection and choose a session manager.
Datapages State
romshark/datapages
Add per-tab Datapages State[T], initialize and use it in handlers, dispatch state-scoped events, and configure the live instance limit.
Review Criteria
romshark/datapages
Classify Datapages findings by reach and severity and write review-.md reports.
Git Commits
romshark/datapages
Write Datapages commit messages, including the breaking-change marker and the BREAKING block.
Questions about Datastar
What does Datastar do?
Use Datastar data- attributes and actions in HTML and Templ templates, including signals, bindings, events, server actions and request options. Datastar is an agent skill from romshark/datapages. Use Datastar data- attributes and actions in HTML and Templ templates, including signals, bindings, events, server actions and request options.
When should I use Datastar?
Datastar fits situations like: writing template markup that uses Datastar.
How do I install Datastar in Claude Code?
Run `npx skills add romshark/datapages --skill datastar -a claude-code`. Or copy the skill folder (internal/generator/agentdocs/data/skills/datastar in romshark/datapages) into .claude/skills/datastar in your project. Claude Code loads it when a task matches its description.
How do I install Datastar in Codex?
Run `npx skills add romshark/datapages --skill datastar -a codex`. Or copy the skill folder (internal/generator/agentdocs/data/skills/datastar in romshark/datapages) into .agents/skills/datastar in your project. Codex loads it when a task matches its description.
Can I use Datastar in Cursor, Gemini CLI or GitHub Copilot?
Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add romshark/datapages --skill datastar -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/datastar, .gemini/skills/datastar, .github/skills/datastar and .opencode/skills/datastar in your project.
What does Datastar need to run?
SKILL.md names no scripts, command-line tools or credentials: Datastar is instructions for the agent only.
Does Datastar access the network?
SKILL.md names 1 domain. As links in the text: data-star.dev. This is read from the text; nothing was executed.
Is Datastar safe to install?
Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.
What licence does Datastar use?
Datastar is published under the MIT licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.
How many tokens does Datastar use?
About 1.5k tokens (SKILL.md is roughly 6.1k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.
What are the alternatives to Datastar?
Skills that share tags, products or a category with Datastar: Performance Attribution (HKUDS/Vibe-Trading, 35k stars), Direction Attribute (thedaviddias/Front-End-Checklist, 74k stars), Fetchpriority Attribute (thedaviddias/Front-End-Checklist, 74k stars) and Lang Attribute (thedaviddias/Front-End-Checklist, 74k stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.
Who maintains Datastar?
romshark (a GitHub user) maintains it in romshark/datapages, which has 113 GitHub stars. The repository holds 15 skills in this directory. The repository was last updated on October 7, 2026.
Source: romshark/datapages on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.