Мне было интересно, смогут ли какие-нибудь эксперты поделиться знаниями и ресурсами о том, что необходимо для создания игр с последними стандартами HTML и JavaScript (или как некоторые называют HTML 5). Существуют ли библиотеки JavaScript, которые необходимы для этого процесса? Помимо <canvas>тега, какие еще фрагменты HTML нам нужно знать?
web
html5
javascript
Edmundito
источник
источник
Уже есть пара фреймворков: GameQuery и Akihabara , который является плагином для jQuery для выполнения некоторых связанных с игрой действий, таких как анимация, группировка спрайтов, обнаружение коллизий и чтение ввода игрока.
источник
Просто чтобы выбросить больше ресурсов, проверьте RaphaelJS . Это очень хорошая библиотека для рисования и анимации SVG с хорошим API. Не забудьте проверить демо.
В целом, я бы порекомендовал
<canvas>теги для прямых манипуляций с DOM (например, чтобы каждый спрайт создавался по-своему,<div>чтобы сделать тестирование на удивление простым). Легко получить неправильную и неэффективную манипуляцию с DOM, в то время как традиционные стратегии разработки 2D хорошо работают на холсте HTML.источник
В дополнение к некоторым из существующих инфраструктур для создания игр, вам следует знать о Burst Engine, который является JS-средой для отображения SVG-анимации в HTML5 Canvas:
http://burst.bocoup.com/
До сих пор я видел, как люди упоминают теги и, но есть и другие вещи DOM, которые жизненно важны для разработки игр на JS / HTML, включая такие, как добавление обратных вызовов EventListener к элементу для таких вещей, как события mousemove и mousedown. Например, это берет первый элемент canvas, который он может найти, и настраивает его так, чтобы при нажатии на холст он вызывал функцию, которую вы определили, с именем shootAtClick:
document.getElementsByTagName ("CANVAS") [0] .addEventListener ('mousedown', shootAtClick, false);
Вы можете увидеть это в действии в этом примере, где я расширил механизм Акихабара, чтобы принять базовое управление мышью. (Нажмите Z, чтобы начать, используйте клавиши со стрелками для перемещения, щелкните мышью, чтобы стрелять в направлении курсора.)
источник
Знание того, какие компоненты HTML5 поддерживаются в каких браузерах.
Хотя кросс-браузерная совместимость становится все лучше и однороднее, со временем некоторые из новых компонентов все еще не поддерживаются полностью одинаково.
Локальное хранилище может иметь некоторые специфичные для браузера различия, и для устаревшей поддержки вам определенно понадобится библиотека, такая как jStorage или YUI Storage Lite .
Веб-сокеты также могут иметь специфические отличия для браузера, но socket.io выглядит как многообещающая библиотека, которая предоставляет удобную абстракцию.
Аудио совместимость является довольно важным компонентом, который требует разных звуковых файлов для разных браузеров: http://html5doctor.com/native-audio-in-the-browser/
В Chrome есть пара значительных ошибок в аудиосистеме, таких как невозможность воспроизведения коротких аудиофайлов и проигрывание множества одновременных звуков, которые могут вызвать сбой всего браузера.
Главное - понять различия между браузерами, используя библиотеки для абстрагирования и поддержки устаревшего ПО по мере необходимости.
источник
HTML и JavaScript, честно говоря, довольно плохие платформы для разработки игр, но это не будет иметь значения, пока вы не определитесь с какой-то игрой. Ответ будет радикально другим для шутера от первого лица, RTS или игры-головоломки.
Обратите внимание, что вы начинаете получать расплывчатые, неопрятные ответы, отбрасывающие случайные технологии, которые кажутся изящными. Это предупреждающий знак того, что вы не задали вопрос с особенно законным ответом.
С таким же успехом вы можете спросить, какие вещи на C ++ вам нужны для написания приложений. Это зависит. Расскажите нам больше о проекте, и вы можете получить полезный ответ.
В целом, есть причина, по которой почти все веб-игры все еще являются Flash.
источник