Enforce ReactLynx best practices in React projects with dual-thread architecture: reference rules while writing code, run static analysis during reviews, and apply auto-fixes for refactoring.
A collection of Agent skills for Lynx.
ReactLynx best practices covering patterns writing dual-threaded React code with ReactLynx. Provides rules reference for writing, static analysis for reviewing, and auto-fix for refactoring.
Use when:
Rules covered:
| Rule | Impact | Description |
|---|---|---|
detect-background-only | Critical | Native APIs in background contexts |
proper-event-handlers | Medium | Correct event handler usage |
main-thread-scripts-guide | Medium | Main thread scripts guide |
hoist-static-jsx | Low | Performance optimization |
Remap Lynx main-thread runtime error positions to original source code locations using debug info.
Use when:
function_id:pc_index formatAnalyze Lynx performance traces (.ptrace files) to identify bottlenecks in rendering pipelines.
Use when:
Interact with Lynx DevTool to inspect and debug Lynx applications via the CLI. Supports sending CDP commands, App commands, opening URLs, reading console logs, listing sources, and taking screenshots on connected devices.
Use when:
npx skills add lynx-community/skills
[!IMPORTANT] Pull requests must target the
mainbranch, not thereleasebranch.
See CONTRIBUTING.md for development setup, project structure, and guidelines on creating new skills and plugins.
Thanks to:
Own this plugin?
Verify ownership to unlock analytics, metadata editing, and a verified badge. GitHub access is read-only (username + org membership).
Sign in to claimOwn this plugin?
Verify ownership to unlock analytics, metadata editing, and a verified badge. GitHub access is read-only (username + org membership).
Sign in to claimBased on adoption, maintenance, documentation, and repository signals. Not a security audit or endorsement.
npx claudepluginhub lynx-community/skills --plugin reactlynxDebug Agent For Lynx
Debug Agent For Lynx
Use this agent when you need expert assistance with React Native development tasks including code analysis, component creation, debugging, performance optimization, or architectural decisions. Examples: <example>Context: User is working on a React Native app and needs help with a navigation issue. user: 'My stack navigator isn't working properly when I try to navigate between screens' assistant: 'Let me use the react-native-dev agent to analyze your navigation setup and provide a solution' <commentary>Since this is a React Native specific issue, use the react-native-dev agent to provide expert guidance on navigation problems.</commentary></example> <example>Context: User wants to create a new component that follows the existing app structure. user: 'I need to create a custom button component that matches our app's design system' assistant: 'I'll use the react-native-dev agent to create a button component that aligns with your existing codebase structure and design patterns' <commentary>The user needs React Native component development that should follow existing patterns, so use the react-native-dev agent.</commentary></example>
Advanced React skills for hooks, context, and performance optimization.
React, Next.js, and React Native best practices with web design guidelines.
React and Next.js performance optimization guidelines from Vercel Engineering. Use when writing/reviewing/refactoring React code for optimal performance. Covers async patterns, bundle optimization, server/client components, re-render optimization.
Use this agent when you need expert assistance with React Native development tasks including code analysis, component creation, debugging, performance optimization, or architectural decisions. Examples: <example>Context: User is working on a React Native app and needs help with a navigation issue. user: 'My stack navigator isn't working properly when I try to navigate between screens' assistant: 'Let me use the react-native-dev agent to analyze your navigation setup and provide a solution' <commentary>Since this is a React Native specific issue, use the react-native-dev agent to provide expert guidance on navigation problems.</commentary></example> <example>Context: User wants to create a new component that follows the existing app structure. user: 'I need to create a custom button component that matches our app's design system' assistant: 'I'll use the react-native-dev agent to create a button component that aligns with your existing codebase structure and design patterns' <commentary>The user needs React Native component development that should follow existing patterns, so use the react-native-dev agent.</commentary></example>