She moves cards to "Done" before anyone's actually checked with the server.
A tiny kanban board built with Rails, Inertia.js, and React to demonstrate optimistic UI patterns. Izzy is the demo app for the blog post Optimistic UI in Rails with optimism... and Inertia.
You know that brief pause after you click something? That moment where your brain goes "did it work?" Izzy eliminates that by lying to you. Convincingly.
Drag a card, and it moves instantly. Submit a todo, and it appears immediately. The server catches up later. If something goes wrong, Inertia quietly fixes things. You never notice the deception.
git clone https://github.com/skryukov/izzy.git
cd izzy
bin/setupTests: 0 passed, 0 total
We're optimistic it works.
The interesting stuff lives here:
app/frontend/pages/todos/index.tsx— The kanban board with optimistic updatesapp/controllers/todos_controller.rb— A controller so simple it barely exists
// 1. Update UI instantly
router.replaceProp("todos", (todos) => [
...todos,
{ text: "New todo", status: "todo", pending: true },
])
// 2. Tell the server (it'll catch up)
router.post(todos_path(), { text: "New todo" })
// 3. Server response replaces props automatically
// If we were wrong, the UI corrects itself. No drama.That's it. That's the whole trick.
MIT