ampproject / ampproject/amphtml

AMP-Youtube Placeholder Image Doesn't Work?

Open
#35,718 1 comment 0 reactions 0 assignees View on GitHub
Stale Type: Bug
Dominant language
JavaScript
Stars
14.9k
Forks
4.1k
PR merge metrics
No merged PRs in 30d

Description

### Description

Hi!

Is there a way to lazy load a youtube video? The problem with youtube video is it drops pagespeed mobile score more than 30points. I was thinking using a placeholder image would act as a lazy loading of some sort. Unfortunately it does not.

Can you make it so that the video will only appear after clicking the play button and will only display the placeholder image initially? So pagespeed won't be able to detect youtube video js files which falls under "Reduce unused JavaScript" error.

I hope I'm making sense.

Thank you!

### Reproduction Steps

No youtube video but longer page
https://developers.google.com/speed/pagespeed/insights/?url=https%3A%2F%2Fssptesting.com%2Fampfullwidth%2F

With youtube video but shorter page
https://developers.google.com/speed/pagespeed/insights/?url=https%3A%2F%2Fssptesting.com%2Fampfullwidth%2Fabout%2F

### Relevant Logs

_No response_

### Browser(s) Affected

_No response_

### OS(s) Affected

_No response_

### Device(s) Affected

_No response_

### AMP Version Affected

_No response_

Contributor guide

Open the contributing guide

Research direction

Start with the two PageSpeed reproduction URLs and inspect the AMP YouTube component entry point to understand when the video and its JavaScript load. Done means the initial view shows only the placeholder, clicking the play button reveals the video, and the change is verified against the reported PageSpeed behavior; no source file or test is named in the issue.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript
Domain
frontend, performance
Issue type
Feature
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
28/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.