Jump to content

Poor performance of base layer being rerendered


Recommended Posts

Hi all,

I'm relatively new to Pixi and searching for a good solution. I'm doing a PacMan like game. I have a 32x32 grid where I currently have 2 types of cells: Wall, Space. Walls are adaptive, meaning it knows if another wall is being it's neighbour and generates curve for corners for example. I'm using drawRectangle for vertical and horizontal tiles and drawLine with bezier for the corners. At the end I only use simple graphics, 2-4 per cell.

This works fine until the point I add DropShadowFilter. I know, filters are expensive, but my goal is to have a glowing shadow around the wall that's dynamic and changing it's color (I think i'll never going to be able to do this in a performant way). The problems is that the grid always get's rerendered.

I can live without making it glow and just cache it. But it screws up the position of both the graphics and the shadow.

Is having another WebGL context underneath the player's is a viable option? How about performance? How about it on mobile?

Or is it possible to "freeze" the map conatiner without being rerendered (not as bitmap)? (I think I'll get a simple `no` for this :))

What other solution would fit to this case (I can't use texture, map is dynamic both color wise, size wise, etc).

Thanks in advance.

Link to comment
Share on other sites

cacheAsBitmap and other solutions are based on RenderTexture. Its easier to use RenderTexture than find all the bugs in cacheAsBitmap. Learn how to use it, there are examples in examples page, and there is reference code in pixijs sources: https://github.com/pixijs/pixi.js/blob/dev/packages/core/src/AbstractRenderer.js#L251

As for how to make DropShadow/Glow/blur-based filters in general, there are options, but all of them require knowledge in blur filters. I have two general solutions are faster than current DropShadow, but I dont have time to publish it for last 3 months :( There were 10 requests like yours and i still dont have time to publish it, I'm sorry.

Or is it possible to "freeze" the map conatiner without being rerendered (not as bitmap)?

DropShadow is processing bitmap. There are no vector shadows in pixijs, like there were no vector shadows in Adobe Flash. You can use alternatives for dropshadow, like https://pixijs.io/examples/#/filters-advanced/pixie-shadow-filter.js , or make your own multi-pass filters that is juggling temporary renderTextures.


Link to comment
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.

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.


  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Create New...