Jump to content

A little thing about performance


Recommended Posts

Hi everyone, 

I'm new with PIXI, and I'm wondering this situation. 

I want to make a rectangle, and its border can be changed when we hover. I tried search on Google and almost people say I should redraw the rectangle everytime mouse over or out the rectangle to change its border. Like this:


rect.mouseover = function(){    rect.clear();    rect.lineStyle(1, 0x00ffff);    rect.drawRect(...);}

But then I ask myself why don't create another rectangle on top of the first rectangle, set it the color we want, make it invisibe and only show it when hover. By doing this we don't have to redraw the original rectangle everytime mouse hover. This is good for optimization, I think.


Does anyone can explain me this is good or bad?

Thank you for your answer.

Screen Shot 2018-11-23 at 18.07.40.png

Screen Shot 2018-11-23 at 18.07.43.png

Link to comment
Share on other sites

That is simple, the best way to do that is to draw a rectangle and another one as soon as it's created. That will save you a lot of memory when having to redraw every time you hover on it. You just need to hide and show it or update coordinates (if necessary).

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...