Jump to content
Search Community

Riddle me this...

Urala test
Moderator Tag

Recommended Posts

Hi guys,

 

From following some of the great examples on the forums I've created a particle animation. I forked code from Chris' example here and updated it to use the latest GSAP and 2DPhysicsPlugin. I added a mouse move function to draw particles as you move. Overall I'm really happy with the result but I noticed something weird...

 

When devtools (Chrome) is open the number of particles generated is far greater than when devtools is closed. It seems the createMagicDust function must be getting called more? it's hard to debug since I can't view the console when devtools is closed. It doesn't behave the same in Firefox or Safari.

 

This behaviour can be seen on the pen I have linked, the performance struggles when devtools is open.

See the Pen ExbyvjK by suth_a (@suth_a) on CodePen

Link to comment
Share on other sites

Welcome to the forums @Urala

 

I don't see any difference with my dev tools open. For performance, you should probably remove dead sprites from the array as it's just going make the render loop take longer and longer.

 

Or you can try to recycle sprites like I do here. See the active and cached particle count.

 

See the Pen RLOzxo by osublake (@osublake) on CodePen

 

It also looks like you are calling createShape on every mouse move, which looks like an expensive call. The key to performance is to try to reuse as much you can. Looks like you already found one of my canvas threads, but here's another.

 

 

  • Like 2
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

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