What is block preloading called and when is it needed?

Question

User interface

How does is called?
For example, a weak Internet, a person enters the site and already sees the location of the blocks (photo from the news site):

Should the designer also provide the layout designer with the layout of the download? When is this approach really justified? How does this affect page speed?

Answer 1

The UI placeholders approach is justified when the content for ready-made container blocks is loaded by a JS script after loading the main markup via AJAX in synchronous or asynchronous modes.
For example, content is loaded via includeHTML .
This is how you can make holders: https://jsfiddle.net/d1pzay6k/
1. Competent critical CSS inline in the code: you can create this
2. jQuery Lazy Load
3. You can prepare placeholders for UI in SVG with a tracer: imagetracerjs .