Types of Loading components

Loading components present the user with temporary UI elements while data is being fetched. Their purpose is to inform the user that the process to retrieve content is ongoing, and will take an indeterminate amount of time.

Loading components allow you to present the user with UI while data is being fetched.

SkeletonBlock components allow you to quickly mimic the layout of a UI when the data is not ready yet.

In essence it is just a box that you can set width and height on and it will be shown as a light gray box on the page.

You can create realistic layouts using the same components as you would normally use. Creating more complex layouts with SkeletonBlock's help avoiding layout thrashing when the data is received and can be populated and the skeleton layout is replace with the real layout.

If you don't require an entire layout but instead just want to show a user that some action is currently pending to be completed a loading spinner may be a better option.

You can change the size of the Loading component by passing in the size prop