preact · Preact Docs
Preact Differences to React
Explains the architectural and behavioral differences between Preact and React, specifically regarding event systems, attribute naming, and component rendering.
Derived skill
Files assembled from official documentation
Viewing SKILL.md
Preact Differences to React
Explains the architectural and behavioral differences between Preact and React, specifically regarding event systems, attribute naming, and component rendering.
When To Use
Use when migrating a React codebase to Preact or when troubleshooting why standard React event patterns or attribute names are behaving differently in a Preact environment.
Reference Files
| File | Contains | Use For |
|---|---|---|
SKILL.md | Entry point: scope, routing table, and workflow. | Start here. |
docs/preact-differences-to-react-workflow-guide.md | A guide detailing the architectural and functional differences between Preact and React across essentials, debugging, and advanced topics. | Questions about a guide detailing the architectural and functional differences between Preact and React across essentials, debugging,... |
examples/preact-differences-to-react-debug-import-guide.text | A text guide explaining how to import preact/debug to highlight differences between Preact and React during development. | Exact payloads, commands, or snippets shown in A text guide explaining how to import preact/debug to highlight differences between Preact and React during development. |
examples/preact-differences-to-react-component-compatibility.text | A code example demonstrating component syntax that remains compatible between Preact and React. | Exact payloads, commands, or snippets shown in A code example demonstrating component syntax that remains compatible between Preact and React. |
examples/preact-differences-to-react-component-render-props.text | A code example demonstrating how Preact's render method accepts arguments for props and state, unlike React. | Exact payloads, commands, or snippets shown in A code example demonstrating how Preact's render method accepts arguments for props and state, unlike React. |
examples/preact-differences-to-react-syntax-comparison.text | A text-based comparison demonstrating syntax differences between Preact and React implementations. | Exact payloads, commands, or snippets shown in A text-based comparison demonstrating syntax differences between Preact and React implementations. |
examples/preact-differences-to-react-attribute-comparison.text | A text comparison demonstrating the differences in attribute naming conventions between React and Preact, specifically regarding SVG properties like stroke-width. | Exact payloads, commands, or snippets shown in A text comparison demonstrating the differences in attribute naming conventions between React and Preact, specificall... |
examples/preact-differences-to-react-event-target-comparison.text | A comparison showing the difference in accessing currentTarget in React versus Preact event handlers. | Exact payloads, commands, or snippets shown in A comparison showing the difference in accessing currentTarget in React versus Preact event handlers. |
examples/preact-differences-to-react-comparison-guide.text | A text-based comparison outlining the architectural and functional differences between Preact and React. | Exact payloads, commands, or snippets shown in A text-based comparison outlining the architectural and functional differences between Preact and React. |
examples/preact-differences-to-react-h-function-vs-react-createelement.text | A comparison showing the syntax difference between Preact's h function and React's createElement method. | Exact payloads, commands, or snippets shown in A comparison showing the syntax difference between Preact's h function and React's createElement method. |
What This Skill Covers
- Guide Version: 11.x (preview) 10.x (current) 8.x
- Main sections:
Introduction,Essentials,Debug & Test,Advanced,Libraries.
Workflow
- Open the most relevant file under
docs/for the exact documented workflow and wording. - Open
schemas/files for exact structured contracts. - Open
examples/files for concrete requests, commands, snippets, and manifests. - Do not add behavior or configuration that is not present in the attached source files.
Canonical source: https://preactjs.com/guide/v10/differences-to-react