Каковы хорошие библиотеки JS для игрового разработчика? [закрыто]

56

Если бы я решил написать простую игру, текстовую и графическую (2d), какие библиотеки я бы использовал? (Предположим, мы используем браузер, совместимый с HTML5)

Основные вещи, которые я могу придумать

  • Рендеринг текста на экране
  • Анимация спрайтов (используя images / css)
  • Ввод (захват клавиш со стрелками и получение относительных положений мыши)
  • Возможно некоторая предварительная загрузка ресурса или динамическая загрузка ресурсов и выбор порядка
  • Звук (но я не уверен, насколько важно это будет для меня вначале). Возможно, с микшированием и связыванием звуков или зацикливанием навеки до остановки
  • Сеть (с низким приоритетом) для подключения пользователя к другому или для непрерывного получения данных без многократного запроса (я знаю, что это существует, но я не знаю, насколько это легко настроить или использовать. Но для меня это не важно. вопрос).
html5 javascript user1047
источник
3
Довольно полный список html5 игровых
библиотек
Какая? Вы можете сделать все это только с чистым JavaScript. Socket.io для работы в сети, хотя.
Jcora
Вы можете найти Stage.js интересным (я его автор).
Али Шакиба

Ответы:

25

jQuery и MooTools - замечательные библиотеки JavaScript; Я предпочитаю JQuery сам. Любой из них поможет вам в разработке JS-игры, если вы используете DOM. Если вы используете рендеринг Canvas, я все же думаю, что вам следует использовать одну из этих библиотек, но вам нужно будет изучить функции Canvas. Вот учебник, который знакомит вас с canvas путем создания клона Breakout, поэтому он может быть именно тем, что вы ищете (и он использует jQuery).

Анимация спрайтов - это вопрос изменения исходного изображения, предварительной загрузки нескольких изображений и их замены, или на холсте, просто рисуя кадры анимации. Вышеуказанные библиотеки могут помочь в любом из этих случаев. Библиотеки также помогают с вводом (посмотрите на события, такие как onkeypress и onmousemove).

Для предварительной загрузки ресурсов мне показалось, что в некоторых играх используется одно изображение «спрайт-листа» ( вот оно для игры Pacman от Google ). Я полагаю, что они в основном создают DIV одного размера плитки, со свойством CSS background-image, установленным для листа спрайта, а для свойства background-position установлено смещение плитки на листе спрайта. Я не видел библиотеку, которая сделает это за вас, но jQuery или MooTools могут помочь вам в динамическом создании DIV и манипулировании его CSS. В противном случае предварительная загрузка изображений - это создание <img>тегов изображений, которые вы хотите предварительно загрузить, а не добавление их на страницу (или добавление их невидимым образом). Вот пост в блоге в нем есть некоторый код для функции, использующей jQuery для предварительной загрузки изображений для вас.

SoundManager 2, похоже, является библиотекой звука JS для использования; Я знаю, что Вантия использует его, а Пакман из Googleиспользовал нечто подобное (или, по крайней мере, ту же технику, - использование скрытого файла Flash на странице для воспроизведения звуков).

Для работы в сети jQuery может обрабатывать AJAX для вас, или, если вы хотите гораздо больше работы в сети в реальном времени (и для этого нужен сервер), загляните в сокеты JavaScript . Я не знаю, есть ли стабильная библиотека для этого, но вы можете изучить это или это . По сути, он использует скрытый файл Java или Flash на странице, чтобы вы могли осуществлять истинное соединение через сокет с JavaScript, что намного быстрее, чем опрос AJAX, и немного более эффективно, чем «AJAX Push» . Однако, скорее всего, AJAX Push будет именно тем, что вам нужно, а APE (Ajax Push Engine) - это, вероятно, библиотека для использования.

Кроме того, здесь обсуждается технология Google «Создание игрового движка на основе JavaScript для Интернета» . Это выглядит аккуратно.

