@hi_mayank What I wanted to know (and still am not certain of) is: how does that sync with normal loading events in the DOM? Is it after document ready? After DOM content loaded? Before? Does it just depend? Does it have any synchronicity at all with the normal load on the initial page load?

More to the point: will the initial useEffect callbsck reliably run after deferred scripts have been loaded?

@collinsworth @hi_mayank

When you use useEffect, it runs after the browser paints the screen. It doesn’t block the main thread and allows other tasks to continue while it executes.

@collinsworth @hi_mayank

Example:

On the initial paint you see a placeholder for content.

The async function inside the useEffect told your browser to fetch your medical records.

The browser receives the data.

Following the instructions in your code, the browser updates the dom, cssom, generates a render tree, calculates the layout of each item in the render tree, and finally paints the pixels to your screen. You see your medical records.

@collinsworth @hi_mayank

I think when React ‘renders’ it’s simply instructing the browser to update the dom, cssom, build a render tree, and so on.

@collinsworth @hi_mayank

I obtained the answer from Copilot, not Google, so approach with skepticism. 😀