Transparencies affecting performance heavily

Hi,

I’m in the final stages of my first game for iOS / Android and I’m having a problem with transparent images.

All the images (with the exception of the transparent ones) are set to Mobile/Diffuse.

Basically my game is a 2D sidescroller with three layers:

  • The front one is the game layer, where the action happens
  • The middle one is the transparent layer
  • A back layer as a backdrop to the game

Here’s how the transparent game object is set.

Here’s the output of the profiler when the middle layer is set as Transparent/Diffuse

----------------------------------------
iPhone Unity internal profiler stats:
cpu-player> min: 2.6 max: 97.5 avg: 41.1
cpu-ogles-drv> min: 0.5 max: 1.6 avg: 0.9
frametime> min: 20.4 max: 100.9 avg: 53.6
draw-call #> min: 13 max: 16 avg: 14 | batched: 0
tris #> min: 640 max: 646 avg: 642 | batched: 0
verts #> min: 443 max: 455 avg: 448 | batched: 0
player-detail> physx: 0.6 animation: 0.0 culling 0.0 skinning: 0.0 batching: 0.0 render: 38.2 fixed-update-count: 1 … 5
mono-scripts> update: 1.0 fixedUpdate: 0.0 coroutines: 0.0
mono-memory> used heap: 274432 allocated heap: 356352 max number of collections: 0 collection total duration: 0.0
----------------------------------------

And here’s the output of the profiler when the middle layer is set as Mobile/Diffuse (i.e.: Non-transparent)

----------------------------------------
iPhone Unity internal profiler stats:
cpu-player> min: 2.1 max: 22.2 avg: 10.2
cpu-ogles-drv> min: 0.6 max: 2.1 avg: 0.8
frametime> min: 32.1 max: 34.5 avg: 33.3
draw-call #> min: 14 max: 14 avg: 14 | batched: 0
tris #> min: 840 max: 840 avg: 840 | batched: 0
verts #> min: 564 max: 564 avg: 564 | batched: 0
player-detail> physx: 0.4 animation: 0.0 culling 0.0 skinning: 0.0 batching: 0.0 render: 8.3 fixed-update-count: 1 … 2
mono-scripts> update: 0.8 fixedUpdate: 0.0 coroutines: 0.0
mono-memory> used heap: 237568 allocated heap: 356352 max number of collections: 0 collection total duration: 0.0
----------------------------------------

As you can see the numbers in general are reasonable (14 drawcalls/frame, 840 tris and 564 verts…)

But If I understood correctly, without transparency I’m running at approx. 30 fps, with transparency at 20 fps, is that correct?

Any suggestions on how I can user the transparent layer without having such an impact on performance?

Thanks in advance,

Jay_Santos

I have found that you can use transparent images as long as they don’t take up much real estate on the screen. Particularly bad is having a large image with transparency, and then transparent objects over top of it. For your cityscape looking image, try to make the shader a Mobile/Background shader with no transparency.

You could do that by using a flat color for the sky that matches the color in your image. Or, use geometry to cut out the shapes of your buildings, allowing you to use a non-transparent shader and make the background a non-transparent gradient.

I would be interested in hearing other’s suggestions. Seems like a common problem for 2D side-scrollers.

cutting holes into meshes to minimise transparency but add vertices is nearly always faster - by far.

Also, Vertex lit (one directional light) is faster than diffuse by far.

I’ve fixed it using the Unlit/Transparent shader. Everything’s working smoothly now

So in a case like that, you would make a square “hole” somewhere in the flat face? How would you go about making them in a simple flat surface such as a wall?

Part of the problem here is you aren’t using a moble shader. You’re using an expensive to render desktop shader. - you need that converted to mobile for speed, since it’s probably doing a ton more work than it needs to.

Well you use mobile shaders. my comment was largely directed at flat things.

Ya, i just did that too, not sure how much of a difference though.

Is it a shader in Mobile/ ? if not, then it’s slow.

no hip, its not. what good choice in mobile?

I just switched to Mobile/Particles/Multiply for my trees.

For alpha blended stuff use mobile/particles/alpha blended - it will use the alpha channel of the texture and be solid where you want it.

Alpha - use png alpha channel or photoshop alpha channel etc
Multiply - the pixel in the texture’s value is multiplied by the pixel it is drawn over
Additive - the pixel in the texture is added to the colour of the pixel it is drawn over