How Figma’s multiplayer technology works (2019)

(figma.com)

87 points | by redbell 3 days ago

13 comments

  • seereadhack 1 hour ago
    Linear's write ups / talks on real-time sync are also very good, if a bit old now.

    1. https://www.youtube.com/watch?v=WxK11RsLqp4&t=2169s

    2. https://linear.app/now/scaling-the-linear-sync-engine

    Also see this overview of related tech here:

    3. https://gist.github.com/pesterhazy/3e039677f2e314cb77ffe3497...

    And c.f. automerge from ink & switch:

    4.https://automerge.org/blog/

  • thruflo 1 hour ago
    Just to say if you're interested in this kind of tech and are in the Bay Area, Sync Conf [0] just announced [1] its initial speaker lineup today and Arushi Bandi from Figma is one of the speakers.

    [0]: https://syncconf.dev [1]: https://x.com/sync_conf/status/1957818840777122293

  • freeqaz 4 hours ago
    This is still a hard problem today. Some hard tech was built for this. I'm excited for a world where this is more accessible and less hardcore than something like CRDTs (in terms of accessibility).

    How have others noticed the world shifting in the past 6 years?

    • danielvaughn 2 hours ago
      There are now a few sync engines that tackle this problem. Rocicorp Zero, Electric SQL, and one or two others. By no means a crowded space, but there are options now.

      edit: links

        https://zero.rocicorp.dev/
        https://electric-sql.com/
    • winrid 1 hour ago
      Sharedb/racer solved this like 10yrs ago. You get synchronized snapshots, conflict resolition, diffs, change tracking..
    • asnyder 2 hours ago
      I know Liveblocks.io has been making this very easy and accessible over the last few years. They recently introduced AI, and are promoting that of course, but as I understand it multiplayer collaboration (https://liveblocks.io/multiplayer-editing) is their meat and potatoes.

      Not affiliated with Liveblocks, just aware of its existence.

    • simultsop 3 hours ago
      There were some additional posts regarding the topic by same guy. https://hachyderm.io/@evanw

      Innovators like him, are very rare.

    • wrren 2 hours ago
      Elixir's Phoenix LiveView + PubSub covers a lot of these bases out of the box.
    • andrewmcwatters 2 hours ago
      All the fundamentals have existed for at least 26 years. So, no, not really.

      It's also really weird to use video game terminology and ignore the fact that all of the approaches used in this article have in fact, been done by major game engines, are readily documented in game development circles, etc.

      It reads like an undergrad discovering game development for the first time. None of this is novel. It wasn't even novel for a web or desktop application to use.

      • partdavid 2 minutes ago
        Can you say more about which prior art you think overlaps here? We have a similar use case to Figma and are implementing a similar solution. I'm not particularly concerned whether the path we're following is novel but I am particularly concerned with whether there are gotchas along it that we should be watching out for, so if there are more mature solutions, we'd be interested.
  • dang 3 hours ago
    Discussed at the time:

    How Figma's Multiplayer Technology Works - https://news.ycombinator.com/item?id=21378858 - Oct 2019 (63 comments)

  • bullen 3 hours ago
    I think player is a misnomer here. Multiuser editing would be better.

    Also websockets are complicated. So are WebRTC or HTTP/2+ solutions.

    HTTP/1.1 Comet-Stream is still the silver bullet even when ISPs try to block them, it's the protocol that goes through best (99.6% in 2022)

    I'm considering doing a multi-socket solution: 80 (HTTP Comet-Stream) and 3724 (Binary TCP because WoW).

    https://multiplayeronlinestandard.com

    • bobbylarrybobby 3 hours ago
      They've likened their product to a game engine, so multiplayer seems appropriate.
      • bullen 3 hours ago
        Maybe if you can se other users actions in real-time? I'm not a visual guy so it was a long time since I tried Figma.
        • bruckie 3 hours ago
          You can! It even shows everyone's cursors moving around.
          • bullen 3 hours ago
            That's cool!
  • bogwog 4 hours ago
    Interesting article, but why does it randomly switch from dark to light mode once you scroll past a certain point?
    • tobyjsullivan 3 hours ago
      It changes when I scroll to the animations.

      My guess is they implemented dark mode, then discovered some legacy posts have videos with transparent backgrounds. As a quick fix, they decided to disable dark mode anytime someone scrolls down to a video.

      Seems like one of those compromises to solve an 11th-hour bug.

    • 654wak654 1 hour ago
      The videos have white backgrounds, maybe it's to match that and keep the page cleaner.
    • rudi-c 4 hours ago
      The contents of this article are pretty old, but the static website's design has been revamped (I believe several times) since then. My guess it that the two may have just fallen out of sync in such a way that this particular oddity manifests.
    • krisknez 4 hours ago
      Because it's cool
    • koakuma-chan 4 hours ago
      What is the meaning of life?
      • simultsop 3 hours ago
        the guy behind a kabuki mask, stole my microbots
    • Traubenfuchs 3 hours ago
      ...and why does the switch point have a small hysteresis?
  • dostick 3 hours ago
    Figma was born out of founder’s need to find a proof of concept test case for real-time collaboration JavaScript engine they created. They stumbled on this idea. Back then everyone used Sketch and wanted better prototyping and interaction design, and Figma appeared with its real time collaboration as major point which you used once just to try and never again.

    Figma is one of the worst evils of corporate capitalism. The design oriented development is long ceases, mainly focusing on making new useless products because they need growth for shareholders. Considered a leader in UIUX design software while its own UIUX is abysmal, full of amateur level mistakes, inconsistencies and bad patterns. We have now a generation of designers that take Figma’s UX as an example to learn from and implement in their designs.

    • aswan 2 hours ago
      > Figma was born out of founder’s need to find a proof of concept test case for real-time collaboration JavaScript engine they created. They stumbled on this idea.

      citation needed?

      The article discusses adding collaboration to an existing application, the opposite of what this comment asserts.

  • guluarte 4 hours ago
    Why is their CTO suspended on Twitter https://x.com/evanwallace ?
    • echelon 4 hours ago
      What happened? Is there a story behind this?
      • meowtimemania 3 hours ago
        IIRC there was a period of time where you could get suspended for trivial things like mentioning twitter
    • wetpaws 4 hours ago
      [dead]
  • hola404 4 hours ago
    [dead]
  • 1zael 4 hours ago
    Evan Wallace basically said screw it, I'm writing a custom WebGL renderer and multiplayer protocol, when everyone else was slapping together existing libraries. Most of us would have built a janky Electron app and called it a day. Instead they went nuclear on performance because that WAS their product differentiation.
    • eddythompson80 3 hours ago
      Curious why you copy/paste your previous comments verbatim[1]. I was reading it and could have sworn I have read that exact comment before and was thinking it's dejavu.

      [1] https://news.ycombinator.com/item?id=44438131

      • dsnr 3 hours ago
        Haha, I had the exact same feeling, like I had read the same comment before. Glad to know I’m not losing my mind :)
      • simultsop 3 hours ago
        maybe an automated bot
        • wk_end 1 hour ago
          Not sure, their comment history doesn't look like it. If I had to guess, they got a fair amount of karma from the old comment and thought they could get away with reusing it and harvesting some more.