Optimizing Tweets for Zero CLS Penalties

Adam Taylor
Tue, 08 Jun 2021 23:47:34 +0000
Twitter, Core web vitals, Cls score

Tweets are a very popular embed for media sites. They can contain lots of information and drive lots of traffic, and we have worked very hard to make it super easy for writers and editors to embed them by simply dropping a link into our Add Media Bar.

But tweets are not all the same size, and because of the way Twitter has coded them, they dynamically change their height as their elements come through, i.e., a photo, video, or screenshot can all change the size. These size changes cause penalties for cumulative layout shift (CLS), one of Google's Core Web Vitals.

We are always introducing new updates to our platform, and we've recently rolled out a platform-wide update that optimizes tweets to dynamically set the height of the tweet embed. To solve this, we do a server-side call when a user embeds the tweet to find the exact height and set it in the embed code. So this new behavior will work for all tweets that get embedded using the URL upload technique described in this post. This update will affect new tweets embedded and moving forward, but not backwards to everything that you've embedded previously.