Add cross-sells to Learn articles

Author: csswizardry

_posts/2019-08-08-time-to-first-byte-what-it-is-and-why-it-matters.md

@@ -182,6 +182,8 @@ the Server Timing
 API](https://medium.com/bbc-design-engineering/server-timing-in-the-wild-bfb34816322e)
 during our time optimising iPlayer.
 
+{% include cross-sell.html %}
+
 It’s vital that we understand just what TTFB can cover, and just how critical it
 can be to overall performance. TTFB has knock-on effects, which can be a good
 thing or a bad thing depending on whether it’s starting off low or high.

_posts/2021-02-26-measuring-network-performance-in-mobile-safari.md

@@ -76,6 +76,8 @@ to be faster and are found in ‘faster regions’.
   <figcaption>Same page, same connection speed, same locale, same release year, different devices.</figcaption>
 </figure>
 
+{% include cross-sell.html %}
+
 ## <q>But, Can’t I Just Emulate?</q>
 
 No.
@@ -235,6 +237,8 @@ testing, I’m running a workshop with Smashing Magazine real soon, and that wil
 make you DevTools experts. You can still [grab
 tickets](https://smashingconf.com/online-workshops/workshops/harry-roberts).</small>
 
+{% include cross-sell.html %}
+
 ## Why Bother?
 
 With iOS generally being faster, and Vitals being entirely Chrome centric, and

_posts/2023-07-01-in-defence-of-domcontentloaded.md

@@ -78,6 +78,8 @@ impact the user experience in other ways, even if not directly.
 
 This is particularly true in the case of `DOMContentLoaded`.
 
+{% include cross-sell.html %}
+
 ## What Does It Actually Mean?
 
 **[The `DOMContentLoaded`
@@ -380,6 +382,8 @@ suitable), then we do actually have some visibility on app state and
 availability. If you are using `defer` or `type=module`, then `DOMContentLoaded`
 might be more useful to you than you realise.
 
+{% include cross-sell.html %}
+
 ## Back to Work
 
 I mentioned previously that the `DOMContentLoaded` event fires once all

_posts/2023-10-17-the-three-c-concatenate-compress-cache.md

@@ -154,6 +154,8 @@ As I said before, we have a few more things to juggle all at once here. We need
 to learn a little bit more about the rest of our setup before we can make
 a final decision about our concatenation strategy.
 
+{% include cross-sell.html %}
+
 ## 🗜️ Compress
 
 The above tests were run with Brotli compression[^2]. What happens when we
@@ -366,6 +368,8 @@ and less about how it’s bundled.
 that isn’t a typo) which takes less than 10ms to compile on a mid-tier
 mobile device.</small>
 
+{% include cross-sell.html %}
+
 ## My Advice
 
 * Ship as little as you can get away with in the first place.

_posts/2024-09-13-optimising-for-high-latency-environments.md

@@ -447,6 +447,8 @@ default, eliminating the need to perform connection and TLS back-to-back. It can
 also provide genuine seamless connection migration as devices traverse the
 internet.
 
+{% include cross-sell.html %}
+
 ## Avoid Incurring Latency
 
 Alright! They were all fairly opportunistic upgrades, but what happens if a) you
@@ -729,6 +731,8 @@ origin-wide policy (which is a feature, not a bug).
 Any latency that can’t be avoided, take the hit once and deal with it.
 Subsequent occurrences should be mooted by virtue of being cached.
 
+{% include cross-sell.html %}
+
 ## So, What Are My Options?
 
 You have lots of options, but do remember that I just spent almost 5,000 words

_posts/2026-04-02-what-is-css-containment-and-how-can-i-use-it.md

@@ -117,6 +117,8 @@ containment—we don’t really need to give it much more attention than that.
 
 Let’s go through each of these in turn.
 
+{% include cross-sell.html %}
+
 ## Layout Containment
 
 `contain: layout` tells the browser that the internal layout of the
@@ -617,6 +619,8 @@ Containment usually does **not** belong on:
 * elements whose whole purpose is to extend beyond their own bounds
   visually.
 
+{% include cross-sell.html %}
+
 ## Closing Thoughts
 
 CSS containment is a feature that can yield massive benefit when well deployed.

_posts/2026-05-07-better-browser-caching-with-no-vary-search.md

@@ -128,6 +128,8 @@ That is the crucial thing to understand: `No-Vary-Search` is not changing the
 URL, and it is not rewriting requests. It is changing how cache matching treats
 the differing query string.
 
+{% include cross-sell.html %}
+
 ## `No-Vary-Search` Syntaxes
 
 The header has a few useful, different forms.
@@ -338,6 +340,8 @@ experimental feature and support is not yet universal, so I would treat it as
 a progressive enhancement rather than a foundational part of your caching
 strategy. That’s exactly what I’ve done with my site for now.
 
+{% include cross-sell.html %}
+
 ## A Nice Fit for Messy Real-World URLs
 
 What I like about `No-Vary-Search` is that it acknowledges how the web actually