YouTube Video as Background in React
github.com
github.com
It'll decay over time, but sometimes this has the adverse effect of promoting not-as-interesting posts just because they had a chance of a spot on the front page, attracting more upvotes, while many very interesting articles never got enough time to be upvoted and are lost.
I quite like HN's algorithm, but this is one major flaw of upvote-based systems.
I'm not sure what we're talking about here because it's not very obvious where this number comes from. Is it the YouTube API, excluding React?
If you're thinking of using a React library, we have to assume you're already using React.
Mentioning line count is useless unless you're someone intending to explicitly manage that code. But if so, why stop at 40k?
It seems more constructive to talk about the size impact in megabytes or loading time of requiring the YouTube API just to have video playing in the background vs just just hosting your own static video alongside the html. Of course assuming you already use React.
- no example without cloning
- example provided doesn't run without modifying it (empty video url)
- no tests
- doesn't look maintained (e.g. 3 years old typescript version)
Then looking at index.tsx
- using Class as component (debatable but really not idiomatic anymore)
- weird empty lines and spaces
- weird `this.container` pattern, not to mention the type of it is unsafe
- `aspectRatio` has to be in `x:y` format (including the colon), no way to know that unless you read the code in depth (also weird choice)
- using the anti-pattern of setting derived state (aspectRatio) in this.state, rendering again with a different aspect ratio won't work
- componentWillUnmount does not remove the listener, as calling `.bind` there will create a function that doesn't match the one in componentDidMount
- using `.bind` inline insted of using fat arrows directly when creating class methods
- the weird syntax for `playerProps =`
- hard coding some of the `PlayerVars` props instead of just makin props `PlayerVars & { ... }` to allow passing any props supported by react-youtube
Anyway that's just at a glance, I'm sure cloning the project and trying to use it would reveal a lot more.
This is a serious dependency sandwich. If you want to put a single Youtube video in the background of a div then you don't need thousands of lines of code for managing player controls and state changes. You could probably take 1/10th of that code in youtube-react (the bit that integrates a react component with a 3rd party lib that wants control over the DOM, common pattern with React) and get the same result.
To do a simple k-means clustering on a textual corpus, someone might pull in all of scipy and ntlk which is tens of thousands of lines of code.
I think programmers don’t generally consider dependency size unless it’s on the order of multiple gigabytes.