Loading - Spiner vs Skeleton

[cdpestitschek]

Hi Paste Team,

I'm current working for Insights and I would like to check if is there any specific guidance around whether to use a Spinner or Skeleton loading recomendation?

Use cases: Inside the cards are graphics (charts, trends etc) and other text and numbers.

Thanks in advance,
Carol

[SiTaggart]

Hi @cdpestitschek

This has come up a couple of times, for example: #1932, and we still don't really have strict guidelines, as it kind of depends on the situation. It might largely be down to the application, the page, the API being called, or just generally the technical constraints placed on the data being shown. Here are some things that you might consider when choosing.

Skeletons might be good for:

• Initial page load when different sections of the page load asynchronously, at different times
• Initial page load if you want to reduce page layout shift once the data loads as the skeletons will roughly be the shape and size of the data to be shown

Spinners might be good for:

• Initial page loads if the page is large and all the data is loaded at once
• Subsequent data loads or asynchronous user initiated actions
• Page transitions or navigation

Ultimately it's going to be up to you and what makes sense for the experience based on any technical constraints you have.

Hope that helps!