How do video games get on my screen? - language-agnostic

When i play a video game (any old game like a racing game or pack man or whatever) how does everything get displayed on the screen in terms of what is going on in the program? is there some big RenderEverything method that is executed once a frame? this strikes me as a bit of a slow way to go about such a thing though.
EDIT: as a follow up question:
How does the computer doing the rendering define the frame both for rendering graphis and for doing in game activites like having a character walk across a room slowly. Like is there some clock t that keeps increasing and every render and every movment hapens as a function of t? If so how is t defined relative to the system that it runs on?
I intend this question to be somewhat synonomous to: When my cursor in the screen right now blinks twice every second how does it know what a second is? Also in java how would i make a program that displays a line of text then waits a second and desplays another line? (perahps this is getting too spacific)

They have a loop. Inside this loop it's called a method for rendering graphics and another for processing logic (and getting input). So this method will calculate everything based on the input and the graphics method print on screen based on the data already computed -- like what should be printed and its position.
Is that what you asked?
Questions about game development should be made here: https://gamedev.stackexchange.com/ :)

When i play a video game (any old game like a racing game or pack man or whatever) how does everything get displayed on the screen in terms of what is going on in the program? is there some big RenderEverything method that is executed once a frame?
Depends on the game. 2D games may be able to keep part of scenes rendered in previous frames, especially old games without scrolling screens. 3D game most likely redraws entire screen. Also good game never renders everything - only visible objects. Because rendering everything is slow, while rendering only visible objects is significantly faster.
this strikes me as a bit of a slow way to go about such a thing though.
You are free to try to find different way. Normal game repaints every visible object. Non-hardware-accelerated game may track unmodified screen regions, and repaint only objects that changed, moved, etc. Hardware accelerated game doesn't have to do that - it can redraw everything on screen every frame. As game/frame/scene complexity increases, it is much easier to simply repaint every visible object during every frame instead of tracking things that changed from previous frame.

That's basically it. The 'video game' is effectively a big state machine where all state is updated according to a frame rate. User input combined with game rules and enemy AI affect the state of the game. Once every frame the players view of the game, not the complete view of the game, is rendered.
Download the quake source, it makes for some interesting reading in the comments and also gives excellent insight as to how a game is constructed.

Related

ConcurrentModificationException in a Java game

I am at the early stages of developing a 2d shooter game (Picture Metal Slug) using JAVA. I want to be able to shoot many bullets at the time. In order to do so i use a Set to control the current bullets on the screen, each time you click you spam a bullet, adding it to the screen and to the set of bullets (so in each frame, you move each bullet in the set according to their speed).
My problem is that if I click fast enough I get an
ConcurrentModificationException
Is there a data structure able to add and remove fast enough different objects without getting such exception? I can not find any that suit me.
Thanks in advance
The data structure able to suit your requirements is a ConcurrentHashMap, check:
http://docs.oracle.com/javase/7/docs/api/java/util/concurrent/ConcurrentHashMap.html

Making a real-time multiplayer minigame

I have a very simple concept of minigame that I want to be playable by up to four players at once. It will be played on an HTML5 canvas, and I already have it working in single-player with three CPU-controlled "players".
The game itself is simple, it just relies on timing and pushing your button as the arrow points towards it. In theory I could just have the game focus on the user's own button, and then just show how everyone did at the end, but what I'd really like to do is for the arrow to move faster the better people are doing - this will essentially allow the difficulty of the game to adjust itself.
So I'm thinking I need to use WebSockets. Only trouble is, I've never used them before and I can't find a single resource that isn't insanely confusing.
By my understanding, I just need the client to send a message to the server when the player pushes their button, and on receipt of that message the server can compute how accurate the player was, and adjust the speed accordingly, passing on that result to the other players.
I'm just worried about what effect lag could have on this setup. What if the arrow reaches the next player before their browser has received the message from the server informing them of how the last player did (and therefore what speed the arrow is going at)?
Am I just being too ambitious with this? Should I just stick with the idea of having four individual games whose total scores are tallied together?

Bigger stage vs scrolling background

I'm making a flash game, and I can't decide to use a bigger stage or a smaller one, with scrolling background to make it run smoother. I's going to be some kind of strategy game if it matters.
Thanks
One option is to have a bitmap object the size of your stage for example 800x600, then draw your objects into the bitmapdata of that bitmap using copyPixels this is known as blitting and is pretty fast.
Another option is to just use the flash display list and add every object as sprites onto the stage.
Second method is easier to handle in terms of mouse events and stuff.
My advice is to start with the second option and see if performance is enough, if not go with option 1.
There are many, many variables that determine the performance of your application.
To answer your question, a smaller stage area will make your program run faster. The amount of difference will depend on the way your application deals with display objects. Flash will not render things that are completely outside the stage bounds. So keeping only those objects that are needed at any given time on the stage is a good practice.
using flash player 11's new stage3D features (even for 2D stuff) will likely make your game very smooth. Lots of good frameworks out there that can take care of the low-level stuff if you don't want to get into it. For 2D, starling is very easy to get started with, and seems to be Adobe's favored framework.
At a bare minimum, make sure you use GPU acceleration in your output/compiler options.
There are LOTS of other tips for optimization people could get into, but that is better suited for google searches as Stackoverflow is about specific questions.

