React Helsinki February 2020
Fraktio2 HN recommenders · 2021–2025
42K views · talk · dated · Uploaded 2020-02-05
React Helsinki meetup recording featuring a talk on lessons with Apollo GraphQL and Linear co-founder Tuomas Artman on real-time sync for web apps. The sync talk explains Linear's local-first architecture.
Cited as the explanation of how Linear's fast, locally synced UI works.
38:47RailsConf 2014 - All the Little Things by Sandi Metz
Confreaks
42:03The Soul of Erlang and Elixir • Sasa Juric • GOTO 2019
GOTO Conferences
1:01:39"Simple Made Easy" - Rich Hickey (2011)
Strange Loop Conference
26:53What the heck is the event loop anyway? | Philip Roberts | JSConf EU
JSConf
36:45Rich Harris - Rethinking reactivity
You Gotta Love Frontend
25:06"Making Impossible States Impossible" by Richard Feldman
elm-conf
40:20"Testing Distributed Systems w/ Deterministic Simulation" by Will Wilson
Strange Loop Conference
1:00:19How To Design A Good API and Why it Matters
Google TechTalks
5 comments from Hacker News
I mostly agree, but having used Linear.app which has a crazy good and fast UI based on a local database synced with their cloud database, I'm not sure anymore: [VIDEO] . I think it's important to define early in a project if the app is "cloud-based" or "local-based". If it's cloud-based, then only the server mutates state and sends views to the clients, as you wrote. Everything is simple. If it's local-based, then all data are available locally and mutated locally. The cloud is only used as mirror/backup and can support for some advanced features like full-text search. That's also a very clear architecture. That's how Linear works. Things become hairy and unnecessarily complex when no clear choice is made between those two options, then it's not clear where the state is.
Replicache ( [LINK] ) and clientdb ( [LINK] ) are the only productized versions of this architecture I'm aware of (please do let me know if anyone is aware of others!). But the architecture itself has been used successfully in a bunch of apps, most notable of which is probably Linear ( [LINK] , I remember watching an early video of their founder explaining the architecture in more detail but I can't seem to find it anymore (edit: found it! [VIDEO] )). Basically the way authorization works is you define specific mutations that are supported (no arbitrary writes to client state, so write semantics are constrained for ease of authorization and conflict handling), with a client-side and server-side implementation for each mutation. The client side gets applied optimistically and then sync'ed and ran on the server eventually, which applies authorization rules and detects and handles conflicts, which can result in client state getting rolled back if authorization rules are violated or if unresolvable conflicts are present. Replicache has a good writeup here: [LINK]
(Cofounder here) The app is fullstack typescript react application with custom realtime sync engine for instant updates and offline readiness. Our cofounder did a talk about our sync few years back: [VIDEO] The app works both in the browser and we also distribute it with Electron wrapper for macOS and Windows, but it's essentially the same experience.
We created Linear[1] as local-first product. Back in to 2019 there wasn't much anything available so we created our sync engine. Today we have several thousands companies, from early stage to public companies as paying customers (companies such as Vercel, Replit, Substack, Square..) Our co-founder did talk about sync engine back in 2020 and recently did updated talk about scaling it [3]. The scaling has definitely taken lot of work and optimizing as datasets for company wide workspace with potentially thousands of users ands object they created can become quite large. 1: [LINK] 2: [VIDEO] 3: [LINK]
Linear's write ups / talks on real-time sync are also very good, if a bit old now. 1. [VIDEO] 2. [LINK] Also see this overview of related tech here: 3. [LINK] And c.f. automerge from ink & switch: 4. [LINK]