Indie-Resource.com

Thought some of you would like this, guy explains how to build a "Building a JavaScript-Based Game Engine for the Web":

[YouTubeHD]http://www.youtube.com/watch?v=_RRnyChx ... re=related[/YouTubeHD]

Yep, this is an interesting one, as I have watched a good deal of it as well. I believe though he is speaking about traditional, loop-based game development. I think he worked with John Resig (the creator of jQuery) on the Aves engine, which was the most complete and feature-rich game engine in HTML5 at the time, but has since been bought by Zynga (the publisher of Farmville and a slew of other multi-million dollar Facebook games) and made proprietary. If you are interested in loop-based JS game development, he definitely knows his stuff. For PBBGs, though, it is mostly just academic.

What is a loop based game?

But yeah I watched it and took notes on some things I think will be helpful, but some of it was definitely more advanced than I need, at least for now.

"Loop-based games" are traditional games. These include: Super Mario Brothers, Gears of War, World of Warcraft, Final Fantasy 7, Tetris, Angry Birds, and pretty much any other game running on any "game platform", or any type of computer game that you would buy or download. The program starts, and a loop almost immediately begins, and it updates all of the graphics every time the loop goes around in the code. What looks like high-speed animation is a program running through maybe millions of calculations just to update everything in the game world by an fraction of an inch, and then the whole thing loops back around to do it again until the game is closed. This is the way almost all games are made. In fact, loop-based games are so common, most other game dev communities would not make a distinction, because to them, there is basically no other alternatives.

But there actually is at least one alternative that is very important as far as we are concerned: PBBGs (aka browser-based RPGs). These are the types of games many of the members here are working on, and the types of games Halls makes in his tutorials. These would probably be called in computer science "event-based games". Basically, the player can still be looking at the screen, reading text, and "playing" the game, even though, in the program, nothing is happening; no loop, nothing. The game itself will not react until the player does something to trigger an "event" (even if that event is not a real programming event, but rather, a browser event, such as submitting a form). These games are made very differently than loop-based games. However, the line can grow a bit hazy if a PBBG uses an animated Javascript map or world, or if there is AJAX polling being done to get real-time updates. Then part of the program is running in an event-based manner, while the graphical display or networking aspects are running in a loop-based way. I believe Halls has made a couple of tutorials that utilize animated JS maps, which require loops to move and update the graphics, while the rest of the game is event-based still, such as submitting forms or clicking links to carry out other activities in the same game, so he has worked on a couple of hybrid games like this.

I hope that clears it up

it is amazing how close yet how far loop based vs event based can be. When designing a game we spend some time thinking about what option to go with without even knowing it.

Event based is not the correct term if you ask me. I`d call it view based or something. In looped games, everything is about events, eventHandlers et cetera, in PBBG there`s not such thing as an event ( in computer terms that is ). But the distinction is clear nonetheless. And yes, this video was for the aves engine, but we cannot access it since it was bought of by Zynga. And it has no real html5 elements in it, like Canvas. It uses the DOM most of the time because, as said in the video, the Canvas is too CPU intensive for now. But I`d really like to see an engine like that pop up somewhere soon..

Most loop-based games do not use events at all, actually, except for some of the oddball examples, like Flash. Event-based architecture means the system is doing very little during inactivity (Windows Forms programming in .NET or VB6 is a good example, as it is doing almost nothing in its runtime if you aren't interacting, but lower in the OS there is a loop that is continuously painting the screen, although most don't count that), but will "snap into activity" when the user interacts. This is the exact opposite of how loop-based game development works, where the system is always running at max speed, and instead of waiting to be told an event has occurred, it actively checks to see if things have happened, even if they haven't. In most games, there is not an event when the user pressed a button on their control pad to tell the engine to react. Instead, it checks on every pass to see if one or more of every button was pressed, having no idea ahead of time if it was.

And about Aves, that is even crazier if it was all DOM. I saw a video of it in action on YouTube which was mislabeled that it was HTML5 Canvas. I can see why, since it would have been incredible for even Canvas, much less regular DOM scripting.

EDIT:

Xaleph wrote: But I`d really like to see an engine like that pop up somewhere soon..

Keep an eye on Isogenic Engine. I would say out of everything on the horizon it is probably closest (from what I have seen in videos, since it is not released yet) to what Aves was going to be. It has all the hookups for real-time MMORPGs, automatic Facebook integration if you want it, and it can be fitted to other genres as well.

I believe what some of the upcoming, blazing-fast HTML5 game engines are doing is what I started thinking about when I learned about the features: they are getting very clever and technical with composite modes so they don't have to always redraw everything on the Canvas (the Canvas is 100% "immediate mode", which is a nightmare for game developers and anyone else who needs high performance since the graphical field is always a rasterized bitmap that you cannot edit. You have to flush it all away and start from scratch every new frame, which is worlds different from Flash and Silverlight).