Hybrid Astro UI

A lightweight YouTube embed component that loads video thumbnails initially and only loads the full YouTube player when clicked. This approach significantly improves page performance by deferring the loading of heavy YouTube iframes until user interaction. The component is fully accessible, supports keyboard navigation, and uses YouTube's privacy-enhanced nocookie domain.

Install

pnpm dlx hybrid-astro-ui@latest add lite-yt
npx hybrid-astro-ui@latest add lite-yt
yarn dlx hybrid-astro-ui@latest add lite-yt
bunx hybrid-astro-ui@latest add lite-yt
---
import { LiteYT } from "@/src/components/hybrid-astro-ui/lite-yt"
---
<LiteYT class="max-w-100" videoid="M7lc1UVf-VE" />