Responsive layout (media) demo

This page demonstrates using the media attribute on link tags doesn't work with SXG prefetching.

For the context see this article.

1. Open Network tab in Chrome Dev Tools.
2. Enter the device mode by clicking the "Toggle device toolbar" icon located in the action bar at the top.
3. From the dimensions menu, set the "Responsive".
4. Resize the device window to about 1000 pixels.
5. Click the "Prefetch" button.
6. Wait for the SXG cache to fill (up to 1 minute, typically 15 seconds). Continuing without waiting won't break anything, but keep in mind results may not be final and you may need to repeat the next step one or more times.
7. Click the same button again.
8. Observe 2 images are prefetched.
9. Resize the device window to about 500 pixels.
10. Click the same button again.
11. Observe the screen width doesn't impact the number of images prefetched, because 2 images are prefetched again.

CORS errors may appear temporarily. You can ignore them.