Ricket
источник
2
Этот ответ немного консервативный; если он хочет использовать только браузеры html5, тогда он может перейти на canvas и использовать одну из библиотек html5 (см. мой комментарий к вопросу). Использование DOM & CSS для игр выглядит как взлом (хотя в некоторых случаях это подойдет).
Оберхамси
2
Что делает это похоже на взломать? У Google не было проблем с использованием чистого DOM & CSS с их логотипом PacMan, и мне очень нравится игра в понг на моей домашней странице. На самом деле, если честно, canvas выглядит как хак, взламывая квадрат графического рендеринга на странице, где доминирует DOM. Но, увы, с толчком к этому и WebGL ясно, что браузер станет тяжеловесным приложением для всего, если это еще не сделано. Я отвлекся ...
Ricket
Если он хочет использовать аудио, сети, рендеринг текста, ему придется использовать браузер с поддержкой html5. Увы, холст будет хорошим выбором. Если вы придерживаетесь DOM & CSS, вы ограничены тем, что эти технологии уже составляют уровень представления с определенными допущениями (поток текста, многоуровневая структура, вид графа сцены для текстового документа). В то время как с canvas вы можете манипулировать пикселями любым удобным для вас способом, который ближе к «обычным», необработанным игровым движкам поверх SDL или opengl.
Оберхамси
Предоставленные мной аудио и сетевые библиотеки не требуют HTML5. И на самом деле я вижу преимущества текстового потока, слоев и графа сцены. Большинство игр - это просто спрайты (изображения), которые позиционируются и перемещаются и не нуждаются в прямом доступе к пикселям. Его действительно нужно оценивать на основе игры, которую вы хотите создать, а также, если вам лично удобнее работать с canvas или DOM, если вы хотите поддерживать более старые браузеры, если вам нужны дополнительные возможности canvas и т. Д.
Рикет
1
да, это зависит от игры. Но он просит HTML5, и ваш ответ в основном касается Flash и DOM уровня 1 :) Если он хочет заниматься передовой разработкой HTML5, не заманивайте его обратно.
Оберхамси
12

Когда я недавно оценивал движки JavaScript, моим любимым был Crafty:

http://craftyjs.com/

У меня было множество вариантов, которые мне нужно было рассмотреть, и некоторые из них мне понравились:

http://easeljs.com/

http://www.limejs.com/

http://code.google.com/p/casualjs/

