diff --git a/app/react/components/pixi/entities.jsx b/app/react/components/pixi/entities.jsx index 47bb806..b0a16f7 100644 --- a/app/react/components/pixi/entities.jsx +++ b/app/react/components/pixi/entities.jsx @@ -15,6 +15,7 @@ export default function Entities({monopolizers, particleWorker}) { const [debug] = useDebug(); const [ecs] = useEcs(); const containerRef = useRef(); + const latestTick = useRef(); const entities = useRef({}); const pool = useRef([]); const [mainEntity] = useMainEntity(); @@ -75,8 +76,10 @@ export default function Entities({monopolizers, particleWorker}) { return; } async function onMessage(diff) { - await ecs.apply(diff.data); - updateEntities(diff.data); + latestTick.current = Promise.resolve(latestTick.current).then(async () => { + await ecs.apply(diff.data); + updateEntities(diff.data); + }); } particleWorker.addEventListener('message', onMessage); return () => { diff --git a/app/react/components/ui.jsx b/app/react/components/ui.jsx index 8a42641..1356556 100644 --- a/app/react/components/ui.jsx +++ b/app/react/components/ui.jsx @@ -35,6 +35,7 @@ function Ui({disconnected}) { // Key input. const client = useClient(); const chatInputRef = useRef(); + const latestTick = useRef(); const gameRef = useRef(); const [mainEntity, setMainEntity] = useMainEntity(); const [debug, setDebug] = useDebug(); @@ -320,8 +321,10 @@ function Ui({disconnected}) { if (0 === Object.keys(payload.ecs).length) { return; } - await ecs.apply(payload.ecs); - client.emitter.invoke(':Ecs', payload.ecs); + latestTick.current = Promise.resolve(latestTick.current).then(async () => { + await ecs.apply(payload.ecs); + client.emitter.invoke(':Ecs', payload.ecs); + }); }, [ecs]); usePacket('Tick', onTickPacket); const onEcsTick = useCallback((payload, ecs) => {