Alpine.js List Rendering: Why Keyed Templates Matter for State Persistence
Alpine.js renders lists with x-for on <template> tags. Using a stable :key preserves DOM node identity—focus, transitions, input values—when arrays reorder. A worked example shows why index keys break and how to choose Alpine over a SPA for server-rendered pages with interactive pockets.
alpinejs