React Native Best Practices
vercel-labs/openreview
A prioritized rule set for React Native and Expo apps covering list performance, animation, navigation, UI patterns, state, rendering, monorepos and configuration.
Kuikly 响应式更新与指令系统开发助手(Kuikly DSL)。指导如何使用 observable、observableList、observableSet 实现 UI 响应式更新，以及 vfor、vforIndex、vforLazy、vif、velseif、velse、vbind 等指令的正确用法。当用户在 Kuikly 中需要以下场景时使用：(1) 声明响应式字段并绑定到 UI 属性…
Install Kuikly Reactive Observer
$ npx skills add Tencent-TDS/KuiklyUI-AI --skill kuikly-reactive-observer -a claude-codeProject install by default; add -g for ~/.claude/skills/.
$ gh skill install Tencent-TDS/KuiklyUI-AI kuikly-reactive-observer --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/Tencent-TDS/KuiklyUI-AI.git skills-src && mkdir -p .claude/skills && cp -r skills-src/skills/kuikly-reactive-observer .claude/skills/kuikly-reactive-observer && 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 "kuikly-reactive-observer" agent skill from https://github.com/Tencent-TDS/KuiklyUI-AI/tree/main/skills/kuikly-reactive-observer into .claude/skills/kuikly-reactive-observer/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "kuikly-reactive-observer", 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/Tencent-TDS/KuiklyUI-AI/tree/main/skills/kuikly-reactive-observerType 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 Tencent-TDS/KuiklyUI-AI --skill kuikly-reactive-observer -a codexProject install goes to .agents/skills/; add -g for ~/.codex/skills/.
$ gh skill install Tencent-TDS/KuiklyUI-AI kuikly-reactive-observer --agent codexProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/Tencent-TDS/KuiklyUI-AI.git skills-src && mkdir -p .agents/skills && cp -r skills-src/skills/kuikly-reactive-observer .agents/skills/kuikly-reactive-observer && rm -rf skills-srcUse ~/.agents/skills/ instead of .agents/skills for a personal install.
Codex skills documentation · loads skills from .agents/skills/
Install the "kuikly-reactive-observer" agent skill from https://github.com/Tencent-TDS/KuiklyUI-AI/tree/main/skills/kuikly-reactive-observer into .agents/skills/kuikly-reactive-observer/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "kuikly-reactive-observer", 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 Tencent-TDS/KuiklyUI-AI --skill kuikly-reactive-observer -a cursorProject install goes to .agents/skills/; add -g for ~/.cursor/skills/.
$ gh skill install Tencent-TDS/KuiklyUI-AI kuikly-reactive-observer --agent cursorProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/Tencent-TDS/KuiklyUI-AI.git skills-src && mkdir -p .cursor/skills && cp -r skills-src/skills/kuikly-reactive-observer .cursor/skills/kuikly-reactive-observer && 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 "kuikly-reactive-observer" agent skill from https://github.com/Tencent-TDS/KuiklyUI-AI/tree/main/skills/kuikly-reactive-observer into .cursor/skills/kuikly-reactive-observer/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "kuikly-reactive-observer", 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/Tencent-TDS/KuiklyUI-AI.git --path skills/kuikly-reactive-observer--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 Tencent-TDS/KuiklyUI-AI --skill kuikly-reactive-observer -a gemini-cliProject install goes to .agents/skills/; add -g for ~/.gemini/skills/.
$ gh skill install Tencent-TDS/KuiklyUI-AI kuikly-reactive-observer --agent gemini-cliProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/Tencent-TDS/KuiklyUI-AI.git skills-src && mkdir -p .gemini/skills && cp -r skills-src/skills/kuikly-reactive-observer .gemini/skills/kuikly-reactive-observer && 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 "kuikly-reactive-observer" agent skill from https://github.com/Tencent-TDS/KuiklyUI-AI/tree/main/skills/kuikly-reactive-observer into .gemini/skills/kuikly-reactive-observer/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "kuikly-reactive-observer", 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 Tencent-TDS/KuiklyUI-AI kuikly-reactive-observerInstalls 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 Tencent-TDS/KuiklyUI-AI --skill kuikly-reactive-observer -a github-copilotProject install goes to .agents/skills/; add -g for ~/.copilot/skills/.
$ git clone --depth 1 https://github.com/Tencent-TDS/KuiklyUI-AI.git skills-src && mkdir -p .github/skills && cp -r skills-src/skills/kuikly-reactive-observer .github/skills/kuikly-reactive-observer && 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 "kuikly-reactive-observer" agent skill from https://github.com/Tencent-TDS/KuiklyUI-AI/tree/main/skills/kuikly-reactive-observer into .github/skills/kuikly-reactive-observer/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "kuikly-reactive-observer", 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 Tencent-TDS/KuiklyUI-AI --skill kuikly-reactive-observer -a opencodeOpenCode documents no install command of its own. Project install goes to .agents/skills/; add -g for ~/.config/opencode/skills/.
$ gh skill install Tencent-TDS/KuiklyUI-AI kuikly-reactive-observer --agent opencodeProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/Tencent-TDS/KuiklyUI-AI.git skills-src && mkdir -p .opencode/skills && cp -r skills-src/skills/kuikly-reactive-observer .opencode/skills/kuikly-reactive-observer && 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 "kuikly-reactive-observer" agent skill from https://github.com/Tencent-TDS/KuiklyUI-AI/tree/main/skills/kuikly-reactive-observer into .opencode/skills/kuikly-reactive-observer/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "kuikly-reactive-observer", 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
kuikly-reactive-observer- GitHub stars
- 130
- Token cost
- ~901 tokens
- SKILL.md length
- 104 words
- Files
- 3 (incl. references)
- Skills in repo
- 13
- Repo updated
- First seen
- Licence
- Custom licence
At a glance
Kuikly 响应式更新与指令系统开发助手(Kuikly DSL)。指导如何使用 observable、observableList、observableSet 实现 UI 响应式更新，以及 vfor、vforIndex、vforLazy、vif、velseif、velse、vbind 等指令的正确用法。当用户在 Kuikly 中需要以下场景时使用：(1) 声明响应式字段并绑定到 UI 属性…
- Mobile work in your project
- SKILL.md covers 核心机制, 响应式字段声明, 指令系统 and 高效更新列表：diffUpdate, plus 1 more section
- Instructions only: no scripts, shell commands, URLs or credentials in SKILL.md
What it does
Kuikly Reactive Observer is an agent skill from Tencent-TDS/KuiklyUI-AI. Kuikly 响应式更新与指令系统开发助手(Kuikly DSL)。指导如何使用 observable、observableList、observableSet 实现 UI 响应式更新，以及 vfor、vforIndex、vforLazy、vif、velseif、velse、vbind 等指令的正确用法。当用户在 Kuikly 中需要以下场景时使用：(1) 声明响应式字段并绑定到 UI 属性 (2) 列表渲染（vfor/vforIndex/vforLazy） (3) 条件渲染（vif/velseif/velse） (4) 值绑定渲染（vbind） (5) 高效列表更新（diffUpdate） (6) 响应式数据不生效、UI 不更新等问题排查 (7) observableList/observableSet 的增删改操作 (8) 复杂对象的响应式更新策略
Its SKILL.md is about 900 tokens, which your agent loads only when the skill is triggered. The skill folder holds 3 other files, including reference files (for example `references/COMMON_MISTAKES.md` and `references/DIRECTIVE_RULES.md`).
It sits in Mobile. The repository describes itself as: AI-powered development tools and rules for KuiklyUI — boost your Kuikly cross-platform development productivity.
When your agent uses it
- Mobile work in your project
Example prompts
- “/kuikly-reactive-observer”
What it can do on your machine
Read from SKILL.md and the folder at commit af4e8ee. 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 (its code samples are kotlin).
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
Kuikly Reactive Observer loads about 901 tokens when it runs, and up to ~3.1k if it reads all its reference files. Until then it costs about 102 tokens; SKILL.md has 104 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
Its licence (Custom licence) doesn't allow us to republish the file, so here is its outline and opening line. It has 104 words (~901 tokens).
“attr {} 闭包中读取响应式字段时，框架自动收集依赖；字段值变化时，自动更新绑定的 UI 属性。只需更新数据，UI 自动响应。”
- name
- kuikly-reactive-observer
Files
SKILL.md and 2 other files (references) in skills/kuikly-reactive-observer of Tencent-TDS/KuiklyUI-AI.
- SKILL.md
- references/COMMON_MISTAKES.md
- references/DIRECTIVE_RULES.md
Open the folder on GitHubat commit af4e8ee
Compare with similar skills
Kuikly Reactive Observer 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 |
|---|---|---|---|---|---|---|
| Kuikly Reactive Observer this skillTencent-TDS/KuiklyUI-AI | 130 | — | ~901 | Automated safety check: Pass | Custom licence | |
| React Native Best Practicesvercel-labs/openreview | 1.7k | 17 repos | ~1.1k | Automated safety check: Pass | MIT | |
| Swiftui Protwostraws/SwiftUI-Agent-Skill | 5.6k | 2 repos | ~1.5k | Automated safety check: Pass | MIT | |
| Kortix Brandkortix-ai/suna | 20k | — | ~4k | Automated safety check: Pass | Custom licence | |
| Ip As LogoKartikLabhshetwar/better-shot | 2.4k | 1 repos | ~4.3k | Automated safety check: Pass | MIT | |
| Compose Multiplatform Patternsmonta-app/ocpp-emulator | 180 | 5 repos | ~2k | Automated safety check: Pass | Apache-2.0 |
Similar skills
- Official
Swiftui Pro
twostraws/SwiftUI-Agent-Skill
Comprehensively reviews SwiftUI code for best practices on modern APIs, maintainability, and performance.
Kortix Brand
kortix-ai/suna
Load FIRST for anything that carries the Kortix look or voice: product or mobile UI, copy of any kind, decks, social, images, email, CLI output, anything with the logo, and reviews of these.
Ip As Logo
KartikLabhshetwar/better-shot
Generate extremely simple, cute, personified square character images with rounded heavy forms, two purposeful character colors, one solid background color, and a dominant lower-corner composition.
Compose Multiplatform Patterns
monta-app/ocpp-emulator
Compose Multiplatform and Jetpack Compose patterns for KMP projects — state management, navigation, theming, performance, and platform-specific UI.
Aso Appstore Screenshots
adamlyttleapps/claude-skill-aso-appstore-screenshots
Generate high-converting App Store screenshots by analyzing your app's codebase, discovering core benefits, and creating ASO-optimized screenshot images using Nano Banana Pro.
More from Tencent-TDS/KuiklyUI-AI
All 13 skills in this repoKuikly UI Framework
Tencent-TDS/KuiklyUI-AI
Kuikly UI 框架开发助手（传统 Kuikly DSL）。帮助使用 Kuikly 组件（View、Text、Button、List、Image、Modal、ActionSheet、Input、Scroller、Tabs 等 UI 组件）和模块（Router、Network、SP、Notify 等系统模块），自动提供正确的 import 语句、API…
Kuikly Compose UI Framework
Tencent-TDS/KuiklyUI-AI
Kuikly Compose DSL 框架开发助手。帮助使用 Kuikly Compose DSL 语法进行跨平台 UI 开发，提供 Compose 组件、Modifier、动画、手势、状态管理、导航、ViewModel 等 API 的正确使用方法和完整代码示例。适用场景：Kuikly Compose 页面开发、Compose 组件使用、Compose 布局实现、Compose…
Kuikly Animation
Tencent-TDS/KuiklyUI-AI
Kuikly DSL 动画开发助手(Kuikly DSL)。指导使用声明式和命令式两种方式实现 transform、opacity、backgroundColor、frame 等属性动画，涵盖串行/并行编排与动画取消。当用户需要实现动画效果时使用。
Kuikly Assets Resource
Tencent-TDS/KuiklyUI-AI
Kuikly 资源文件管理与加载助手。指导如何在 Kuikly 中添加、打包和加载 assets 资源，包括目录结构规范（common/页面资源）、各平台打包配置（Android/iOS/鸿蒙/H5/微信小程序/动态化）、ImageUri API 使用。当用户需要在 Kuikly 中使用本地图片资源、配置 assets 打包时使用。
Kuikly Compose Interop Dsl
Tencent-TDS/KuiklyUI-AI
Compose DSL 混用 Kuikly DSL 完整开发助手。指导如何在 Compose DSL 页面中嵌入 Kuikly DSL 组件（DeclarativeBaseView / ViewContainer)及在 Compose 中调用 Kuikly Module。当用户需要在 Compose 页面中复用 Kuikly DSL 组件、封装原生 View 为 Composable、在…
Kuikly Coroutines Threading
Tencent-TDS/KuiklyUI-AI
Kuikly 协程与多线程编程助手。指导如何在 Kuikly 中进行异步编程，包括 Kuikly 内建协程、kotlinx 协程、kuiklyx 协程库。当用户在 Kuikly 中需要执行异步任务、切换线程、使用协程、回到 Kuikly 线程更新 UI、排查线程安全问题时使用。
Related
Categories
Questions about Kuikly Reactive Observer
What does Kuikly Reactive Observer do?
Kuikly 响应式更新与指令系统开发助手(Kuikly DSL)。指导如何使用 observable、observableList、observableSet 实现 UI 响应式更新，以及 vfor、vforIndex、vforLazy、vif、velseif、velse、vbind 等指令的正确用法。当用户在 Kuikly 中需要以下场景时使用：(1) 声明响应式字段并绑定到 UI 属性…. Kuikly Reactive Observer is an agent skill from Tencent-TDS/KuiklyUI-AI.
When should I use Kuikly Reactive Observer?
Kuikly Reactive Observer fits situations like: mobile work in your project.
How do I install Kuikly Reactive Observer in Claude Code?
Run `npx skills add Tencent-TDS/KuiklyUI-AI --skill kuikly-reactive-observer -a claude-code`. Or copy the skill folder (skills/kuikly-reactive-observer in Tencent-TDS/KuiklyUI-AI) into .claude/skills/kuikly-reactive-observer in your project. Claude Code loads it when a task matches its description.
How do I install Kuikly Reactive Observer in Codex?
Run `npx skills add Tencent-TDS/KuiklyUI-AI --skill kuikly-reactive-observer -a codex`. Or copy the skill folder (skills/kuikly-reactive-observer in Tencent-TDS/KuiklyUI-AI) into .agents/skills/kuikly-reactive-observer in your project. Codex loads it when a task matches its description.
Can I use Kuikly Reactive Observer 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 Tencent-TDS/KuiklyUI-AI --skill kuikly-reactive-observer -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/kuikly-reactive-observer, .gemini/skills/kuikly-reactive-observer, .github/skills/kuikly-reactive-observer and .opencode/skills/kuikly-reactive-observer in your project.
What does Kuikly Reactive Observer need to run?
SKILL.md names no scripts, command-line tools or credentials: Kuikly Reactive Observer is instructions for the agent only.
Does Kuikly Reactive Observer 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 Kuikly Reactive Observer 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 Kuikly Reactive Observer use?
Kuikly Reactive Observer has a licence file (the repository's licence) that doesn't match a standard licence. Read it on GitHub before reusing the skill.
How many tokens does Kuikly Reactive Observer use?
About 901 tokens (SKILL.md is roughly 3.6k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full. Its references folder adds about 2.2k tokens, read only when the agent opens those files.
What are the alternatives to Kuikly Reactive Observer?
Skills that share tags, products or a category with Kuikly Reactive Observer: React Native Best Practices (vercel-labs/openreview, 1.7k stars), Swiftui Pro (twostraws/SwiftUI-Agent-Skill, 5.6k stars), Kortix Brand (kortix-ai/suna, 20k stars) and Ip As Logo (KartikLabhshetwar/better-shot, 2.4k stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.
Who maintains Kuikly Reactive Observer?
Tencent-TDS (a GitHub organization) maintains it in Tencent-TDS/KuiklyUI-AI, which has 130 GitHub stars. The repository holds 13 skills in this directory. The repository was last updated on August 10, 2026.
Source: Tencent-TDS/KuiklyUI-AI on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.