问数据结构，javascript中的两个线程在同一个对象上读写

EN

语言是javascript，但我认为这个问题与语言无关。以下是问题所在：

问题

两个侍者在服务桌子。一个在打扫，一个在放新盘子。勤杂工必须确保他没有把盘子放好。有一项要求，即服务生和服务生在小单位的工作中执行他们的任务，为了使顾客看到他们的食物被迅速地提供给顾客，服务器必须与服务生同时工作。这是一个低端的自助餐，所以吃完/拿走的菜可以再来一次(还有更多的煎饼吗？)

步骤：

1. 服务员来了，从桌上的15道菜中拿出5道菜，带到厨房。
2. 服务生在他的订单上列出了35道菜中的5道菜。两道菜(薄煎饼和蓝莓)和刚被拿走的一样，其余的都是新的。
3. 这种情况一直持续到服务生和服务器都完成为止。三个围棋有15个盘子，服务生有35个盘子要带7个围棋。
4. 桌子上剩下的东西，然后是35盘。

Restrictions:

• 服务器必须以最接近客户的方向工作。
• 半身像男孩必须确保他不会带走那两盘新鲜的薄煎饼和蓝莓，如果他在服务器放下新鲜的薄饼和蓝莓之后把它们清理干净的话--就在旧的上面。

在javascript中，我有一个setInterval(半身，50)函数来清理UI，还有一个setInterval(serve，50)，它为UI添加了新的元素。两个模拟线程同时工作，因为以串行顺序清理可能需要10秒，而服务可能还需要20秒。相反，我要表明正在取得进展-特别是在可见区域。上面提到的板块实际上是html id的，DOM正在被操纵。我保持一个数组/哈希表的项目，我正在操作。

我的算法是什么？

编辑:我记得在图形中，您通常会绘制到隐藏缓冲区，然后切换带有隐藏缓冲区的可见缓冲区。我不知道如何把这个概念应用到我的问题上。这些是数千个dom元素，而不是像素。删除元素、破坏元素并添加新元素可能会花费很大的代价。