Guest Laura Kalbeg talks about the growth and evolution of the XState project. She also introduces Stately.ai, a SaaS platform for seamless state management solutions compatible with XState, Redux & zustand.
Stately.ai offers a visual interface for building state machines, simulating and visualizing their behavior, and generating code for deployment and multiplayer functionality.
Stately leverages AI Assistance to generate code, actions, and event handlers based on textual descriptions and existing Redux or Zustand stores.
State machines, such as x-state, provide a visual representation of logic that is reproducible and easy to understand, allowing for modularization and integration with non-state machine logic.
Deep dives
State Machines and Stately Overview
State machines and stately provide a powerful solution for state management and orchestration in JavaScript and TypeScript apps. State machines model states, events, and actions using finite state machines and state charts. Stately, as a service, offers a visual interface for building state machines, simulating and visualizing their behavior, and generating code. It simplifies collaboration between designers and developers and provides the ability to export state machines as live actors, which can be deployed and interacted with in real-time. Stately enhances testing through model-based testing, generating test paths based on the state machine models. Deployment and multiplayer functionality are also supported through integration with PartyKit and edge worker deployment using Cloudflare.
AI-Assisted Code Generation
Stately leverages AI Assistance to generate code, actions, and event handlers based on textual descriptions and existing Redux or Zustand stores. This AI-powered feature helps accelerate development and ensure high-quality code generation, especially for developers new to state machines. The strictness and predictability of state machines provide a foundation for AI-guided code generation, enabling non-technical creators to build robust applications with minimal coding knowledge.
Testing and Quality Assurance
State machines and stately support model-based testing, enabling developers to test state machines based on defined paths and expected behavior. Stately Studio allows users to generate test paths and export code for testing frameworks such as Jest and Playwright. By focusing on predictability and control, model-based testing helps ensure the right things are tested and produced, improving the overall quality and robustness of the applications.
Benefits of using state machines
State machines, such as x-state, are effective in solving complex problems by representing relationships between nodes. They provide a visual representation of logic that is reproducible and easy to understand. State machines can be used for both complex and simple cases, allowing for modularization and integration with non-state machine logic.
The actor model and its benefits
The actor model breaks down applications into small modules that communicate by sending events to each other. It enables decoupling of behavior, making it easier to understand and manage state. With the actor model, state machines can be broken into small pieces, optimizing scalability and providing a different perspective on how the system works. The upcoming release of x-state version five will focus on the actor model and provide easier-to-understand terms and concepts.
Amal, Nick & special guest Laura Kalbeg geek out over the remarkable growth and evolution of the XState project and its team in recent years. Laura also tells everyone about Stately.ai, a SaaS platform that uses AI to create seamless state management solutions compatible with various tools like XState, Redux & zustand.
Fastly – Our bandwidth partner. Fastly powers fast, secure, and scalable digital experiences. Move beyond your content delivery network to their powerful edge cloud platform. Learn more at fastly.com
Fly.io – The home of Changelog.com — Deploy your apps and databases close to your users. In minutes you can run your Ruby, Go, Node, Deno, Python, or Elixir app (and databases!) all over the world. No ops required. Learn more at fly.io/changelog and check out the speedrun in their docs.
