Web Artifacts Builder
anthropics/skills
Builds multi-component claude.ai HTML artifacts as a small React, TypeScript and Tailwind project, then bundles it into one shareable HTML file.
当任务触达动态 React 组件类型、列表 key、streaming UI，或 iframe/editor/media 等需要保持实例状态的界面时使用；也用于排查重渲染导致的焦点、选区、输入法或内嵌状态丢失。普通 React 修改不自动触发。
Install React Rendering Lifecycle Safety
$ npx skills add Peiiii/nextclaw --skill react-rendering-lifecycle-safety -a claude-codeProject install by default; add -g for ~/.claude/skills/.
$ gh skill install Peiiii/nextclaw react-rendering-lifecycle-safety --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/Peiiii/nextclaw.git skills-src && mkdir -p .claude/skills && cp -r skills-src/.agents/wiki/skills/frontend/react-rendering-lifecycle-safety .claude/skills/react-rendering-lifecycle-safety && 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 "react-rendering-lifecycle-safety" agent skill from https://github.com/Peiiii/nextclaw/tree/master/.agents/wiki/skills/frontend/react-rendering-lifecycle-safety into .claude/skills/react-rendering-lifecycle-safety/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "react-rendering-lifecycle-safety", 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/Peiiii/nextclaw/tree/master/.agents/wiki/skills/frontend/react-rendering-lifecycle-safetyType 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 Peiiii/nextclaw --skill react-rendering-lifecycle-safety -a codexProject install goes to .agents/skills/; add -g for ~/.codex/skills/.
$ gh skill install Peiiii/nextclaw react-rendering-lifecycle-safety --agent codexProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/Peiiii/nextclaw.git skills-src && mkdir -p .agents/skills && cp -r skills-src/.agents/wiki/skills/frontend/react-rendering-lifecycle-safety .agents/skills/react-rendering-lifecycle-safety && rm -rf skills-srcUse ~/.agents/skills/ instead of .agents/skills for a personal install.
Codex skills documentation · loads skills from .agents/skills/
Install the "react-rendering-lifecycle-safety" agent skill from https://github.com/Peiiii/nextclaw/tree/master/.agents/wiki/skills/frontend/react-rendering-lifecycle-safety into .agents/skills/react-rendering-lifecycle-safety/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "react-rendering-lifecycle-safety", 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 Peiiii/nextclaw --skill react-rendering-lifecycle-safety -a cursorProject install goes to .agents/skills/; add -g for ~/.cursor/skills/.
$ gh skill install Peiiii/nextclaw react-rendering-lifecycle-safety --agent cursorProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/Peiiii/nextclaw.git skills-src && mkdir -p .cursor/skills && cp -r skills-src/.agents/wiki/skills/frontend/react-rendering-lifecycle-safety .cursor/skills/react-rendering-lifecycle-safety && 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 "react-rendering-lifecycle-safety" agent skill from https://github.com/Peiiii/nextclaw/tree/master/.agents/wiki/skills/frontend/react-rendering-lifecycle-safety into .cursor/skills/react-rendering-lifecycle-safety/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "react-rendering-lifecycle-safety", 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/Peiiii/nextclaw.git --path .agents/wiki/skills/frontend/react-rendering-lifecycle-safety--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 Peiiii/nextclaw --skill react-rendering-lifecycle-safety -a gemini-cliProject install goes to .agents/skills/; add -g for ~/.gemini/skills/.
$ gh skill install Peiiii/nextclaw react-rendering-lifecycle-safety --agent gemini-cliProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/Peiiii/nextclaw.git skills-src && mkdir -p .gemini/skills && cp -r skills-src/.agents/wiki/skills/frontend/react-rendering-lifecycle-safety .gemini/skills/react-rendering-lifecycle-safety && 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 "react-rendering-lifecycle-safety" agent skill from https://github.com/Peiiii/nextclaw/tree/master/.agents/wiki/skills/frontend/react-rendering-lifecycle-safety into .gemini/skills/react-rendering-lifecycle-safety/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "react-rendering-lifecycle-safety", 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 Peiiii/nextclaw react-rendering-lifecycle-safetyInstalls 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 Peiiii/nextclaw --skill react-rendering-lifecycle-safety -a github-copilotProject install goes to .agents/skills/; add -g for ~/.copilot/skills/.
$ git clone --depth 1 https://github.com/Peiiii/nextclaw.git skills-src && mkdir -p .github/skills && cp -r skills-src/.agents/wiki/skills/frontend/react-rendering-lifecycle-safety .github/skills/react-rendering-lifecycle-safety && 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 "react-rendering-lifecycle-safety" agent skill from https://github.com/Peiiii/nextclaw/tree/master/.agents/wiki/skills/frontend/react-rendering-lifecycle-safety into .github/skills/react-rendering-lifecycle-safety/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "react-rendering-lifecycle-safety", 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 Peiiii/nextclaw --skill react-rendering-lifecycle-safety -a opencodeOpenCode documents no install command of its own. Project install goes to .agents/skills/; add -g for ~/.config/opencode/skills/.
$ gh skill install Peiiii/nextclaw react-rendering-lifecycle-safety --agent opencodeProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/Peiiii/nextclaw.git skills-src && mkdir -p .opencode/skills && cp -r skills-src/.agents/wiki/skills/frontend/react-rendering-lifecycle-safety .opencode/skills/react-rendering-lifecycle-safety && 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 "react-rendering-lifecycle-safety" agent skill from https://github.com/Peiiii/nextclaw/tree/master/.agents/wiki/skills/frontend/react-rendering-lifecycle-safety into .opencode/skills/react-rendering-lifecycle-safety/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "react-rendering-lifecycle-safety", 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
react-rendering-lifecycle-safety- GitHub stars
- 260
- Token cost
- ~872 tokens
- SKILL.md length
- 264 words
- Files
- 1
- Skills in repo
- 70
- Repo updated
- First seen
- Licence
- MIT
At a glance
当任务触达动态 React 组件类型、列表 key、streaming UI，或 iframe/editor/media 等需要保持实例状态的界面时使用；也用于排查重渲染导致的焦点、选区、输入法或内嵌状态丢失。普通 React 修改不自动触发。
- Works in 5 steps: 组件类型必须稳定 → key 和父级结构必须表达业务身份 → 状态型表面是硬生命周期边界 → …
- Frontend & Design work in your project
- SKILL.md covers 目标, 强制合同, 实现检查 and 根因排查, plus 3 more sections
- Instructions only: no scripts, shell commands, URLs or credentials in SKILL.md
What it does
React Rendering Lifecycle Safety is an agent skill from Peiiii/nextclaw. 当任务触达动态 React 组件类型、列表 key、streaming UI，或 iframe/editor/media 等需要保持实例状态的界面时使用；也用于排查重渲染导致的焦点、选区、输入法或内嵌状态丢失。普通 React 修改不自动触发。
Its SKILL.md is about 870 tokens, which your agent loads only when the skill is triggered. It is a single SKILL.md file with no bundled scripts.
It sits in Frontend & Design. It works with React. The repository describes itself as: A human-centered long-term AI partner—not a task-centered assistant. The licence is MIT.
When your agent uses it
- Frontend & Design work in your project
Example prompts
- “/react-rendering-lifecycle-safety”
Workflow steps
5 steps, taken from the step headings in SKILL.md.
What it can do on your machine
Read from SKILL.md and the folder at commit d130133. 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
No URLs in SKILL.md.
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
React Rendering Lifecycle Safety loads about 872 tokens when it runs. Until then it costs about 39 tokens; SKILL.md has 264 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 Peiiii/nextclaw at commit d130133, republished under its MIT licence (© Peiiii). 264 words, ~872 tokens.
Download SKILL.mdSave it as
.claude/skills/react-rendering-lifecycle-safety/SKILL.md (or your agent's skills folder).- name
- react-rendering-lifecycle-safety
- description
- 当任务触达动态 React 组件类型、列表 key、streaming UI，或 iframe/editor/media 等需要保持实例状态的界面时使用；也用于排查重渲染导致的焦点、选区、输入法或内嵌状态丢失。普通 React 修改不自动触发。
React Rendering Lifecycle Safety
目标
React 数据更新不应自动等价为结构重建。除非产品明确要求重置，流式输出、查询刷新、回调换引用和状态切换都必须保留历史内容与状态型表面的元素身份。
核心模型：React 用 type + key + 父级位置 识别元素。三者任一发生变化，都可能卸载旧 subtree 并重新挂载；memo、useMemo 和 useCallback 不能改变这条身份规则。
强制合同
1. 组件类型必须稳定
- 会作为 JSX 类型、Markdown renderer、component map entry 或 render registry value 使用的组件，默认在模块级声明。
- 动态数据、文案和回调通过 props、Context 或稳定 owner 读取；不得通过重新创建组件类型传递动态值。
- 禁止在组件 render、带动态依赖的
useMemo/useCallback或普通 factory 中创建组件函数，再把它作为 JSX 类型或第三方 renderer 交给 React。 useMemo(() => ({ p: () => ... }), [callback])仍会在依赖变化时生成新的组件类型；它只缓存值，不提供组件身份合同。
2. key 和父级结构必须表达业务身份
key使用稳定业务 ID，不使用数组索引、时间戳、streaming 状态、加载阶段或每次 render 新生成的值。pending -> streaming -> final、查询刷新、排序反馈和局部内容追加，不得改变同一业务实体的 key。- 不要因为状态变化在互不相同的 wrapper / group / portal 结构之间搬运同一 subtree；确需改变父级结构时，先判断是否会重置内部状态。
3. 状态型表面是硬生命周期边界
- iframe、Panel App、editor、canvas、audio、video、WebGL、文件预览和持有浏览器 selection 的文本节点，默认必须保留 DOM 实例。
- 动态分组、折叠、消息聚合和流程摘要不能吞并或跨越这些边界。
- 只有明确的重置、关闭、切换实体或用户主动刷新才能 remount；必须用语义化 key 或显式 reset action 表达，并有测试证明。
4. 后台同步不得接管用户交互状态
- 用户未操作时，不得调用
focus()、改写 DOM selection、恢复旧焦点或关闭当前弹层。 - editor/store/query 的后台同步只更新其拥有的数据；浏览器
activeElement、文字选区和外部弹层不归输入 owner 自动接管。 - 不要在每个 Popover、搜索框或预览区保存/恢复焦点来掩盖上游违约；先修真正触发 focus、selection 或 remount 的 owner。
5. Editor 框架必须独占实时输入状态
- 集成 Lexical、ProseMirror 等 editor 时，先确认框架已拥有的
beforeinput、input、composition、selection 和平台兼容管线；业务层不得再次拦截同一原生事件并从外部快照重建文档。 - React/store 中的 draft 默认是发送、持久化或恢复投影，不是普通键入期间与 editor 并列的第二个可写文档 owner。
- 普通文字、IME 候选词替换、删除和换行优先走 editor 原生命令；只有明确 reset/restore/token 等程序化意图才能写回 editor，并用精确 update tag/source 区分，禁止用定时器或整帧布尔锁忽略 update。
- 若自定义原子节点删除，直接修改目标 editor node，不得先线性化全文再清空 root 重建 selection。
实现检查
修改 React 渲染链路前，逐项确认：
- 哪些 props、query wrapper、callbacks 会在流式或刷新期间换引用。
- 这些动态值是否参与创建组件类型、renderer map、key 或父级分组。
- 哪些 subtree 持有浏览器状态或第三方运行时状态，必须视为硬边界。
loading / pending / streaming / final / error是否只改变 props 和可见内容，而不替换同一实体的结构身份。- 是否存在因历史焦点问题留下的
onFocusOutside.preventDefault()、selection restore 或定时 focus 补丁；根因修复后应删除。 - editor 是否同时被原生事件、React handler 和外部 draft 回灌多路写入；若是，先收敛实时 owner，再讨论事件特判。
根因排查
焦点或选区消失时，必须先区分两类问题：
- DOM 被替换：保存目标
Node/ iframe 引用，更新后检查isConnected与currentNode === previousNode。 - DOM 未替换但焦点被转移：检查
document.activeElement、Selection 的 anchor/focus node，以及谁调用了focus()或提交了 editor selection。
不能只凭“看起来像抢焦点”下结论。先证明是 remount、focus transfer，还是两者同时存在。
验证合同
涉及 streaming、renderer map、列表分组或状态型表面时，至少增加一条贴近风险的 DOM 身份回归：
- 保持文本内容不变，只替换动态 callback / query wrapper，断言 Text node 身份不变且 Selection 仍存在。
- 追加后续消息、reasoning 或工具结果，断言 iframe/editor/canvas 是同一节点。
- 覆盖
pending -> streaming -> final，而不只测试一个静态 render。 - 用户可见问题在条件允许时再做真实浏览器冒烟；单元测试必须直接断言节点身份，不能只断言内容仍可查询。
- IME 回归必须覆盖真实事件类别与顺序，例如预编辑、候选键、composition input、composition end，并在最终 consumer 中断言正文节点身份和 caret；只触发
compositionEnd(data)不能代替浏览器对 DOM 的实际写入。
与其他 Skill 的关系
以下是超出本合同后的单一路由，不是并行依赖；一次只选择当前需要的一个 owner：
- 状态、query/store、streaming flow owner：联动View Logic 解耦。
- Popover、焦点、键盘和交互反馈：联动交互质量。
- 组件拆分与抽象必要性：由标准开发流程按需读取实现工艺 reference。
- bugfix 验证与浏览器验收：返回当前生命周期，由 Validation 阶段负责。
输出要求
使用本 skill 后，说明：组件类型是否稳定、key/父级是否稳定、哪些 subtree 是硬生命周期边界、是否存在后台焦点/选区写入，以及节点身份如何被验证。
© Peiiii, 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 .agents/wiki/skills/frontend/react-rendering-lifecycle-safety of Peiiii/nextclaw.
Open the folder on GitHubat commit d130133
Compare with similar skills
React Rendering Lifecycle Safety 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 |
|---|---|---|---|---|---|---|
| React Rendering Lifecycle Safety this skillPeiiii/nextclaw | 260 | — | ~872 | Automated safety check: Pass | MIT | |
| Web Artifacts Builderanthropics/skills | 180k | 40 repos | ~769 | Automated safety check: Pass | Apache-2.0 | |
| React Doctormakeplane/plane | 60k | 12 repos | ~657 | Automated safety check: Pass | AGPL-3.0 | |
| React Composition Patternsvercel-labs/openreview | 1.7k | 58 repos | ~721 | Automated safety check: Pass | MIT | |
| React Router Developmentremix-run/react-router | 57k | 1 repos | ~1.5k | Automated safety check: Pass | MIT | |
| React UI State PatternsChrisWiles/claude-code-showcase | 6.1k | 7 repos | ~1.6k | Automated safety check: Pass | None |
Similar skills
- Official
React Doctor
makeplane/plane
Scans React code for lint, accessibility, bundle size and architecture issues, reports a health score and checks that changes do not lower it.
- Official
React Composition Patterns
vercel-labs/openreview
Rules for structuring React components with composition instead of boolean props, covering compound components, lifted state, variants and React 19 changes.
React Router Development
remix-run/react-router
Guides work on React Router apps by first identifying whether the app uses Framework, Data or Declarative mode, then loading the matching reference and the installed package docs.
React UI State Patterns
ChrisWiles/claude-code-showcase
Sets patterns for React interfaces: when to show loading spinners or skeletons, how to surface errors, how to disable buttons during async work and how to handle empty lists.
GSAP Core Animation
greensock/gsap-skills
Covers the GSAP core API for tweens, easing, staggers, defaults and matchMedia, and when to choose GSAP over CSS animations or other JavaScript animation libraries.
More from Peiiii/nextclaw
All 70 skills in this repoNextclaw Skin Studio
Peiiii/nextclaw
A skill your agent uses when a user wants to browse, apply, inspect, create, refine, switch, or remove a NextClaw skin; wants a personal skin with arbitrary CSS, JavaScript, images, SVG, DOM…
Development Task Telemetry
Peiiii/nextclaw
A skill your agent uses when a development task needs visible phase tracing, task-level or phase-level Token measurement, model/effort comparison, or a deterministic usage report or local dashboard…
Nextclaw Product Visual Assets
Peiiii/nextclaw
当 NextClaw 产品更新后需要生成、替换、挑毛病或检查官网、GitHub README、用户文档或社交传播中的真实截图、AI 宣传视觉、整页 HTML 宣传预览、社区二维码等对外视觉资产时使用；也用于“更新截图”“重新截一批图”“做宣传页”“生成 campaign 页面”“视觉审稿”“五星挑刺法”或发布前检查视觉资产。普通站点布局开发或只写文章不触发。
UI UX Pro Max
Peiiii/nextclaw
A skill your agent uses when the user wants professional UI/UX design guidance, design-system generation, UX review, or stack-specific frontend guidance through a bundled local UI/UX Pro Max dataset…
Impeccable
Peiiii/nextclaw
A skill your agent uses when the user wants distinctive, production-grade frontend design, anti-generic AI aesthetics, UX critique, technical UI audits, or final polish through bundled Impeccable…
Nextclaw Skill Resource Hub
Peiiii/nextclaw
Curate NextClaw skill resources, including OpenClaw and community sources.
Related
Works with
Categories
Questions about React Rendering Lifecycle Safety
What does React Rendering Lifecycle Safety do?
当任务触达动态 React 组件类型、列表 key、streaming UI，或 iframe/editor/media 等需要保持实例状态的界面时使用；也用于排查重渲染导致的焦点、选区、输入法或内嵌状态丢失。普通 React 修改不自动触发。. React Rendering Lifecycle Safety is an agent skill from Peiiii/nextclaw.
When should I use React Rendering Lifecycle Safety?
React Rendering Lifecycle Safety fits situations like: frontend & Design work in your project.
How do I install React Rendering Lifecycle Safety in Claude Code?
Run `npx skills add Peiiii/nextclaw --skill react-rendering-lifecycle-safety -a claude-code`. Or copy the skill folder (.agents/wiki/skills/frontend/react-rendering-lifecycle-safety in Peiiii/nextclaw) into .claude/skills/react-rendering-lifecycle-safety in your project. Claude Code loads it when a task matches its description.
How do I install React Rendering Lifecycle Safety in Codex?
Run `npx skills add Peiiii/nextclaw --skill react-rendering-lifecycle-safety -a codex`. Or copy the skill folder (.agents/wiki/skills/frontend/react-rendering-lifecycle-safety in Peiiii/nextclaw) into .agents/skills/react-rendering-lifecycle-safety in your project. Codex loads it when a task matches its description.
Can I use React Rendering Lifecycle Safety 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 Peiiii/nextclaw --skill react-rendering-lifecycle-safety -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/react-rendering-lifecycle-safety, .gemini/skills/react-rendering-lifecycle-safety, .github/skills/react-rendering-lifecycle-safety and .opencode/skills/react-rendering-lifecycle-safety in your project.
What does React Rendering Lifecycle Safety need to run?
SKILL.md names no scripts, command-line tools or credentials: React Rendering Lifecycle Safety is instructions for the agent only.
Does React Rendering Lifecycle Safety access the network?
SKILL.md contains no URLs. Any network use would come from the scripts or tools the agent runs. This is read from the text; nothing was executed.
Is React Rendering Lifecycle Safety 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 React Rendering Lifecycle Safety use?
React Rendering Lifecycle Safety 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 React Rendering Lifecycle Safety use?
About 872 tokens (SKILL.md is roughly 3.5k 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 React Rendering Lifecycle Safety?
Skills that share tags, products or a category with React Rendering Lifecycle Safety: Web Artifacts Builder (anthropics/skills, 180k stars), React Doctor (makeplane/plane, 60k stars), React Composition Patterns (vercel-labs/openreview, 1.7k stars) and React Router Development (remix-run/react-router, 57k stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.
Who maintains React Rendering Lifecycle Safety?
Peiiii (a GitHub user) maintains it in Peiiii/nextclaw, which has 260 GitHub stars. The repository holds 70 skills in this directory. The repository was last updated on October 6, 2026.
Source: Peiiii/nextclaw on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.