HTML5 Canvas and Game Programming

I hope this isn't too open ended.
I'm wondering if there is a better (more battery-friendly) way of doing this --
I have a small HTML 5 game, drawn in a canvas (let's say 500x500). I have some objects whose positions I update every 50ms or so. My current implementation re-draws the entire canvas every 50ms. I can't imagine that being very good for battery life on mobile platforms.
Is there a better way to do this? This must be a common pattern with games.
EDIT:
as requested, here are some more updates:
Right now, the objects are geometric primitives drawn via arcs and lines. I'm not opposed to making these small png/jpg/gif files instead of that'd help out. These are small graphics -- just 15x15 or so.
As the game progresses, more and more of the screen changes at a time. However, at the start, the screen changes relatively slowly (the objects randomly moved a few pixels every 50ms).
Nearly every game with continuous animation like this redraws everything every frame; clever updating algorithms are only applicable when a small part of the screen is changing and there is a nice rule to figure out what is overlapping that part.
Here is some general optimization advice:
Make sure that as much as possible of your graphics are handled by the GPU and not the CPU. (This may be impossible if the user's browser does not use the GPU for 2D canvas rendering, but you can expect upgrades may change that as HTML5 gaming gains popularity.)
This means that you should avoid elaborate clever algorithms in favor of doing as little work as possible in JS code — except that avoiding performing a lot of drawing when it is easy to determine that it will be invisible (e.g. outside the bounds of the screen) is generally worthwhile.
If your target platforms support it (generally not the case for current mobile devices), try using WebGL instead of 2D Canvas. You will have to do more detail work, but WebGL allows you to use operations which are much more likely to be provided efficiently by the GPU hardware.
If your game becomes idle — that is, nothing is actually animating at the moment — stop redrawing. Stop your update loop until the user interacts with the game or a timeout occurs.
It may be helpful for you to add to your question details of what types of graphics you are drawing (e.g. are you using sprites, or geometric primitives? Are you drawing images rotated/scaled? Does most of the screen change or just a few small objects? Are you blending many layers?) and perhaps even a screenshot or two; then we can suggest what sort of optimizations are suitable for your particular game.
Don't draw a background, make it an image and set the CSS background-image of the canvas.
Using requestAnimationFrame should help with battery life.
http://paulirish.com/2011/requestanimationframe-for-smart-animating/
Only do a redraw if something has actually changed. If you haven't already, introduce the concept of invalidations. (ie, the canvas is valid so nothing redraws until something moves. Anything moving within the window of the canvas causes the canvas to become invalid, thus needing a redraw)
If you want to be battery friendly you can use Crafty. This game engine is using modern CSS3 technology so it doesn't need to update a canvas all the time. Look at this example game here.
The way you don't want to redraw entire canvas every frame, it only can be the "Dirty-Check" or "Dirty Matrix" algorithms.
Dirty-check seems more efficient than entire redraw. but I think it depends on your render implementation.
it is not necessary to use it if you are using canvas2D to render. Nearly every game has complex sprites and animation. if you use dirty-check, when a part of sprite or background map need to update, you have to figure out what is overlapping this part. and then clearRect this small area of canvas, and then redraw every sprite or map. etc, what is overlapping.
It means your had to run canvas render api more times than normal render implementation because of the overlapping part. And Canvas2d render performance usually does't sounds efficient.
But if you use WebGL, that maybe quite difference. even though I am not family with WebGL, I do knew that maybe more efficient. Dirty-Check should be a good Choice to match your propose.

In AS3, how can I dynamically load and unload sequential SWF animations to the stage seamlessly?

I am working on a project that will have the user seeming to fly in 3D from point to point in an architectural model, based on choices. It is a tree-flow, with everything starting from one point and branching out from there, and it only needs to animate in one direction, which makes things easier.
The thing is that the animations from place to place are C4D animations rendered as PNG sequences, and in total they will be VERY large, so I want to package each segment as an individual SWF and load and unload them dynamically as needed.
I expect the first thing to do will be to see if I can have my upstream guy render them as JPG sequences instead... is that a good idea performance-wise? I imagine it will be in terms of bandwidth.
The main question, however, is how I can dynamically load one of these sequences, have it play and stop on its final frame (over which data and choices will display), and then - based on the user's selection - load and play the next animation seamlessly from the first, without endlessly stacking up loaded clips. When the user goes back a level, I only need to jump to the first frame of the animation, but going forward always involves a smooth flight.
I suspect the solution may have to do with adding, say, to the loader by specific names, then as we transition out, load the next one with a specific name, and then unloadChild() and do whatever other kind of garbage collection I need to do to purge from memory entirely. I want to be as cognizant of memory usage and performance as I can, because at certain spots there will be other images and videos loaded on top of the flight animations.
Does anyone have any ideas about this? I'm sure it's a common need, I've just never done it before, and I want to do this as timeline-free as possible.
Thanks in advance for any advice!
Mattynabib