solidjs

SolidJS reactive UI library with fine-grained reactivity and JSX. Use for performant React-like apps.

7 stars

byG1Joshi

View on GitHub Installation ↓

Best use case

solidjs is best used when you need a repeatable AI agent workflow instead of a one-off prompt.

SolidJS reactive UI library with fine-grained reactivity and JSX. Use for performant React-like apps.

Teams using solidjs should expect a more consistent output, faster repeated execution, less prompt rewriting.

When to use this skill

You want a reusable workflow that can be run more than once with consistent structure.

When not to use this skill

You only need a quick one-off answer and do not need a reusable workflow.
You cannot install or maintain the underlying files, dependencies, or repository context.

Installation

Claude Code / Cursor / Codex

$curl -o ~/.claude/skills/solidjs/SKILL.md --create-dirs "https://raw.githubusercontent.com/G1Joshi/Agent-Skills/main/skills/frameworks/solidjs/SKILL.md"

Manual Installation

Download SKILL.md from GitHub
Place it in .claude/skills/solidjs/SKILL.md inside your project
Restart your AI agent — it will auto-discover the skill

How solidjs Compares

Feature / Agent	solidjs	Standard Approach
Platform Support	Not specified	Limited / Varies
Context Awareness	High	Baseline
Installation Complexity	Unknown	N/A

Frequently Asked Questions

What does this skill do?

SolidJS reactive UI library with fine-grained reactivity and JSX. Use for performant React-like apps.

Where can I find the source code?

You can find the source code on GitHub using the link provided at the top of the page.

SKILL.md Source

# SolidJS

SolidJS looks like React but has **no Virtual DOM**. It compiles to direct DOM updates using fine-grained reactivity (Signals). 2025 focuses on SolidStart (meta-framework).

## When to Use

- **Performance**: Consistently tops benchmarks.
- **Real-time**: Fine-grained updates make it ideal for dashboards.
- **Mental Model**: If you prefer "it only runs once" components vs React's re-renders.

## Core Concepts

### Signals (`createSignal`)

The atom of state. `const [count, setCount] = createSignal(0)`.

### Effects (`createEffect`)

Runs when dependencies change. Automatic dependency tracking.

### Show / For

Control flow components (`<Show when={...}>`) instead of `map`.

## Best Practices (2025)

**Do**:

- **Use `createResource`**: For async data fetching.
- **Access signals as functions**: `count()` not `count`.
- **Use SolidStart**: For file-system routing and SSR.

**Don't**:

- **Don't destructure props**: Reactivity is lost if you destructure `props`.

## References

- [SolidJS Documentation](https://www.solidjs.com/)