Real-time multiplayer editing in Figma - Practice Problems & Coding Challenges

Challenge - 5 Problems

🧠 Conceptual

intermediate

Understanding Real-time Multiplayer Editing Basics

In a real-time multiplayer editing environment like Figma, what is the primary method used to ensure all users see the latest changes instantly?

A Using WebSocket connections to push updates instantly

B Polling the server every few seconds to fetch updates

C Saving changes locally and syncing only on file close

D Sending email notifications for every change made

💡 Hint

Think about how instant communication happens in chat apps.

WebSocket connections allow the server to push updates instantly to all connected users, enabling real-time collaboration without delay.

❓ data_modeling

intermediate

Data Model for Conflict Resolution

Which data model approach best supports conflict resolution in real-time multiplayer editing?

A Manual merge by users after editing

B Ignoring conflicts and overwriting blindly

C Last write wins (LWW) with timestamps

D Saving only the first user's changes

💡 Hint

Consider how automatic conflict resolution can be done without user intervention.

Last write wins uses timestamps to decide which change is the most recent, automatically resolving conflicts in real-time editing.

❓ dax_lod_result

advanced

DAX Measure for Active Editors Count

Given a table Editors with columns UserID, LastActiveTime, and DocumentID, which DAX measure correctly counts the number of unique active editors on a document in the last 5 minutes?

A ActiveEditors = CALCULATE(DISTINCTCOUNT(Editors[UserID]), FILTER(Editors, Editors[LastActiveTime] >= NOW() - TIME(0,5,0)))

B ActiveEditors = DISTINCTCOUNT(FILTER(Editors, Editors[LastActiveTime] >= NOW() - TIME(0,5,0))[UserID])

C ActiveEditors = COUNTROWS(FILTER(Editors, Editors[LastActiveTime] >= NOW() - TIME(0,5,0)))

D ActiveEditors = CALCULATE(COUNT(Editors[UserID]), FILTER(Editors, Editors[LastActiveTime] <= NOW() + TIME(0,5,0)))

💡 Hint

Use CALCULATE with DISTINCTCOUNT and a FILTER on recent activity.

Option A correctly filters editors active in the last 5 minutes and counts unique UserIDs.

❓ visualization

advanced

Best Visualization for Real-time User Activity

Which visualization best shows the number of active users editing a document over the last hour, updating every minute?

A A stacked bar chart showing total edits per user

B A pie chart showing percentage of users per document

C A scatter plot showing user locations

D A line chart showing active user count on the Y-axis and time on the X-axis

💡 Hint

Think about how to show changes over time clearly.

A line chart is ideal for showing trends over time, such as active user counts updating every minute.

🔧 Formula Fix

expert

Debugging Real-time Sync Issue

In a real-time editing system, users report that sometimes their changes do not appear for others immediately. The code snippet below handles update broadcasting:

function broadcastUpdate(update) {
  clients.forEach(client => {
    client.send(JSON.stringify(update));
  });
}

What is the most likely cause of the delay?

A The <code>forEach</code> loop sends updates in parallel causing race conditions

B The <code>clients</code> list is not updated when users disconnect, causing some sends to fail silently

C The <code>send</code> method buffers messages and sends only every 10 seconds

D The <code>JSON.stringify</code> call is asynchronous and delays sending

💡 Hint

Consider what happens if a client is no longer connected but still in the list.

If the clients list includes disconnected users, sending messages to them may fail silently, causing delays or missed updates for active users.