Its compared and explained in this article. Seems skeleton screen is a bit better than classic animations.
One of the idea could be also that you use both. So skeleton tree that has animated bars somehow..
Like most things, it depends on the context. Did the user submit a form? Create a project? Make a payment? Each of these options have their own patterns that work well for each use case.
From past experience and user tests, modals with loading indicators increased perceived wait time and frankly, they just feel clunky and inelegant.
The idea is you want to ...
The trivial answer is "as quick as possible".
The user experience research group NNGroup has some relevant information regarding load times. Most relevant to your situation is probably the following.
The 3 response-time limits are the same today as when I wrote about them in 1993 (based on 40-year-old research by human factors pioneers):
I would add somewhere an async counter that shows the amount of downloaded data and total amount of them that's left e.g.
Gathered data from 23 providers of 150 total
Querying for data:
23 / 150
(search results may live update once data is downloaded)
The text content might be different, but wanted to illustrate the main idea.
Don't think of the skeleton component in a literal sense. The "skeleton" doesn't need to be exactly as big or as many as the actual content.
It is used as a placeholder to help the user anticipate where content is yet to load and how/what that content might look like.
Use the skeleton to fill up the empty spaces on the screen where the content would load. ...