Features
Everything you need to build modern, reactive web applications in Vala
🧩 Component-Based Architecture
Build your UI with reusable, composable components that encapsulate state and behavior.
Encapsulated State
Each component manages its own state, making your code predictable and testable.
Outlets & Children
Use outlets to compose components together, creating complex UIs from simple parts.
Lifecycle Hooks
prepare() and handle_action() hooks give you control over component behavior.
⚡ HTMX Integration
Add dynamic behavior without writing JavaScript. Spry makes HTMX even more powerful.
<!-- Declarative actions -->
<button spry-action=":Toggle"
spry-target="item"
hx-swap="outerHTML">
Toggle Item
</button>
<!-- Cross-component communication -->
<form spry-action="ListComponent:Add"
hx-target="#my-list">
<input name="title" />
<button type="submit">Add</button>
</form>
<!-- Out-of-band updates -->
<div spry-global="header">
Updates automatically when data changes
</div>
spry-action
Declare component actions directly in your markup. No event listeners needed.
spry-target
Target elements within your component using simple sid references.
spry-global
Update multiple page regions with out-of-band HTMX swaps.
💉 Dependency Injection
Powered by Inversion, get clean, testable code with automatic dependency resolution.
class TodoComponent : Component {
// Inject dependencies in field initializers
private TodoStore store = inject<TodoStore>();
private ComponentFactory factory = inject<ComponentFactory>();
private HttpContext http = inject<HttpContext>();
}
// Register services with different lifecycles
application.add_singleton<AppState>(); // One instance forever
application.add_scoped<ComponentFactory>(); // One per request
application.add_transient<MyComponent>(); // New each time
📄 Page Templates
Create reusable layouts with nested templates that automatically wrap your pages.
Nested Layouts
Stack templates to create complex layouts from simple, reusable pieces.
Route-Based
Templates are applied based on route prefixes, automatically wrapping matching pages.
Template Outlets
Use
🚀 High Performance
Built on Astralis for native code performance with web framework convenience.