|
Javascript is not only welcomed by the web developer or designers, but
also more and more mobile device(Such iPad, iPhone, Android etc)
oriented developers, we can easily build many amazing games with HTML(5)
+ Javascript + CSS. Below is a list of JavaScript Game Engine for
serious developers, include general, 3D, Animation, Canvas, Math, Color,
Sound, WebGL etc. Hope they will be helpful for your work!
Hot news: Unlock iPhone 4S
1. General JS Game Engine
Akihabara is a set of libraries, tools and presets to create
pixelated indie-style 8/16-bit era games in Javascript that runs in your
browser without any Flash plugin, making use of a small small small subset of the HTML5 features, that are actually available on many modern browsers.
BDGE is a game engine written in Javascript that uses HTML5 Canvas and Audio to create in-browser games.
Canvex is an experimental browser-based FPS game engine in the HTML <canvas> tag, which be believed to work in the following browsers, on any operating system and with no external plugins.
Cocos2d-javascript is a 2D game/graphics engine based on
cocos2d-iphone but designed to run in the web browser. It uses the
latest features available in HTML 5 allowing real-time rendering of 2D
graphics without the need for plug-ins such as Adobe Flash.
Crafty is a lightweight, modular JavaScript game engine to easily
produce high quality games. Includes a large variety of components such
as animation, event management, redraw regions, collision detection,
sprites and more. Go to Making Simple RPG Game with JavaScript and Crafty for an example
Diggy is a DHTML Game Engine (DGE).
FlixelJS is direct port of Flixel from AS3 to Javascript (HTML5/Canvas).
GameJS is a library for writing 2D games or other interactive
graphics applications for the HTML Canvas. GameJs already provides
sprites, sprite groups (and collision detection between any of the two),
font rendering, image handling, an event loop with keyboard/mouse
support as well as resource preloading, AStar search, javascript server
integration with RingoJs and more.
GameJs is a lightweight library, which is actually a port of the popular PyGame to JavaScript, that uses HTML canvas element.
It is a simple framework that allows writing the games as CommonJs modules.
Gamma is a new Javascript library which can be used to create 2.5D
platform games for a web browser using the power of HTML, JavaScript,
CSS and WebGL.
This JavaScript library can be used to create 2.5D platform games with the power of HTML, JavaScript, CSS and WebGL.
It comes with various classes to ease the development process including the ones for shapes, characters, enemies and more.
gameQuery is a jQuery plug-in to help make javascript game
development easier by adding some simple game-related classes. It�s
still in an early stage of development and may change a lot in future
versions. The project is hosted on GitHub (it was hosted on Google Code
before) and a twitter page where you can follow the daily progress of
the development.
gTile is a browser based game engine entirely in Javascript and
DHTML. A two dimensional tile based view has been chosen for simplicity
and accessibility. Game play is achieved through rich interactions and
behaviors of game objects, rather than fancy graphics or animation.
The engine is perhaps best suited to creating adventure and roguelike
style games, but may also be used to create 2D virtual world
representations of communities and geographical locations.
Impact is a JavaScript Game Engine that allows you to develop HTML5
Games in no time. Games created with Impact require no browser plugins
or any software installations � just a modern browser that supports the
Canvas tag.
The Isogenic Game Engine is a project to create a fully-featured
modern game engine written entirely in Javascript, running on all the
latest web browsers and utilising either HTML Canvas or standard HTML
elements as the draw space.
The Javascript 2D Game Engine (for want of a more exciting name), is
more or less just that. It�s a 2D engine I�ve developed, in javascript,
with the primary purpose for creating games. It models shapes as rigid
bodies, which can collide and be influenced by forces. Runga Kutta 4 is
used to produce (fairly) stable integration for springs and and charge.
Now at version 4, the 2D engine now uses HTML 5′s canvas tag, and
Google�s ExplorerCanvas to get it working in IE. The canvas is fairly
widespread these days, so it should be supported fairly widely.
This is a free game engine developed for programming browser based
games. It uses the Javascript language and CSS (Cascading Style
Sheets) to dress up the page. They run pretty reliably
together. Use this engine to create your own game. This
project is intended for beginners, wanting to learn how to program video
games. Better if you�re a web designer that knows some CSS.
Brent Silby has built upon the official 2.09 version of the Gamelib released by Scott. He says his improvements are:
- properties for sprites such as jumping, falling, fallspeed, etc.
- tile handling for backgrounds and platforms. It�s basically the same
as the sprite module, but (of course) the tiles are not updated on each
cycle to save speed. "This is incomplete but I have used it in my
games," he says.
- the old V2.09 gamelib modules have been kept in a separate folder
jGen is a game engine build in JavaScript,
jsGameSoup is a Free Software framework for making games for the web
using Javascript and HTML5. Abstract away some of the complexity of
developing Javascript games for multiple browsers. Currently runs under
new versions of Firefox (Gecko), Safari/Chrome (WebKit), IE 6.0 and
higher. Doesn�t depend on any proprietary technologies like Flash or
Silverlight.
The library comes with cross-browser event handling (mouse, keyboard and touch).
It has polygon, box and circle collision detection, sprite management and networking (ajax) abstraction layer.
js-verge is a javascript game engine largely based on (and importing file assets from) the VERGE game engine.
Propulsion is a JavaScript game development framework for the HTML5 canvas element.Some features of Propulsion include:
- Support for any type of two dimensional game development.
- Code patterns that are simple, yet robust and make sense for use with JavaScript.
- A clear separation between different parts of the framework.
- Support for collisions between any convex polygons.
Propulsion is licensed under the MIT License.
Rosewood is a 2D Javascript gaming engine for all your browser-based gaming needs, without the flash.
ryanwilliams is a re-implementation of cocos2d for the Web using HTML5 and JavaScript.
Sarien.net interpreter is 2D Adventure JS game engine based GPL license.
clanfx is a 2D, tile-based Javascript game engine developed using
Javascript and CSS. It currently works in Firefox, Epiphany and Opera
browsers. Features include many animated sprites, spell effects,
buildings, tiles/textures and basic game AI.
GMP is a fast, free, javascript game engine, dual licenced under
GPLv2 and MIT licenses. It�s small, simple, and easy to learn and use.
GMP is a JavaScript game engine that fits good to creating sprite-based, 2-D games and it can easily power most retro-style arcade game designs or puzzles like Sudoku.
It has a ready-to-go, self-booting game loop. Mouse and keyboard inputs can be used easily.
The engine is well-documented and the major fallback can be the lack of integrated sound support.
The Render Engine is a cross-browser, open source game engine written
entirely in JavaScript. Designed from the ground up to be extremely
flexible, it boasts an extensive API and uses the newest features of
today�s modern browsers.
A cross-browser engine which is very flexible and comes with an extensive API.
It uses object-pooling to reduce garbage collection.
Abstraction around the Canvas DOM element and any DOM element exists to standardize access to the capabilities of 2D rendering.
Box2d is the physics engine integrated, has support for touch inputs and much more.
It is a HTML5 game framework for building games that'll feel native and work fast in modern touchscreens and desktop browsers.
LimeJS is created with Closure Library built by Google and comes with functions/classes to control the timeline, events, shapes and animations.
Also, the framework has full support of sprite sheets (you can collect all images inside a single file).
A 2D game library powered by HTML5 which supports canvas and ordinary DOM based sprites through the same API.
It has a satisfactory sprite constructor for a higher abstraction for the characters.
Jaws makes handling keystrokes easier, providing string-identifiers for each key and anywhere in the code, you can instantly check if a key is pressed down.
Tom�s Halls is a JavaScript platform game engine. Version 3.0 of
Tom�s Halls basically "completes" the game � literally, as there is now a
game-won sequence. Game-wise the playing area has been increased to 41
screens, various new retro sprites make an appearance, and many of the
existing screens have been tweaked and revised.
Unity 3 is a game development tool(JS background, include
commercial and free version) that has been designed to let you
focus on creating amazing games.
Vegalib is a library and other related tools for creating games using Vexi.
xc.js is a framework for HTML Canvas games in
Javascript. It�s simple and fun to use and you can even try it out right
here in your browser.
But that�s not all. xc.js also runs on other
platforms. You can write your games in Javascript and run them in all
sorts of cool places (like on your phone!).
It is a very fresh framework and not as mature as others in the list.
At the core of xc.js, the concepts are scenes, nodes, actions, and events.
Sound support, Box2d and networking are the features to be mentioned in the "to-do-list" of the framework.
2. Some 3D JavaScript Engine
The Canvas 3D JS Libary (C3DL) is a JavaScript library that will make
it easier to write 3D applications using WebGL. It provides a set of
math, scene, and 3d object classes that makes WebGL more accessible for
developers that want to develop 3D content in browser but do not want to
have to deal in depth with the 3D math needed to make it work.
CopperLicht is a JavaScript 3D engine for creating games and 3d
applications in the webbrowser. It uses the WebGL canvas supported by
modern browsers and is able to render hardware accelerated 3d graphics
without any plugins.
GLGE is a javascript library intended to ease the use of WebGL; which
is basically a native browser javascript API giving direct access to
openGL ES2, allowing for the use of hardware accelerated 2D/3D
applications without having to download any plugins.
The aim of GLGE is to mask the involved nature of WebGL from the web
developer, who can then spend his/her time creating richer content for
the web.
JS3D is a library which allows you to have interactive 3d objects on
your website, such as the spinning cube at the top of the page. The 3d
effect is created using actual text, try selecting the text on the cube
above! This is different from the approach of, for instance, these
folks, who have made a better quality renderer, which is much more
processor intensive. To see more functionality scroll to the demo
section.
WebGL implementation of O3D is an open-source JavaScript API for
creating rich, interactive 3D applications in the browser. Originally
built as a browser plug-in, this new implementation of O3D is a
JavaScript library implemented on top of WebGL.
Pre3d is a Javascript 3D rendering engine.
Sandy is a Flash 3D engine, available in 3 versions: AS2, AS3 and haXe(to JS).
SpiderGL is a JavaScript 3D Graphics library which relies on WebGL for realtime rendering.
SpiderGL provides typical structures and algorithms for realtime
rendering to developers of 3D graphics web application, without forcing
them to comply with some specific paradigm (i.e. it is not a scene
graph) nor preventing low level access to the underlying WebGL graphics
layer.
three.js is a javascript 3D engine. The aim of this project is to
create a lightweight 3D engine with a very low level of abstraction (aka
for dummies). Currently the examples are the documentation. Be aware
that the API may change from revision to revision breaking backwards
compatibility.
3. JavaScript physics engine
This is a port of Box2DFlash 2.1a to JavaScript . I developed an ActionScript 3 -to- JavaScript converter to generate the code.
There already exists a port to JavaScript called Box2dJs, but
it�s not up-to-date and you have to import a big amount of JavaScript
files in every project, whereas my version is stored in a single file.
4. Animation JavaScript Framework
The sprite.js framework lets you create animations and games using
sprites in an efficient way. The goal is to have common framework for
Desktop and mobile browsers.
sprite.js has been tested on Chromium, Firefox, Android emulator and Opera.
5. Sound JavaScript library
Using HTML5 and Flash, SoundManager 2 provides reliable cross-platform audio under a single API
100% Flash-free MP3 + MP4/AAC where supported. Works on iPad, iPhone iOS 4
Seamless flash fallback for MP3/MP4 content, if needed
HTML5/Flash API switching is transparent, handled internally
WAV + OGG playback possible via HTML5, if supported
See useHTML5Audio for implementation details
This browser�s <HTML5> vs. Flash support (best guess):
6. Canvas JavaScript library
ArtisanJS is a JavaScript library that aims to make in-browser drawing very, very easy.
Burst is a javascript vector animation engine for the HTML5 Canvas
supporting SVGs, Blender3D objects, timelines, easing, command chaining
and callbacks
CAAT: Canvas Advanced Animation Tookit CAAT in essence is a multi-instance director-based Scene graph manager.
canto.js is a small JavaScript library that improves the HTML5 Canvas drawing API to support features such as:
- method chaining
- relative coordinates
- polylines
- SVG path commands
- turtle graphics
- easier specification of drawing attributes
CAKE is a JavaScript scene graph library for the HTML5 canvas tag.
You could think of it as SVG sans the XML and not be too far off.
CamanJS is an attempt at providing a simple to use interface for
dynamically manipulating images completely in JS. It strives to provide
much of the basic functionality you would find in something like
Photoshop. By this I mean, image contrast, brightness, levels,
saturation, etc.
Wrapper for HTML5 Canvas Context 2D properties and methods, enabling chaining.
It�s intended to be simple, small and not add new functionalities
besides method chaining, it doesn�t overwrite the native
prototypes/objects and can be used interchangeably with native Context2D
methods/properties, works just as a wrapper to native calls.
canvg is a Javascript SVG parser and renderer. It takes a URL to a
SVG file or the text of an SVG file, parses it in JavaScript, and
renders the result on a Canvas element. The rendering speed of the
examples is about as fast as native SVG.
Doodle-js is An Animation Library for JavaScript. Some of the features:
- Use the Canvas drawing API with sprites and a scene graph.
- Event handling and dispatch for objects.
- Nodes maintain transforms, bounds, and other useful properties.
- If you�re coming from ActionScript 3, you�ll feel right at home!
The new Canvas element in HTML5 is powerful, but it can be difficult
to work with. It has no internal concept of discrete display elements,
so you are required to manage updates manually. The Easel Javascript
library provides a full, hierarchical display list, a core interaction
model, and helper classes to make working with Canvas much easier.
gury.js is a jQuery inspired canvas utility library.
Fabric.js is a framework that makes it easy to work with HTML5 canvas
element. It is an interactive object model on top of canvas element. It
is also an SVG-to-canvas parser.
Using Fabric.js, you can create and populate objects on canvas;
objects like simple geometrical shapes � rectangles, circles, ellipses,
polygons, or more complex shapes consisting of hundreds or thousands of
simple paths. You can then scale, move, and rotate these objects with
the mouse; modify their properties � color, transparency, z-index, etc.
You can also manipulate these objects altogether � grouping them with a
simple mouse selection.
A basic HTML 5 canvas drawing library for those familiar with the
java.awt.Graphics class in Java. It also comes with a JavaScript
implementation of the game Breakout to demonstrate using the library.
The Layered Canvas Library (LCL) is a javascript library that helps
manage objects on the Canvas element. The LCL implements a two tier
layer manager that creates and contains items within it. The layer
manager attaches mouse events to each item contained, and allows the
user to define handlers for each event, per item.
The layer manager also allows for each layer contained to be
promoted, or demoted over another layer. The layer manager, and each
layer, and item contained, is defined with a draw function. The draw
function executes user defined code to draw the item, layer, or each
layer contained consecutively.
This library provides functionality to manage and interact with the
content of a html5 canvas element. It emulates layers and items that can
be manipulated and managed and provides mouse-events to the items.
This library is inspired by Michael Camden�s layered-canvas-library
but I made this one a little more compact, skipped some features, added
some and tried to streamline the way the lib is interacted with. It is
built utilizing many features of the MooTools javascript framework which
is responsible for reduced filesize, great OOP and flexible events.
Pixastic is a JavaScript library which allows you to perform a
variety of operations, filters and fancy effects on images using just a
bit of JavaScript.
Processing.js is the sister project of the popular Processing visual
programming language, designed for the web. Processing.js makes your
data visualizations, digital art, interactive animations, educational
graphs, video games, etc. work using web standards and without any
plug-ins.
You write code using the Processing language, include it in your web
page, and Processing.js does the rest. It�s not magic, but almost.
Rapha�l is a small JavaScript library that should simplify your work
with vector graphics on the web. If you want to create your own specific
chart or image crop and rotate widget, for example, you can achieve it
simply and easily with this library.
Stackblur is a Javascript / Canvas based implementation library.
Toxiclibs.js is a javascript port of Karsten Schmidt�s Toxiclibs for
Java and Processing. Toxiclibs.js works great with the Processing.js
visualization library for but is not dependent on it. It can be used
with other libraries such as Raphael.js, Three.js or by itself.
Unveil is a data exploration and visualization toolkit that utilizes data-driven software design.
7. WebGL
WebGLU is both a set of low-level utilities and a high-level engine
for developing WebGL based applications. WebGLU is designed such that a
developer can focus on the end result with a minimum of fuss and code,
but doesn�t hand hold developers who want more control. This is achieved
by exposing the raw GL object and also many lower-level functions for
working with it and the WebGL API.
8. Color
color.js can be used in any ECMAScript environment as it does not
make use of the DOM. color.js is very useful on the server-side and the
client-side, The color.js CSS module defines all of the standard CSS
colors for use in color.js.
9. Math
Sylvester is a JavaScript library designed to let you do mathematics
with vectors and matrices without having to write lots of loops and
throw piles of arrays around.
It includes classes for modelling vectors and matrices in any number
of dimensions, and for modelling infinite lines and planes in
3-dimensional space. It lets you write object-oriented easy-to-read code
that mirrors the maths it represents.
|