Skip to content

Replace ADP home infographic GIF with video#187

Open
JakeSCahill wants to merge 1 commit into
mainfrom
adp-infographic-video
Open

Replace ADP home infographic GIF with video#187
JakeSCahill wants to merge 1 commit into
mainfrom
adp-infographic-video

Conversation

@JakeSCahill

Copy link
Copy Markdown
Contributor

What & why

The home page's "Build agentic data flows" card used adp-infographic.gif (~4.3 MB, 960×320), loaded eagerly as the LCP element. Lighthouse flagged it under "Use video formats for animated content" (~3.96 MB potential saving) and "Properly size images".

This replaces the GIF with much smaller video formats:

Asset Size
adp-infographic.webm (VP9) 20 KB
adp-infographic.mp4 (H.264) 46 KB
adp-infographic-poster.jpg 19 KB
adp-infographic.gif (removed) 4.3 MB

~98% reduction on the home page's largest asset.

Companion PR

The markup change (swap <img><video>) lives in redpanda-data/docs-ui#394. Both must land together — the UI bundle references .webm/.mp4/poster that this PR adds.

Testing

Built docs-ui with the new markup, pointed local-antora-playbook.yml at the bundle, ran npm run build-local, and confirmed the home card autoplays the WebM (muted, looping) with the poster shown pre-play, scaling correctly on desktop and mobile.

🤖 Generated with Claude Code

Convert the 4.3 MB adp-infographic.gif to WebM (20 KB) + MP4 (46 KB)
with a JPG poster (19 KB) and remove the GIF. Pairs with the docs-ui
markup change that swaps the <img> for a <video> element.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
@JakeSCahill JakeSCahill requested a review from a team as a code owner June 23, 2026 07:55
@netlify

netlify Bot commented Jun 23, 2026

Copy link
Copy Markdown

Deploy Preview for redpanda-documentation ready!

Name Link
🔨 Latest commit fa4e208
🔍 Latest deploy log https://app.netlify.com/projects/redpanda-documentation/deploys/6a3a3be27572300008e1e013
😎 Deploy Preview https://deploy-preview-187--redpanda-documentation.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.
Lighthouse
Lighthouse
1 paths audited
Performance: 87 (🟢 up 15 from production)
Accessibility: 92 (🔴 down 2 from production)
Best Practices: 92 (no change from production)
SEO: 83 (no change from production)
PWA: -
View the detailed breakdown and full score reports

To edit notification comments on pull requests, go to your Netlify project configuration.

@JakeSCahill JakeSCahill requested a review from micheleRP June 23, 2026 08:02
@JakeSCahill

Copy link
Copy Markdown
Contributor Author

Companion PR (UI markup — swaps the <img> for a <video> element): redpanda-data/docs-ui#394

⚠️ Both PRs must merge together — the UI bundle references the video assets added here.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant