创建协作白板绘图应用程序

发布于 2024-09-02 17:57:12 字数 1436 浏览 6 评论 0 原文

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

孤者何惧 2024-09-09 17:57:12

制作任何实时协作工具/游戏都可以归结为在客户端之间有效同步最小共享数据结构上的更改。网络带宽是瓶颈。仅发送同步共享数据绝对需要的信息。通过存储形状而不是单个像素,您走在正确的轨道上。但是,形状不应处理鼠标事件。正如您所指出的,广播鼠标事件将很快使网络带宽饱和!相反,传递鼠标事件如何改变形状的增量。例如,在形状移动后发送最终位置 [x,y],而不是发送 mouse_motion()。

我建议将您的绘图程序分成服务器部分和客户端部分。服务器保留共享数据的权威版本。客户端从不直接操作共享数据结构;它只向服务器发送网络消息。当客户端和服务器位于同一进程/PC 中时,这可能看起来很愚蠢,但有一些充分的理由:

  1. 单用户和多用户共享代码路径
  2. 同一进程中的客户端和服务器之间的网络开销是使用本地套接字时接近于零

此外,编辑不必仅限于该形状的所有者。由于服务器是最终权威,因此当两个人同时抓取相同的形状并将结果发送回客户端时,它会解决任何冲突。 (不过,撤消操作有点棘手。)

虽然集中式服务器最适合网络发现,但客户端可以使用其他方法来查找服务器:

  1. 发送或侦听网络广播数据包
  2. 通过 IP 地址直接连接。 (服务器 IP 地址必须通过其他方式进行通信:聊天、手机、房间另一头的喊叫、信鸽……)

最后,看看其他多用户应用程序是如何设计的。以下是一些示例:

  • Zoidcom 多人游戏编程库 (C++) 。此答案大部分基于 Zoidcom 文档中的信息。甚至还有示例程序演示通过网络广播发现服务器。
  • Wave 背后的运营转型算法,Google 文档。 (有关黑客新闻的文章讨论
  • Etherpad 开源实时协作文本编辑器。
  • 源多人网络 解释如何设计像 HAlf-life 这样的 FPS。了解减少延迟/延迟的技巧。
  • Google Wave(显然文档仍然很差......)

Making any real-time collaborative tool/game boils down to efficiently synchronizing changes on a minimal shared data structure between clients. Network bandwidth is the bottleneck. Send only information absolutely needed to synchronize the shared data. You are on the right track by storing shapes instead of individual pixels. However, the shapes should not handle mouse events. As you noted, broadcasting mouse events will quickly saturate the network bandwidth! Instead, pass deltas of how the shapes are altered by the mouse events. For example, instead of sending mouse_motion() send the final position [x,y] after a shape has been moved.

I suggest splitting your drawing program into a server part and client part. The server keeps the authoritative version of the shared data. A client never manipulates the shared data structure directly; it only sends network messages to the server. This may seem silly when both the client and server are in the same process/PC, but there are some good reasons:

  1. Shared code path for both single-user and multi-user
  2. The network overhead between a client and server in the same process is next to zero when using local sockets

In addition, editing does not have to be limited to the owner of that shape. Since the server is the final authority, it resolves any conflicts when two people grab the same shape simultaneously and send the results back to the clients. (Undo gets a little tricky, though.)

Although a centralized server is best for network discovery, clients can use other methods to find a server:

  1. Send or listen for network broadcast packets.
  2. Connect directly via an IP address. (The server IP address will have to be communicated via other means: chat, cell phone, shouting across the room, carrier pigeon, ...)

Finally, look at how other multi-user applications are designed. Here are some examples:

  • Zoidcom Multi-player game programming libary (C++). Much of this answer is based on information from Zoidcom documentation. There are even sample programs that demonstrate server discovery via network broadcast.
  • Operational Transformation algorithm behind Wave, Google Docs. (article discussion on Hacker News)
  • Etherpad Open-source real-time collaborative text editor.
  • Source Multiplayer Networking Explains how an FPS like HAlf-life is designed. Gets into tricks for reducing lag/latency.
  • Google Wave (Apparently the documentation is stil pretty poor...)
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文