(Между прочим, еще один вариант, который на первый взгляд выглядит довольно привлекательно, - http://impactjs.com/, но, учитывая, что это стоит денег, и другие варианты, на которые я смотрел, были движками с открытым исходным кодом, были некоторые явные упущения, такие как невозможность прикрепления элементов отображения в иерархия.)

UPDATE: Прошел почти два года с тех пор я отправил этот ответ , и ситуация несколько изменилась (это является зарождающейся областью технологии.) Хотя Лукавый еще большой выбор, в прошлом году EaselJS поднял большой импульс (особенно учитывая, что Adobe перешла на поезд EaselJS .) Я собираюсь перейти на этот инструмент для будущих проектов (также обратите внимание, что у него есть новый веб-сайт )

оборота
источник
что вы предлагаете сегодня? через 4 года
Пооя Эстахри
1
Ну, обновление было от 1,5 лет назад, и я все еще предлагаю это.
Джокинг
7

Двигатель эффект игры (JavaScript) является фантастическим для 2d, плитки / спрайт на основе игр. Веб-сайт не очень хорошо описывает, что в этом хорошего, но как только вы изучите отличную документацию, вы увидите, сколько было покрыто за вас:

  • спрайтов
  • обнаружение столкновений
  • редактирование уровня
  • управление активами
  • аудио
  • ввод и контроль
  • создание и управление плиткой
  • наслоение
  • анимация
  • производительность (привязка к частоте кадров)
  • кросс-браузерная поддержка и абстракции
  • хостинг
  • вложение
  • Поддержка HUD

Я действительно не могу предоставить исчерпывающий список, так как он полностью представлен. Одной вещью, которой не хватает, является возможность создавать внутриигровые меню и пользовательский интерфейс (например, менеджеры оборудования и т. Д.), Но якобы он находится в списке задач.

Рахул
источник
4
К сожалению, движок эффектов, похоже, полностью заброшен.
Летарион
6

Я поддерживаю 2D-движок Canvas под названием JawsJS - http://jawsjs.com/

Источник @ https://github.com/ippa/jaws

cliffnotes:

  • Читаемый, документированный код
  • 12+ связанных документированных примеров
  • Полезные конструкторы, такие как Sprite (), SpriteSheet () и Animation ()
  • Состояния игры - отдельные разделы вашей игры для более организованного кода
  • Активы - Jaws предварительно загрузит все ваши активы до начала игры
  • Не зависит от какой-либо другой библиотеки JavaScript
  • Основан на уроках, извлеченных за годы разработки Chingu, библиотеки Ruby
IPPA
источник
4

Воздействие будет больным! Достаточно взглянуть на демонстрационную игру Biolab Disaster .

user2418
источник
4

В последнее время я сам проводил некоторые исследования в этой области, поэтому позвольте мне внести свои 0,02 доллара:

PlayN - это кроссплатформенная библиотека от Google, которая компилирует объектно-ориентированную игру от Java до javascript / Flash / Android. Он будет обрабатывать JSON (AJAX), модели данных и имеет разумную семантику для обновлений и рендеринга. Очень классные вещи.

Обработка Простая в использовании библиотека, предназначенная для дизайнеров и художников. Он исключительно прост в использовании и может дать вам отличные результаты. Я использовал версию Java для научного моделирования, и это приятно использовать. Для 3D-сцен потребуется WebGL, но 2D-сцены работают без них.

Three.js Имеет несколько великолепно выглядящих демо. Требуется WebGL, но результат, кажется, того стоит. Есть и несколько интересных примеров в Интернете.

Вот некоторые другие пункты в моих личных ссылках, которые относятся к WebGL:

Brice
источник
2

Еще один, который я недавно изучал с большим интересом - это CreateJs . Это коллекция библиотек с открытым исходным кодом, чтобы включать ...

Кроме того, EaslJs хорошо играет с Box2D JS

Терранс
источник
1

Плагин Pixie

Создатели Contrasaurus выпустили множество своих отдельных компонентов !!!

У них есть код для выполнения матричных преобразований , абстракций холста и многих других интересных вещей.

Их код великолепен, а библиотеки действительно полезны.

DFectuoso
источник
1

Странно, что Google Closure Library не была упомянута. Он имеет огромный API, допускает более объектно-ориентированный стиль кодирования и имеет компилятор.

До сих пор я использовал только компилятор, но я планирую изучить отдых как можно скорее.

Петтери Хиетавирта
источник
1

Я обычно использую jawsjs, потому что его очень легко настроить и начать разработку игры за считанные минуты. Он имеет множество действительно полезных классов по умолчанию (Tilemap, Viewport, Sprite и другие), которые действительно помогают в разработке игр.

Дэвид Гомес
источник
1

На самом деле их у вас много, но в первую очередь это зависит от того, какой игровой движок вы ищете. Я могу дать вам некоторые ссылки из наиболее заслуживающих внимания.

2D Game Engine

  • Cocos2D имеет тенденцию быть немного более модным в данный момент. Я недавно видел вопросы о Cocos2D на Stackoverflow.
  • Влияние , вы можете увидеть тест на официальном сайте.

3D игровые движки

Фонд Mozilla работает над движком 3D-игр под названием Paladin . Думаю, это не Мозилла.

user14170
источник
0

Существует также gameQuery, игровой движок на основе jQuery. Имеет приличную документацию по их API, а также несколько API звуковых оболочек, на которые они ссылаются на своем сайте.

http://gamequery.onaluf.org/

numo16
источник
0

Matrix.js хорош, если вы хотите получить матричные преобразования в стиле Flash.

Даниэль Х Мур
источник
0

Том из Scirra, мы - команда из двух человек, которая создала Construct 2, создатель игр HTML5 . (Бесплатная версия доступна).

Возможно, вы захотите рассмотреть двигатель, подобный нашему, так как он делает большую часть работы за вас. Например, делать коллизии в коде самостоятельно может быть очень сложно (подумайте о коллизиях полигонов). Все в вашем списке легко достижимо с Construct 2.

Том Гуллен
источник