Топ-9 игровых движков и библиотек JavaScript

Перевод статьи «9 Top JS Gaming Engines and Libraries for 2020».

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

В этой статье я хочу рассказать о самых популярных игровых библиотеках. Ими может воспользоваться любой JS-разработчик, желающий заняться разработкой игр (хотя бы даже в качестве хобби).

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

1. Gdevelop

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

Хотя в описании движка заявлена возможность создать с его помощью «игру любого рода», речь идет скорее о 2D-играх.

В качестве дополнительного бонуса Gdevelop позволяет вам экспортировать ваши игры на разные платформы, такие как Android, iOS, Facebook Instant Games и пр.

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

2. melonJS

MelonJS это еще один игровой движок с фокусом на 2D-играх. Но, включив эту библиотеку в свой код, вы получите доступ к разнообразным функциям, необходимым для создания любой стоящей игры (поддержка физики, коллизии, спрайты и т.д.).

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

Эта библиотека очень дружественна к начинающим разработчикам, но при этом открывает много возможностей. Так что, если вы новичок в геймдеве и хотите создать 2D-игру, MelonJS будет отличным выбором.

Этот движок я испытал лично, так что могу рекомендовать другим.

3. ImpactJS

ImpactJS это игровой движок JavaScript, фокусирующийся, главным образом, на разработке 2D-игр. Но у вас есть возможность добавить плагины, с помощью которых вы сможете имитировать 3D-окружение. Например, вот так:

Любопытно, что Impact поставляется с несколькими дополнительными инструментами, такими как редактор уровней для 2D-игр любого типа, мощные инструменты отладки и очень интересный фреймворк Ejecta, позволяющий осуществлять публикации в iPhone AppStore.

4. BabylonJS

Невероятно мощный движок веб-рендеринга. Т.е., это не совсем игровой движок или игровая библиотека, но вы вполне можете строить на нем игры. Более того, поскольку это движок веб-рендеринга, а не игровая библиотека, вы получаете доступ к более низкоуровневым функциям, особенно по части визуализации.

Если вы используете BabylonJS, вы сперва строите свой движок, а затем игру. В связи с этим вы получаете полный контроль над тем, что и как происходит. Для опытных разработчиков это отличный вариант, но если вы не относитесь к их числу, путь BabylonJS может быть для вас непродуктивным.

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

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

5. PhaserJS

PhaserJS это отличный игровой фреймворк для всех ваших десктопных и мобильных нужд. Он поддерживает и WebGL, и Canvas (для устройств, не поддерживающих WebGL). Ориентирован на разработку 2D-игр.

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

6. PixiJS

Если BabylonJS это очень мощная библиотека для 3D-визуализации, то PixiJS — потрясающе гибкая и мощная библиотека для 2D-визуализации. Она работает с применением WebGL и была построена для создания красивого веб-опыта, не обязательно связанного с геймдевом.

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

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

7. PlayCanvas

PlayCanvas это веб-среда для разработки игр. Это означает, что вы будете использовать эту платформу для написания кода, тестирования, настройки сцен (там просто невероятно детальный WebGL 3D GUI) и даже экспорта ваших игр в один клик.

Как и некоторые другие пункты в моем списке, PlayCanvas полностью совместим и готов к созданию VR-опыта, а это, похоже, будет трендом в разработке игр.

Маленький недостаток PlayCanvas — он не совсем бесплатный. Вы можете использовать его бесплатно в течение пробного периода для создания публично доступных проектов. Для всего прочего требуется вносить ежемесячную плату.

8. A-Frame

У некоторых из предыдущих вариантов есть совместимость с VR в качестве дополнительного функционала. А вот A-Frame был создан с мыслями о VR и AR. Это означает, что фокус всего фреймворка смещен в их сторону.

Конечно, при помощи A-Frame вы можете создавать и обычные 3D-игры. Но если вы используете WebXR-совместимые браузеры или даже экспериментальный функционал в последних версиях Chrome, обеспечивающий поддержку WebXR AR, вы сможете использовать этот фреймворк на полную мощность.

Поскольку A-Frame проектировался для использования в браузере, вы можете полагаться не исключительно на JavaScript, а использовать также некоторые пользовательские элементы разметки, как в примере ниже:

Этот фреймворк — отличный вариант, если вы интересуетесь VR/AR, а не старыми добрыми 3D-играми. Поскольку A-Frame был разработан именно в расчете на VR/AR, он сделает вашу жизнь намного легче!

9. PhysicsJS

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

На этой демо-странице вы можете видеть, что данная библиотека позволяет создавать очень интересные взаимодействия. Как написано в документации, вы будете использовать разные типы рендереров, в зависимости от ваших нужд. В качестве рендерера можно использовать даже PixiJS или вообще создать свой, если хотите интегрировать его с другими библиотеками из нашего списка.

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

В общем, если вы хотите добавить в свою игру сложную физику или, к примеру, пытаетесь создать собственный движок, используя другие библиотеки, PhysicsJS поможет вам автоматически решать все задачи физических 2D-взаимодействий.

[customscript]techrocks_custom_after_post_html[/customscript]

[customscript]techrocks_custom_script[/customscript]