search

pixijs / pixi-react

Write PIXI apps using React declarative style
https://pixijs.io/pixi-react/
MIT License
2.33k stars 177 forks source link

Use GraphicsGeometry to initialise Graphics to reduce memory footprint #327

Closed vijayth2-cerebras closed 2 years ago

vijayth2-cerebras commented 2 years ago

Description

Graphics component has only a draw method. It will be nice if it also accepts GraphicsGeometry object as a prop. If the prop is available, the draw function will get a Graphics object created from the GraphicsGeometry object. This helps in reducing the memory footprint.

Steps to reproduce

Playground without optimisation - https://www.pixiplayground.com/#/edit/Oq-cKLUW9M_Ar5Vykdk-8 Playground with optimisation - https://www.pixiplayground.com/#/edit/1gOysJgodOn7sDUvJlPIx

The first one uses a memory of 250MB. The second one optimises and uses 20MB. (From the Memory tab in Chrome DevTools)

inlet commented 2 years ago

Hi Vijay

Thanks for contributing to the project. Yes we could add a geometry prop that will set new Graphics(geometry) in the constructor. This same graphics will then be passed to the draw method.

Can you please share a snippet how you would approach this in plain PIXI/javascript, thanks!

inlet commented 2 years ago

Also feel free to create a PR with the fix

inlet commented 2 years ago

Hi @vijayth2-cerebras, any updates on this?

vijayth2-cerebras commented 2 years ago

Sorry got busy with something else. I will raise a PR shortly.

From: Patrick Brouwer @.> Sent: Tuesday, March 29, 2022 12:32:19 PM To: inlet/react-pixi @.> Cc: Vijay Thirugnanam @.>; Mention @.> Subject: Re: [inlet/react-pixi] Use GraphicsGeometry to initialise Graphics to reduce memory footprint (Issue #327)

Hi @vijayth2-cerebrashttps://nam10.safelinks.protection.outlook.com/?url=https%3A%2F%2Fgithub.com%2Fvijayth2-cerebras&data=04%7C01%7Cvijay.thirugnanam%40cerebras.net%7Ccfce7dd6dcd343bd7b9e08da1152110b%7C16c409e7e5a24663a88467e3ba571505%7C0%7C0%7C637841341419345002%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C3000&sdata=I8A%2BIz5wn6ZO4ty7Bv11%2FFt6byI%2F08EyhykCLayAJAc%3D&reserved=0, any updates on this?

— Reply to this email directly, view it on GitHubhttps://nam10.safelinks.protection.outlook.com/?url=https%3A%2F%2Fgithub.com%2Finlet%2Freact-pixi%2Fissues%2F327%23issuecomment-1081487910&data=04%7C01%7Cvijay.thirugnanam%40cerebras.net%7Ccfce7dd6dcd343bd7b9e08da1152110b%7C16c409e7e5a24663a88467e3ba571505%7C0%7C0%7C637841341419502306%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C3000&sdata=%2BOTZBN%2BuuqOEHrloPhRM8YsUYEl1Fh1VgdurXFBxF%2F8%3D&reserved=0, or unsubscribehttps://nam10.safelinks.protection.outlook.com/?url=https%3A%2F%2Fgithub.com%2Fnotifications%2Funsubscribe-auth%2FAXEKXIHK3FFDGF4MHUNTH7DVCKTHXANCNFSM5P54SAWQ&data=04%7C01%7Cvijay.thirugnanam%40cerebras.net%7Ccfce7dd6dcd343bd7b9e08da1152110b%7C16c409e7e5a24663a88467e3ba571505%7C0%7C0%7C637841341419502306%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C3000&sdata=8%2BEG0gXtCcKdQjP3XoEJkcXcizSB%2FdFKPAHF5v1RbTM%3D&reserved=0. You are receiving this because you were mentioned.Message ID: @.***>

inlet commented 2 years ago

Thanks Vijay that would be great!

inlet commented 2 years ago

Fixed #334