YouTube Embed
Code Generator Page-Weight Meter
Every option you want — autoplay, loop, start/end, captions, no-cookie mode — with a live preview and the argument developers actually need: the page-weight meter shows what your configuration costs. A classic iframe ships ~1.2 MB before anyone presses play; the lite-youtube output cuts ~1.1 MB and 17 requests.
- ● Page-weight meter: iframe vs lite
- ● Live player preview
- ● No-cookie GDPR mode
- ● iframe · lite-youtube · React
New to this? Read the guide before you start.
lite-youtube saves ~1.1 MB (96%) and 17 requests on load — 23.4s → 1s on slow 3G.
Configure autoplay, mute, loop, start/end, captions, controls and privacy mode with a live preview — then copy the iframe, lite-youtube or React version.
no-cookie mode ships enabled — the player sets no tracking cookies until playback. Your GDPR consent banner will thank you.
Loop quietly requires playlist=<id>; autoplay requires mute. The generator applies YouTube's quirks so the embed actually behaves.
The lite-youtube output defers ~1MB of player JavaScript until the visitor clicks — the single biggest embed speedup available.
No signup, no watermark. All client-side — your URL never leaves the browser.
Reference
What a YouTube iframe actually loads
The meter's numbers come from this bill of materials — what the embedded player fetches before anyone presses play. Typical, rounded figures for a cold cache; your exact numbers vary by region and A/B flags, the proportions don't.
| Resource | Classic iframe | lite-youtube |
|---|---|---|
| Player JavaScript (base.js) | ~800+ KB | 0 until click |
| Embed document + player CSS | ~250 KB | 0 until click |
| Thumbnail image | ~50 KB | ~45 KB |
| Facade script | — | ~3 KB |
| Tracking / beacon requests | several (fewer with no-cookie) | 0 until click |
| Total before play | ~1.2 MB · 20+ requests | ~50 KB · 3 requests |
How to
Embed a YouTube video — without the megabyte
Watch, Shorts or youtu.be — timestamps in the link (?t=42) pre-fill the start time automatically.
Autoplay, mute, loop, start/end, captions, controls, aspect ratio, no-cookie privacy — every quirk handled (loop needs playlist=, autoplay needs mute).
The page-weight meter prices your configuration: classic iframe vs lite-youtube, in KB, requests and slow-3G seconds.
Responsive iframe for anywhere, lite-youtube for speed, or a React component for Next.js and friends.
Who it's for
Built for the people who answer for page speed
Developers get correct code, not copied code: loop silently requires playlist=<id>, autoplay requires mute, and the responsive wrapper uses aspect-ratio instead of the old padding hack.
SEO & performance teams get the argument in numbers: an embedded video is routinely the heaviest thing on an article page, and the meter turns "we should use a facade" into "we save ~1.1 MB per pageview".
Bloggers & editors paste the iframe into any CMS with privacy mode already on — no cookie banner surprises from a single embedded tutorial.
Docs & course sites with ten videos per page are the extreme case: ten classic iframes ≈ 12 MB before anyone plays anything; ten lite embeds ≈ half a megabyte.
Two ways to embed
Classic iframe vs lite-youtube facade
Same video, same look before the click — wildly different cost. The right choice depends on who controls the page and how many embeds it carries.
The classic embed
YouTube's own player, loaded eagerly. Works everywhere HTML works, zero dependencies, full feature set from the first paint.
Choose it when
CMS / no-JS control— you can paste HTML but can't add scripts to the pageautoplay heroes— the player must be live immediately (muted, by browser rule)one embed, fast page— a single iframe on an otherwise light page is survivable
The facade
Renders the thumbnail and a play button; the real player loads only when clicked. Visually identical until interaction, ~96% lighter until then.
Choose it when
Core Web Vitals— LCP and TBT on article pages; embeds are the usual culpritmany embeds— docs, courses, playlists-as-pages: savings multiply per videomobile traffic— the slow-3G line in the meter is the mobile reality check
Needs the ~3 KB lite-youtube-embed script once per page — the snippet's comment links it.
Which should I use?
If you can add one script to the page — lite-youtube, always: nothing else buys a megabyte per pageview for three kilobytes of effort. If you're pasting into a locked-down CMS — the iframe with no-cookie mode on, and keep it to one per page where you can.
One tool, every intent
However you searched for it, this is the page
People land here wanting an iframe embed code, a responsive YouTube embed, an autoplay embed or the no-cookie version. One builder covers all of it — configured, previewed, priced.
Responsive without the padding hack
The old 56.25% padding-bottom trick is dead — every output here uses CSS aspect-ratio, works at any width, and switches cleanly to 9:16 for Shorts embeds.
Autoplay that actually plays
Browsers block un-muted autoplay everywhere. The generator enforces the only legal combination (autoplay + mute) instead of letting you copy an embed that silently does nothing.
No-cookie mode, on by default
youtube-nocookie.com defers tracking cookies until playback — the GDPR-friendlier default for European sites, and a couple of requests lighter pre-play, as the meter shows.
Start & end — deep links inside the player
Clip the embed to the segment that matters with start/end seconds — a ?t=42 in the pasted URL pre-fills the start automatically.
Also known as
- youtube embed code generator
- youtube embed generator
- youtube iframe embed code
- embed youtube video
- youtube nocookie embed
- responsive youtube embed
- youtube embed autoplay
- lite youtube embed
- youtube embed react
- youtube embed without cookies
- youtube embed start time
- fast youtube embed
Related YouTube tools
Keep the workflow going
Embedding a video? Grab its thumbnail for the article header and check its stats before you feature it.
FAQ
Frequently asked questions
How do I embed a YouTube video on my website?+
Paste the video URL above, flip the options you want (autoplay, start time, privacy mode…) and copy the generated iframe into your HTML. The live preview shows exactly what visitors will see.
What is privacy-enhanced (no-cookie) mode?+
It serves the player from youtube-nocookie.com, which doesn't set tracking cookies until the visitor actually plays the video. It's the GDPR-friendlier default for European sites and blogs — we enable it by default.
Why doesn't autoplay work with sound?+
Browsers block autoplay with audio. If you enable autoplay, the generator automatically enables mute too — that's the only combination browsers allow.
What is the page-weight meter?+
The number developers actually argue about: a classic YouTube iframe transfers roughly 1.2 MB across ~20+ requests before anyone presses play — mostly the player's base.js. The meter compares that against the lite-youtube output (~50 KB, 3 requests) for your exact configuration, including what it means on a slow 3G connection. Figures are typical and rounded; the reference table itemises them.
What is the lite-youtube snippet?+
A web component that renders just the thumbnail until the visitor clicks — the full player (and its ~1MB of JavaScript) loads only on demand. It's the fastest way to embed YouTube and the biggest Core Web Vitals win available on a video-heavy page; you need the lite-youtube-embed script on your page.