[Skeleton] Built in support for delayed appearance

Duplicates

• I have searched the existing issues

Latest version

• I have tested the latest version

Summary 💡

This issue is meant to discuss the need for a built-in support for delaying the appearance of a skeleton.

Examples 🌈

You can find an example in https://mui.com/material-ui/react-progress/#delaying-appearance.

Motivation 🔦

With @DanailH, I believe that we have found a valid use case for delaying the appearance of the skeleton within a data grid: https://github.com/mui/mui-x/pull/5214#discussion_r953719829. In some cases, the rows of the data grid load so fast that we see a flash of a skeleton. It might be better to delay the appearance of the skeleton to only the cases where the data is slow to load. For instance, when loading the rows in Notion, you never see a skeleton, only a while background.

So, I wonder if it makes sense to add a prop to have this behavior built-in in MUI Core.

In the case of the data grid, there is another dimension to consider that could help with the problem: overs canning (loading rows outside of the viewport in anticipation). But even with this, I think that this issue is still relevant.

cc @gerdadesign

Start with the delayed-appearance example in the Material UI progress documentation and the linked MUI X data-grid discussion. Determine the intended built-in Skeleton API and how it should interact with fast-loading rows; the issue does not identify files, tests, or a settled definition of done.