Comments (7)
A +1 to this request. First time playing with lite-youtube
has been this week and it's awesome.
I'll add that a custom poster image could additionally be a big performance win since authors could optimize the image size for the context of the player and also (presumably) the lite-youtube
element could reduce the number of initial requests to YouTube's server by not requesting the poster image.
from lite-youtube.
The reason I didn't add that feature as part of #28 is because I'd tepid about breaking the contract of expectation.
The existing YouTube Embed API doesn't allow for this functionality and I get why: you're overriding something the author explicitly set on the video itself and it could lead to bait-and-switch embeds—e.g. a thumbnail that doesn't match the content, ala a Rickroll but more nefarious.
On the other hand, authors may want this functionality because YouTube does weird things to the thumbnails as it is and people may just want a better thumbnail.
Which is to say, I already have a branch locally that does this via a slot
but I have not finished wrestling with the good, bad, and sneaky. :-)
from lite-youtube.
Hi Justin, thanks so much for your reply. I'd not even considered nefarious usage, so that's an interesting thought. I guess you're absolutely right - it could be something that somebody might abuse. I do think though that if the aim of the implementer was to deceive there are plenty of ways they could do that.
For me it comes down to quality - both visual and technical. Our builds just couldn't get the design fidelity we need using YouTube's thumbnails, and similarly not being able to optimise the poster image we lose an element of control over the performance of the page. Our videos can be quite large on the page so both of these things are pretty important; fundamental, even.
I totally get where you're coming from in wanting to maintain purity with the YouTube core service, but I'd vote for ignoring the Rick-rollers and sneaks - those folks will always find a way - and trust that most people just want to make even more awesome websites with your awesome web component :)
Genuinely though, do what you gotta do, and thanks again for your time regardless - it's much appreciated.
from lite-youtube.
Hello @setsqr
You could modify this lines, if it would be helpful for you, in your lite-youtube JS/TS file
const posterUrlWebp = `https://i.ytimg.com/vi_webp/${this.videoId}/${this.posterQuality}.webp`;
const posterUrlJpeg = `https://i.ytimg.com/vi/${this.videoId}/${this.posterQuality}.jpg`;
from lite-youtube.
Thanks @CryptorClub, that helps a little with the technical part of the problem, but doesn't overcome the fact that YouTube can (/usually does) generate really gnarly images that don't do the video any justice, visually.
from lite-youtube.
+1 for this
from lite-youtube.
+1 for this
from lite-youtube.
Related Issues (20)
- Adjust warmConnections if using nocookie attribute, add profile image domain HOT 2
- Bug: Poster Image Not Loading @ certain Resolutions
- lite-youtube <-> prevent Cookie/Local storage if user selects "Deny" from Consent Management System Modal || EU GDPR HOT 1
- Support for the anonymous attribute HOT 1
- Package should specify that it's a module
- Poster image still gets lazy-loaded when setting posterloading to eager
- Jpeg fallback not used when webp is missing HOT 5
- Use official YouTube logo HOT 1
- Pause videos not in view
- errors in Next.js due to export HOT 2
- Best method to avoid Cumulative Layout Shift? HOT 2
- CDN: Uncaught SyntaxError: Unexpected token 'export' (at lite-youtube.js:1:1) HOT 5
- Google indexing errors HOT 6
- Not working in nuxt 2 HOT 4
- Probable bug wrt capitalization HOT 3
- Doesn't work well when aspect ratio is different from 16:9
- Remove `#frame::before`? HOT 3
- Poster Fallback JPG doesn't work in 1.5.0 with FF HOT 6
- Thumbnails not rendering HOT 3
- Uncaught (in promise) Error: Orphaned iframed HOT 3
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from lite-youtube.