tunepunk

WebGL and Draw Calls (Mobile)

Recommended Posts

Hi.

I'm developing a HTML5 game for mobile using Construct 2. (Yeah I'm a designer not a coder). Well in to production I'm starting to notice performance issues on mobile, especially midrange ones, that should be able to handle more. So I'm thinking it had to do something with the way drawing was done, as the game is pretty optimized otherwize (as far as I'm able to). As I'm not experienced in coding, the only thing I could do was research a little, and check the Draw Calls using a WebGL inspector. I was under the impression that WebGL has pretty much overhead on draw calls, so you would want to minimize those as much as possible? So checking the inspector it looked like a lot was happening every frame. Way more than I would want. Even Bunnymark, had 3 draws for 65000 sprites, and I'm in my game using a total of maybe 300 sprites and getting pretty bad performance on midrange mobiles. On the same phone, bunnymark was easily able to handle 1500 sprite at 60fps, my game could handle maybe 200 static sprites  on screen at 30 fps, and that's why I'm suspecting the rendering.

Anyone here be able to tell from this Gif, if all those calls looks normal to you, and maybe there is something I could do to boost performance on mobile? I just get the feeling that this doesn't look very optimal, but I could be wrong, so want a second opinion before I ask the construct 2 devs to do some optimization on that part.

Thanks a lot for your help.
 

Draw3.gif

Share this post


Link to post
Share on other sites

Even desktops are sensible to the amount of draw calls, but mobiles are much more limited, indeed. The trick here (used by the programs you mention) is that they are using hardware instancing to draw many objects at once with a single draw call. You are making your draw calls individually, and that is why at only 300 sprites you already see a performance hit. With hardware instancing you can easily draw thousands of objects without a great performance hit, but they must be all the same object.

So, resuming: look for "hardware instancing" and you will find what you need.

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...

  • Recently Browsing   0 members

    No registered users viewing this page.