Set up app after fetching data

[IAmNelu]

Hello I am having some issue understanding how to delay the init of the app. I want to do something similar to this small mock up, but it's not working:
export const MyPixiWrapper = () => {
const [myData, setData] = useState();

useEffect(()=>{
//fetch data and then

setData(DATA_FETCHED);

}, []);

return
    {myData &&
        <Application resizeTo={window} backgroundColor={0xfee685}>
            <MyComponenent objects={myData} /> 
        </Application>
    }
}

}

I want to start rendering everything only after I have my data properly initialized. Am I missing something?
This is just an extract, I can provide more details on my actual situation, but I feel like I am missing something.
I am using:
"dependencies": {
"@pixi/react": "^8.0.0",
"pixi-viewport": "^6.0.3",
"pixi.js": "^8.8.1",
"react": "^19.0.0",
"react-dom": "^19.0.0"
}

Any suggestion is well appreciated 🙂

[trezy]

When you say it's "not working," what exactly do you mean? Are there any errors? What are the symptoms indicating this code isn't working?

[thejustinwalsh]

@IAmNelu posted on an example repo on discord, and I forked it and got it working...
IAmNelu/testing-pixi@main...thejustinwalsh:testing-pixi:main

I am unsure if there is an issue with trying to conditionally render Application specificlly, but there are a lot of things that one may not expect to happen, if you mount Application and do not wait for the onInit callback.

Maybe we can improve the documentation around how the renderer or other members of the app may not be accessible until after onInit has been called... i.e. renderer, or any getter derived from the renderer (width/height) etc.

Additionally, there might be some more room to improve docs around how to use PixiViewport, or any other pixi component that may need to be subclassed for the best results.

[trezy]

Yup, I can deffo agree with that. We really need to get started on adding a Guides section to the docs. I created a couple of new issues to cover that work.

• [DOCS] Guide: Getting Started #589
• [DOCS] Guide: Using Pixi Viewport #590