Creating an efficient background scene

Hi,

I've been pondering what would be most efficient way to create (more or less) random background for a space setting? The size should fill full-screen 1920x1080. I also plan to have some small parallax scrolling/scaling on some layers to give some sense of depth but otherwise these would be static.

Here are few options I've been thinking:

a) Single sprite, that includes the whole background. Not really randomized though.

b) Few objects (star shapes, nebula's and whatever)that are around 256x256 in size. These textures are spawned on different layers / random locations and rotated/scaled randomly. Amount of objects rises a lot, but textures are smaller and some are reused. For randomizing nebula's I'd use a single sprite with few different animation frames that have different images in them. The frames would be randomly picked.

c) The canvas plugin. It could be used to generate some gradients and whatever to liven up the scene, but I'd imagine using sprites is more efficient in static backgrounds anyway?

d) Some combination of above. Single gradient/foggy overlay to give space some 'texture' rather than just being a black space (see

this for what I mean) randomly generated nebula's and star shapes on top of it to give the randomness.

Few questions: Is using canvas plugin more efficient in someway? I'd like to have a single gradient shape over the whole layout on some occasions, does it matter if I have a single image, big image partitioned as multiple sprites or if I am using the canvas plugin?

If anyone knows or has decent guesses to these questions I'd appreciate a lot! :)

I'd avoid a single sprite (especially in 1920) it would take a lot of memory and a long time to download, and I guess you wouldn't have only one of those.

Smaller sprites you can "bank" in a single animation and display only a single frame out would be a good solution.

You could also add a "pattern" in a TiledBackground. (That's part of the solution I used in this shoot-'em-up tutorial)

I hope this helps.

Thanks, that is really useful technique I will integrate into my project, makes this a whole lot easier! :)

If you want a gradient, you can make a tiny image then stretch it as far as you want - it will still look smooth.

bump for thanks sqiddster

California heh, no worries, glad I could help ;)