On the front end, we currently render a lot of things that don't have a fixed height, which causes layout jumps during render. For example in the articles block this can be very noticeable as it often has a long delay before the block starts rendering.

We should investigate where we need to add a placeholder, how the placeholder should work/look like. As a first iteration, we could do that for one of the new WYSIWYG Covers block styles.

Resources

• How the Facebook content placeholder works
• Codepen prototype

Assumptions

• Take Action style is the most popular style (used in Take Action pages). We could target creating a placeholder based on the height of that particular style as a first iteration.

Requirements

• Build the placeholder for our case. Either for one style or for all of them if that's less complex.
• This will be build on top of the Beta version.