Как работают многопользовательские real-time приложения в canvas?

Я играл раньше в браузерные игры, где на одной карте (локации) отображались сразу несколько игроков и их передвижения по этой карте (например, игра по типу чашки Петре - agar.io). Но тогда я не знал, что такое canvas, и не задумывался, как вообще реализованы такие вещи.
И вот недавно впервые встретился с разработкой на канвасе. Хочу понять, как же на нём реализуют многопользовательские онлайн приложения?

Я так понимаю, что в функции отрисовки requestAnimationFrame, в которой и рисуется новое положение игрока X, например, смещается на 1 пиксель, отправляется post-запрос на сервер с id игрока и новыми координатами его расположения (смещение на 1px). Эти данные сохраняются и рассылаются всем остальным игрокам, находящимся на той же карте, и у них на картах игрок X отрисовывается на только что полученных координатах. Так? И так происходит по несколько десятков раз в секунду (по частоте вызова requestAnimationFrame)?
  • Вопрос задан
  • 189 просмотров
Решения вопроса 1
xmoonlight
@xmoonlight Куратор тега JavaScript
https://sitecoder.blogspot.com
Есть минимум 4 асинхронных(параллельно обрабатываются!) цикла получения данных.
1. Сигнал синхронизации: "стук сердца" (heart-beat).
2. Локальный: только расчёты.
3. Визуализация/Рендеринг: FPS.
4. Сетевой обмен данными: мультиплеер.

Всё считается отдельно и независимо друг от друга!
Самый главный - это синхросигнал (п.1).

НО! Также, есть допуски у всех уровней, что ниже, которые устанавливают допустимые критерии оптимизации и поддерживают корректную синхронизацию и античит.

Все на сервере делаем на нативных сокетах!
И, чтобы НЕ гонять лишний трафик в JSON-формате через WebSocket, советую использовать websockify или engine.io (от разработчиков socket.io).

Дальше - апроксимация движения объектов и лаги... Это будет ещё интереснее)))
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
HistoryART
@HistoryART
^Спасибо - отметить ответом
Как обычный чат, веб-сокет
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
GFX Пермь
от 60 000 до 120 000 ₽
Spice IT Recruitment Москва
До 200 000 ₽
Reelmotion Games Санкт-Петербург
от 50 000 до 150 000 ₽
29 мар. 2020, в 16:44
3500 руб./за проект
29 мар. 2020, в 16:39
70000 руб./за проект
29 мар. 2020, в 16:22
3000 руб./за проект