Figma Is a File Editor
digest.browsertech.com
digest.browsertech.com
This is the killer app for CloudFlare's new Durable Objects. They solve the routing and data distribution layer, allowing you to write single-threaded business logic to coordinate changes.
They even have a transactional storage capability which is priced more or less equivalent to DynamoDB (which Figma uses for their write-ahead log).
This pattern also helps scale write transactions without melting your database. http://ithare.com/scaling-stateful-objects/
I try to boost Durable Objects every chance I get, in order to "push the battleship" in the direction of another cloud provider implementing something equivalent.
While this article is written by the plane.dev team, which has an adjacent product, their approach seems more geared towards more demanding backends. Lots of use cases don't need to run e.g. a game or simulation on the backend, they just need a synchronization layer in front of a document store.
---
> They could stuff the whole document into a binary blob or json(b) column next to the metadata.
In my experience doing this in MySQL... do not do this. Once you have a dozens-if-not-hundreds-of-gigabytes large table full of JSON, it becomes a real nuisance. As a halfway measure, I think it would help to have a "blobs only" table separate to the metadata table. But as the OP points out, it is not economical anyway.
One of the best things is that the Durable Object will automatically run in the closest Cloudflare data center to the first user who connects, which helps keep latency very low.
The alarms feature they added last year has also been great at allowing us to asynchronously snapshot the state of a board certain intervals, rather than us needing to schedule the job from an external system.
[0] https://twitter.com/KentonVarda/status/1659551757796515846
(I'm tech lead for Workers and have been focused on this storage engine in particular.)
I really hope this becomes higher, the less latency the more compelling Durable Objects become for real-time applications.
I do see Plane as being relevant to pure sync layers, for cases where you want to run on your own cloud/own metal, or can’t compile your code to run on V8, but it’s good to have options.
Thanks for the kind words! Durable Objects also underpins a tremendous amount of what we build internally as well — it’s fundamentally a very powerful “coordination API”.
FYI: We’re continuing to work on observability & throughput improvements so folks can get more of each DO, on top of the horizontal sharding (“a DO per X”) approach we recommend.
Any alternatives?
The question then becomes:
- Do you want a complicated data model based on CRDT's that will allow for arbitrary node distribution and failures (That you kinda need to handle anyhow)
- Do you select a "simpler" datamodel where you have single master servers (per-document) but spend a tad more effort on resolving node crashes (and are hopefully infrequent?)
Theoretically CRDT's are prettier, and infra is always scary. But otoh do you want to spend a lot of time on modelling complicated data-models for features that might not even make sense in the long run? (Ie, do you 100% know your product before starting.. or will you need to iterate and update it).
CRDT (or similar solutions like OT) is important if you ever want decent offline support and true real-time collaboration. Even a user with a spotty connection is essentially "occasionally offline". Having a single coordinator "in the Cloud" doesn't really solve the concurrency issues.
However you also want a single coordinator. It will give you the best performance. If you want to have people in a call to be able to move their cursors around and see each other within a second it will be very hard to do with sending everything through a database and polling or similar. But this can fundamentally be seen as an optimization. The client could just push writes and pull new changes to the database every couple of seconds. But this is both less efficient (the client needs to retain more history and do more complex merges) and higher latency.
CRDTs are an obvious way to do this. Or maybe something like CouchDB's document model?
A good example of this architecture would be using FoundationDB [1] with Permazen [2]. In this design there are three layers:
1. A horizontally scaling sorted transactional K/V store. This is provided by FoundationDB. Transactions are automatically ordered within the cluster.
2. A network protocol that can serialize database transactions. Permazen has the ability to do this, you can do things like cache reads, HTTP POST transactions and so on. Stuff you can't easily do with SQL databases.
3. A way to map in-memory objects to/from key/value pairs, with schema migration, indexing and other DB-like features. Permazen also does this.
Permazen can be thought of as an ORM for KV stores. It's a library intended to execute on trusted servers (because the KV store can't do any business logic validation). However, for something like Figma where it's basically trusting the client anyway that doesn't matter. Additionally you can do some tricks with the architecture to support untrusted clients; I've explored these topics with Archie (the Permazen designer) in the past.
The nice thing about this design is that it doesn't require sharding by "file", can scale to large numbers of simultaneous co-authors, and results in a very natural coding model. However, Permazen is a Java library. To use it from a browser would be awkward. That said it has fairly minimal reliance on the JDK. You could probably auto-convert it to Kotlin and then use Kotlin/JS or Kotlin/WASM. But frankly it'd be easier to do that architecture as a real desktop app where you aren't boxed in by the browser's limitations. And of course the design ideas can be implemented in any language, it's just a lot of work.
The writeup mentions a couple of reasons for not using a database:
1. Relational/object mismatch. Permazen+FDB solves this.
2. Cost of a database vs S3. This is mostly an artifact of cloud pricing. Cloud is highly profitable but most of the margin comes from managed databases and other very high level services, not commodity byte storage. Given that FDB is free you could eliminate the cost gap by just running the database yourself, and especially, running it on your own metal.
Because Permazen has a pluggable KV backend and because there are backends that write to files, you can have both worlds - a scalable DB in the cloud and also write to files for individual cases where people don't want to store data on your backend.
I would say that no more than 10% of the time I spend on Figma is for collaborating with other people in short brainstorming sessions, team workshops, etc. The other 90% is spent by myself working and polishing said prototypes, but still having to deal with the loading times, server hiccups, and so on.
An "offline mode" of sorts would also be a silly feature to expect since their entire stack is built around collaboration. Seems like a difficult balance.
Disclosure: I used to work on some of this when I was at Figma.
With the Adobe purchase, I'm confident that'll change though!
I do think you have to be fully in on either one or the other. But collaborative tools are more difficult to do as transactional; that works with version control, but then it's up to the user to deal with conflicts. With reactive applications you have to deal with asynchronous whatnots and eventual consistency, although there's plenty of algorithms and technologies out there to handle that.
Think of it like Excel and Google Sheets. Excel was designed for offline first, but Google Sheets always had online editing as a first-class citizen. Excel today has actually surprisingly great collaboration features, but it's sometimes buggy, and things don't always work the way you might expect. By contrast, Google Sheets is designed from the ground up to be online, and while you can save a file for offline editing, it doesn't actually put anything useful on your disk. Even if you have Google Drive, you just get a .gsheets file that is essentially a link the the document.
I guess where I'm going is, you just have to choose your battles. Be good at one thing, rather than mediocre at both.
It may take extra development time though. The trade off of development time is real.
You may argue and say why compare with Adobe? You would be right in that case, but it has been the gold standard in design for many years and set expectations on how design applications behave.
One of my formative early tech jobs was implementing a realtime whiteboard on top of WebRTC and CRDTs ca. 2015. It was incredible how easy it was to build new functionality, once the infrastructure was in place to "just replicate the scene at all times".
A: Marketing.
---
The essential distinction is the granularity of reads/writes
[1] https://docs.oracle.com/en/database/oracle/oracle-database/1...
The file <-> database contrast feels rather moot, because it's natural to have metadata in usual DBMS and blobs in object/file storage (or in blob column).
A nice demo of this for sqlite is here - https://phiresky.github.io/blog/2021/hosting-sqlite-database...
After all, Figma is an excellent product except the loading time on existing documents 5mb or more, design files, take time to open up reminding me Photoshop 7.0 days.
> Wondering if info like saving buffer changes to DynamoDB are published by Figma on a blog or you just inspected this behavior in browser, the same for S3 and postgress?
Most of it came from their blog posts (I link to some of their classic technical posts, but I also skimmed all of their eng posts looking for tidbits to fill in the gaps). I have talked with some Figma engineers over the time building Plane.dev to check my understanding, and I did a bit of network sniffing to verify that e.g. the Fig file data is sent over websocket.
But this creates at least two problems right off the top of my head:
1. When I first got OT working at a coffee shop in SOMA I said “hell yeah” so loud everyone looked at me. It’s magical stuff and it’s way more fun to be an active part of others finding all this amazing shit we’ve inherited.
2. There are probably a zillion refinements since I last did any of that stuff and by glossing over it with a mental yawn, I’m probably actually falling behind the cutting edge in ways I definitionally don’t see.
Im going to try to pay more attention to the details of stuff I think I already know.
Did you read the article?
> Please don't comment on whether someone read an article. "Did you even read the article? It mentions that" can be shortened to "The article mentions that".
Though I would feel a lot worse if I started commenting on the rules without having read them.
this is about a distinction between entries in a database (files) and the database itself (the filesystem is a DB).
but what's wrong with expecting people to know a little? would you argue that if the user sees the whole URL in the browser that the abstractions are leaking?
The issue here is that you're training users to rely on internal details.
Once users have to rely on internal details, you are stuck with maintaining these forever or face a constant stream of backlash.