Sign in
Explore
Prompts · RulesWeb & UIReviewed

svelte

Svelte best practices and patterns: component structure for modern web applications.

Kind
Rules
Works with
Cursor
Languages
TypeScript / JavaScript
Source
Awesome Cursor Rules @ b044f956f021
Path
rules/svelte.mdc
License
CC0-1.0
Jobs
Implementation
InstallCopy it from the source repository, or sign in and let the assistant adapt it for your project.
# Svelte Best Practices

## Component Structure
- Keep components small and focused
- Use proper TypeScript integration
- Implement proper props typing
- Use proper event dispatching
- Keep markup clean and readable
- Use proper slot implementation

## Reactivity
- Use proper reactive declarations
- Implement proper stores
- Use proper reactive statements
- Handle derived values properly
- Use proper lifecycle functions
- Implement proper bindings

## State Management
- Use proper Svelte stores
- Keep stores modular
- Use proper derived stores
- Implement proper actions
- Handle async state properly
- Use proper store subscriptions

## Performance
- Use proper component lazy loading
- Implement proper transitions
- Use proper animations
- Avoid unnecessary reactivity
- Use proper event forwarding
- Implement proper key blocks

## Routing
- Use SvelteKit for routing
- Implement proper layouts
- Use proper route parameters
- Handle loading states properly
- Implement proper error pages
- Use proper navigation methods

## Forms
- Use proper form bindings
- Implement proper validation
- Handle form submission properly
- Show proper loading states
- Use proper error handling
…