skills.rest
programadorisgod
programadorisgodCOMMUNITY
Explore all skills by this author →
GitHub

svelte-frontend

Codify Svelte 5 frontend development best practices for Windmill components.

1|Updated Feb 26, 2026
Search Tags:#performance#frontend#components#svelte#guidelines#reactivity#windmill
One-click install
npx skills add https://github.com/programadorisgod/builder-projects --skill svelte-frontend-programadorisgod
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: svelte-frontend
Source: https://github.com/programadorisgod/builder-projects/tree/main/bin/assets/.agents/skills/svelte-frontend
Command: npx skills add https://github.com/programadorisgod/builder-projects --skill svelte-frontend-programadorisgod

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Svelte coding guidelines for the Windmill frontend ensure consistent, maintainable, and high-performance UI development across the project, reducing bugs and onboarding time.

Core Features & Use Cases

  • Reactivity rules with Runes: prescribe using $state, $derived, and $effect for predictable reactivity.
  • Component design and props: guidance on $props, $bindable, and data flow between components.
  • Performance & organization: best practices for lazy loading, minimal DOM work, and structured stores.

Quick Start

Apply these guidelines to any Svelte frontend edits in the Windmill project to ensure consistency and performance.

Frequently Asked Questions about svelte-frontend

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

FAQPage Schema
How do I use Svelte 5 Runes like $state and $derived for predictable frontend reactivity?▼

Svelte 5 Runes like $state and $derived prescribe predictable reactivity by explicitly declaring reactive state and derived values. Using $effect handles side effects, ensuring maintainable and bug-free component data flow in your UI workflows.

What's the best way to organize Svelte components and props in a Windmill frontend project?▼

Organize Svelte components by applying clear guidelines for $props, $bindable, and structured stores. This enforces consistent data flow between components and structured code organization across the Windmill project, reducing onboarding time.

Can I use these Svelte coding guidelines for frontend projects outside of Windmill?▼

These Svelte coding guidelines are tailored for Windmill frontend components, stores, and UI workflows. While the core Svelte 5 best practices for Runes and performance apply broadly, their specific application targets Windmill project consistency.

Why does my Svelte 5 component have unpredictable reactivity issues without using Runes?▼

Unpredictable reactivity in Svelte 5 often occurs without Runes because $state, $derived, and $effect establish explicit rules for state management and side effects. Adopting these patterns ensures predictable data flow and reduces bugs.

Related Skills

Explore More Software Engineering Skills→
aurumorincaurumorinc

raw-app

Create custom React, Svelte, or Vue frontends for Windmill backend runnables and datatables.

Official
Intermediate
Prathmesh2000Prathmesh2000
1

mui-components

Build Material UI v6 components with centralized theming and design tokens.

Community
Advanced
ksciuskscius
2

converting-css-to-tailwind

Convert CSS stylesheets into Tailwind CSS utility classes for HTML, JSX/TSX, Vue, and Svelte projects.

Community
Intermediate
vincehvinceh
1

vue-engineering

Guide Vue 3 component creation with Composition API and script setup.

Community
Advanced