Building Local-First Apps with Sync Engine Architecture: Beyond Data Fetching

The Evolution from Fetching to Sync

Traditional web development relies heavily on imperative data fetching, where applications manually request data from servers. This approach introduces significant latency due to network round trips, leading to loading spinners and a suboptimal user experience. The presentation argues that the next major improvement in application speed and responsiveness comes from extending client-side reactivity all the way to the server, effectively abstracting away the network with a "sync engine" architecture.

In a sync-based model, local writes on the client are instantly applied as optimistic state, allowing the UI to re-render immediately. These changes then synchronize with the server in the background. Conversely, any relevant changes originating from the server (either from the same user or other collaborators/agents) are pushed back to the client, updating the local store and view. This creates an end-to-end reactive data flow.

Architectural Benefits of Sync Engines

• Instant User Experience: Data is available locally, eliminating loading states and providing immediate feedback.
• Offline and Patchy Connectivity Support: Applications function seamlessly even without a persistent network connection.
• Natural Real-time Collaboration: Changes from any connected client or server-side agent are automatically propagated, simplifying collaborative features.
• Simplified Development: Declarative data bindings replace imperative data fetching, allowing the system to handle data transfer, placement, and consistency concerns across the network.
• Scalability for Agentic Systems: Essential for modern agent-driven applications where multiple agents and users constantly generate and consume data, requiring a reactive data plane to keep everyone in sync.

HTTP Request vs. WebSocket Considerations

While WebSockets enable real-time communication, their operational complexity often makes teams hesitant to adopt them for mission-critical applications. HTTP requests are stateless, easier to instrument, debug, and scale horizontally. WebSockets, conversely, introduce state management challenges on the server, impacting memory consumption and debugging in scaled environments. Building a robust sync engine on WebSockets often requires significant engineering investment, historically undertaken by companies with dedicated, highly skilled teams (e.g., Figma, Linear, Notion).