use-activity-component-for-show-hide
CommunityPreserve component state on toggle.
Authorihj04982
Version1.0.0
Installs0
System Documentation
What problem does it solve?
This Skill addresses the issue of expensive components losing their state or DOM when frequently toggled on and off, leading to performance degradation and a poor user experience.
Core Features & Use Cases
- State Preservation: Ensures that components maintain their internal state and DOM structure even when hidden.
- Performance Optimization: Prevents costly re-renders for components that are shown and hidden repeatedly.
- Use Case: In a dashboard application, a complex chart component that is only visible when a specific tab is active can use this pattern to avoid re-initializing and re-fetching data every time the tab is switched.
Quick Start
Use the Activity component to render an expensive component only when it is visible.
Dependency Matrix
Required Modules
None requiredComponents
Standard package💻 Claude Code Installation
Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.
Please help me install this Skill: Name: use-activity-component-for-show-hide Download link: https://github.com/ihj04982/my-cursor-settings/archive/main.zip#use-activity-component-for-show-hide Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
Agent Skills Search Helper
Install a tiny helper to your Agent, search and equip skill from 471,000+ vetted skills library on demand.