agentsclimarketplace

Preact best practices

Skill mkgp-dev/codex-skills/skills/.experimental/preact-best-practices

A collection of reusable Codex skills for coding tasks.

Install
npx -y skills add mkgp-dev/codex-skills --skill preact-best-practices

Assembled from the repository path, not quoted from the project. Check it against their README if it does not work.

One thing to look at

  • 0 stars0 stars. Stars are a popularity signal and not a quality one, but at this level it is likely that nobody has read this closely except its author, and you would be relying on your own review.

What its author says it does

Copied from the file, not written here

Best-practice guidance for authoring, reviewing, debugging, and modernizing Preact v10 apps and components, including hooks, signals, `preact/compat`, SSR, performance, and testing. Use this skill whenever the user is working in Preact (or `preact/compat`), asks for Preact equivalents to React patterns, needs help choosing signals vs hooks for shared state, is debugging rerenders or hydration issues, or wants maintainable Preact-first patterns instead of React-only assumptions.

SKILL.md

2.8 KB, as published. Nobody here has run it

Preact Best Practices

Use this skill to write and review Preact v10 code with Preact-first defaults, while selectively importing React best practices when they transfer cleanly. Keep preact/compat guidance explicit: treat it as an interop boundary, not the default.

Use This Skill When

  • Building or reviewing Preact components, hooks, or shared UI patterns
  • Deciding between signals, hooks, and local component state
  • Debugging rerenders, effect loops, stale closures, or hydration mismatches
  • Writing or fixing tests using Preact Testing Library patterns
  • Integrating React-ecosystem packages via preact/compat and wanting the tradeoffs made explicit

Out Of Scope

  • Generic React-only advice that assumes React internals apply unchanged to Preact
  • Full framework selection debates (keep advice bounded to Preact usage once chosen)
  • Tooling or bundler setup tutorials unless the user explicitly asks

Working Style

  1. Identify whether the task is authoring, review, debugging, modernization, SSR, testing, or compat interop.
  2. Prefer Preact-native patterns first; only reach for preact/compat when ecosystem constraints force it.
  3. Load only the rule files relevant to the user’s situation (see the rule index below).
  4. When reviewing code, separate correctness issues from optional improvements.

Rule Index (Load Only What You Need)

Core:

  • rules/core-component-boundaries.md
  • rules/core-children-and-keys.md

Hooks:

  • rules/hooks-effect-deps-and-cleanup.md
  • rules/hooks-derive-state-dont-sync.md

Signals:

  • rules/signals-choose-signals-vs-hooks.md
  • rules/signals-avoid-double-sources-of-truth.md

Compat:

  • rules/compat-dont-default-to-compat.md

SSR:

  • rules/ssr-avoid-hydration-mismatch.md

Testing:

  • rules/test-prefer-user-queries.md

Performance:

  • rules/perf-fix-rerenders-before-memo.md

Response Requirements

  • Prefer TypeScript examples unless the user explicitly wants plain JavaScript.
  • Be explicit about tradeoffs when recommending signals vs hooks.
  • If suggesting preact/compat, name what is gained and what is lost, and say when to avoid it.
  • Prefer correctness and maintainability over micro-optimizations.

Provenance

This skill is based on the official Preact v10 guides plus portable UI best practices adapted from common React discipline where the underlying principles apply.

Keep looking

Skills are one crate of 328,083. Ordering is by how many stacks a row turns up in, so the top of any crate is what has actually been picked rather than what has the most stars.