С чего начать написание игрушек на js?

Question

[kiberlain]

Прошу не банить данный с виду простой вопрос. Javascript я знаю плохо и помимо скриптов и аякс запросов для реализации всякой интерактивности на сайтах больше ничего не писал. Решил сделать простенькую игрушку вроде арканоида. Первым делом разумеется посмотрел реализации на codepen и jsfiddle.

1. Вижу что можно сделать как на дивах, на pure js в канвасе и с использованием готовых библиотек. Я так понимаю что лучше на канвасе, потому что производительность выше. Готовую библиотеку вроде fabricjs брать и учиться использовать? или прямо с нуля учится рендерить на канвасе кнопочки, интерфейсы?

2. Предположим, что в дальнейшем в созданный арканоид будут играть несколько игроков. Опять же как сейчас принято грамотно это делать? Знаю что на вебсокетах. С нуля писать велосипеды или брать готовые решения?

Comments

[Антон Спирин]

Используйте готовый движок. phaser.io вам для арканойда с головой.

[kiberlain]

Антон Спирин, я смогу потом какие-то свои штуки добавлять (вроде вылетающих монстриков, стреляющих направо-налево)?

[Антон Спирин]

kiberlain, все что захотите.

Answer 1

[Дмитрий Ларин]

Могу посоветовать начать с уроков на ютубе. Вот например по арканоиду - тыц

Comments

[kiberlain]

предлагаешь с нуля на канвасе делать по готовым примерам? ясно-понятно

Answer 2

[Ernest Faizullin]

возможно будет полезно
Математика для разработки игр. Что посоветуете?

еще добавлю, выбери framework, например phaser https://www.youtube.com/results?search_query=phase... или подобный фреймворк

все придумано до нас. Если ты не суперпрофи в этом деле, то лучше использовать фреймворки

Answer 3

[xmoonlight]

Зависит от цели. Их может быть две.
1. Понять общую механику работы игр (игровой цикл, взаимодействие объектов и т.д.).
2. Заработать на продаже игры, которая будет создаваться в процессе обучения.

Если п.1 - советую Crafty.js (есть поддержка сцен, физики и удобный доступ к свойствам объектов)


Если п.2 - советую Unity.

Почему именно Unity?

При создании контента для Интернета вам может потребоваться связаться с другими элементами на вашей веб-странице. Или вы можете реализовать функциональность с помощью веб-API, которые Unity не предоставляет по умолчанию. В обоих случаях вам необходимо напрямую взаимодействовать с движком JavaScript браузера. Unity WebGL предоставляет различные методы для этого.

(перевод из текста со страницы официальной документации Unity)
Помимо деплоя приложения на разные платформы, Unity предоставляет хорошую 3-х стороннюю интеграцию между: Javascript, C# и C++.

Comments

[kiberlain]

в первую очередь производительность и размер интересует... )

[xmoonlight]

kiberlain, Как правило, чем ближе к процу (по вложенности), тем больше объём, т.к. много прослоек пишут для упрощения развития инструмента разработки. Единственных выход - это полностью нативная разработка по каждую платформу в отдельности.
Если кросс-платформенно и кросс-браузерно - это только чистый Javascript и/или emscripten.
Также, многое зависит от типа игры и видео-ускорителя.
PS: не могу оторваться: www.quakejs.com )))

[kiberlain]

xmoonlight, да мне пока вполне хватит двухмерного платформера с максимальным фпс )
PS: а у меня на дешёвом ноуте в 8гб оперативы quakejs тормозит =/

[xmoonlight]

kiberlain, платформер и малый размер: тогда выбор однозначен Crafty.js - лёгкий и простой в освоении. Всегда можно будет прикрутить что-то, или ускорить исполнение кода, если имеется что-то сильно нагружающее js-движок (например, работу с матрицами преобразований, обнаружение коллизий и т.д.), скомпилировав код C++ через emscripten в js.модуль webasm.
Можно тестить (на мобиле и т.д.) и попрыгать с клавиатуры (и от радости!))): jsfiddle.net/mucaho/v8okhwob