TachUI Guide
Welcome to the comprehensive TachUI documentation. Learn how to build SwiftUI-style web applications with reactive architecture.
Getting Started
Start here if you're new to TachUI:
- Installation - Set up TachUI in your project
- Getting Started - Basic concepts and first component
- Developer Quick Start - Complete development workflow
- Core Concepts - Understanding TachUI's architecture
Core Features
Master TachUI's fundamental systems:
- DOM Bridge System - 🚀 NEW: Component mounting, rendering, and browser integration
- Complete Components Guide - 📋 NEW: Comprehensive guide to all TachUI components with verified API patterns
- Component Concatenation - 🔗 NEW: SwiftUI-style component composition with automatic optimization
- Events & Signals Development - 🎯 NEW: Practical guide to reactive components, event handling, and state management
- TachUI Components - Complete component reference with TachUI-specific syntax
- Basic Components - Text, Button, Image, and layout fundamentals
- Grid System Overview - 🔲 NEW: Complete Grid documentation with quick start and examples
- Assets System - Theme-adaptive colors, images, and resources
- Font Assets - 🆕 NEW: Comprehensive font loading and management
- Gradients - 🎨 NEW: SwiftUI-style background gradients with theme reactivity
- Reactive System - Signals, computed values, and effects
- State Management - @State, @Binding, @ObservedObject patterns
- Navigation - NavigationView, TabView, and routing
- Viewport Management - 🆕 NEW: Window and scene management with WindowGroup, Window, and App components
- Modifier System - SwiftUI-style component styling
- CSS Framework Integration - 🎨 NEW: Integrate with Tailwind CSS, Bootstrap, and custom design systems
- SwiftUI Migration Guide - ✨ NEW: Complete SwiftUI compatibility functions and migration patterns (96% parity)
- Visual Effects - 🎨 NEW: Backdrop filters, glassmorphism, and modern visual effects with browser fallbacks
- New Modifiers - Latest modifier implementations (resizable, textCase)
Advanced Topics
Take your TachUI skills to the next level:
- Security System - 🔐 NEW: Feature-flagged security with plugin signing, sandboxing, and permissions
- HTML Content Security - 🔒 NEW: Secure HTML rendering with .asHTML() modifier, XSS protection, and sanitization best practices
- Bundle Optimization - 🚀 NEW: Epic Pico bundle optimization for 90%+ size reductions
- Performance & Benchmarks - Optimization techniques and metrics
- Grid Performance Guide - 🔲 NEW: Grid optimization techniques and best practices
- Flexbox to Grid Migration - 🔄 NEW: Systematic migration from flexbox layouts to Grid components
- Concatenation Performance - 🚀 NEW: Performance optimization for component concatenation
- Testing Guide - Component testing with Vitest
- Build Tooling & Setup - Vite integration and configuration
- Project Structure - Organizing TachUI applications
Developer Tools
Tools and utilities for TachUI development:
- Validation System - 🔍 NEW: Comprehensive error detection, IDE integration, and intelligent debugging tools
- Bundle Optimization CLI - 🎯 NEW: Tacho CLI commands for automated bundle optimization
- Tacho CLI - Command-line interface for project management
- AI Integration - AI-powered development features
- Migration Tools - Moving from other frameworks
System Internals
Understanding how TachUI works under the hood:
- Modifier Pipeline Internals - 🔧 NEW: Deep dive into modifier application, rendering workflow, and debugging
- Compiler - SwiftUI syntax transformation
- Runtime - Component lifecycle and rendering
- DOM Bridge System - Component mounting and browser integration
- Cleanup & Memory - Memory management and disposal
Examples
See TachUI in action with practical examples:
- Examples Overview - All available examples and demos
- Counter App - Interactive state management
- Todo List - Complex CRUD application
- Component Showcase - All components in action
API Reference
Complete API documentation:
- API Overview - All APIs and type definitions
- createSignal - Reactive signal creation
- createComputed - Computed values
- createEffect - Side effects and reactions
Community
- GitHub Repository - Source code and issues
- GitHub Issues - How to contribute
- Examples Collection - Community examples and patterns