skyline-worklet

Execute worklet-based animation logic on the UI thread for interactive effects.

Updated Dec 19, 2025
One-click install
npx skills add https://github.com/yyds-x/walk --skill skyline-worklet-yyds-x
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: skyline-worklet
Source: https://github.com/yyds-x/walk/tree/main/.agents/skills/skyline-worklet
Command: npx skills add https://github.com/yyds-x/walk --skill skyline-worklet-yyds-x

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

The Worklet Animation System enables UI-thread responsive animations by running animation logic directly on the UI thread, eliminating the lag caused by cross-thread communication.

Core Features & Use Cases

  • Worklet functions with the 'worklet' directive run on the UI thread for low-latency interactions.
  • SharedValue and DerivedValue drive node styles and support multi-thread synchronization.
  • Combine animations (timing, spring, decay) and sequences with runOnUI/runOnJS inter-thread calls for gesture-driven UI.
  • Real-world use: smooth drag, gesture follow-through, and spring rebound for tactile feedback.

Quick Start

Bind a SharedValue to an element's transform and trigger a timing animation from the UI thread.

Frequently Asked Questions about skyline-worklet

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
Why does UI animation lag during drag interactions and how do worklets fix it?

UI animation lags due to cross-thread communication delays. Worklets solve this by executing animation logic directly on the UI thread, ensuring low-latency interactions for drag and gesture tracking.

How do I coordinate cross-thread data when running animations on the UI thread?

You coordinate cross-thread interactions using SharedValue and DerivedValue to synchronize data. Use runOnUI to trigger UI-thread execution and runOnJS to call back to the JavaScript thread.

Can I combine spring and timing animations for gesture-driven UI effects?

Yes, you can combine animations like timing, spring, and decay. You create animation sequences and trigger them via runOnUI to execute combined gesture-driven UI effects directly on the UI thread.

Does worklet-based animation work outside of Skyline environments?

Worklet-based animations are specifically applied to interactive UI effects within Skyline environments. The system requires the Skyline environment to execute worklet functions directly on the UI thread.

How do I bind a SharedValue to an element's transform for a UI-thread animation?

You bind a SharedValue directly to an element's transform property and trigger a timing animation from the UI thread. This drives node styles and supports multi-thread synchronization for smooth rendering.

What is the best way to implement smooth spring rebound for tactile feedback?

The best way to achieve smooth spring rebound is using worklet functions to run spring animations on the UI thread. This eliminates cross-thread latency and provides responsive tactile feedback.