What causes elements to move on the page during page loading through transitions?

edit

Elements move on the page during page loading through transitions because the browser first loads the HTML structure of the page and then applies the CSS styles. This means that the elements may briefly appear in their default position or size before the styles are applied, causing a jarring movement as the styles are applied. Additionally, if the elements contain large images or other resources that take longer to load, the layout of the page may shift as those resources are loaded, also causing movement through transitions.