O que é pré-carregamento de vídeo?
O pré-carregamento de vídeo é uma indicação que informa ao navegador ou player quanto de um recurso de mídia buscar antes de o espectador iniciar a reprodução. No elemento HTML video, o atributo preload aceita none, metadata ou auto, e o navegador pode ignorá-lo.
Como funciona o pré-carregamento de vídeo
O padrão HTML define preload nos elementos audio e video como uma indicação com três palavras-chave. none sinaliza que o autor não espera que o espectador precise da mídia ou que o servidor deseja minimizar o tráfego desnecessário. metadata sinaliza que é razoável buscar as dimensões, a lista de faixas e a duração, e possivelmente os primeiros quadros. auto, ou o atributo com um valor vazio, permite que o navegador priorize o espectador, podendo até baixar de forma otimista o recurso inteiro. Quando o atributo está ausente ou é inválido, o comportamento padrão é definido pela implementação, e o padrão HTML sugere o comportamento de busca de metadados. Um navegador pode ignorar completamente a indicação, por exemplo, devido a preferências explícitas do usuário ou à conectividade disponível. O valor pode ser alterado após o início do carregamento, de modo que uma página com muitos vídeos pode usar none inicialmente e mudar um player para auto assim que o espectador iniciar a reprodução.
Informações essenciais
- Os valores são indicações, não limites de bytes. Com
metadata, o padrão HTML diz que um navegador normalmente obterá alguns quadros além das dimensões, da lista de faixas e da duração; comauto, ele pode baixar o arquivo inteiro. Nenhum valor limita a transferência, então meça as requisições que cada navegador de destino faz antes da reprodução. - O comportamento efetivo pode diferir da marcação.
autoplaypode se sobrepor apreloadquando o navegador permite a reprodução automática, porque um vídeo em reprodução precisa armazenar dados em buffer independentemente da indicação, e os navegadores aplicam suas próprias políticas. O código-fonte do elemento de mídia do Chromium, conforme consultado em outubro de 2026, reduzautoparametadataem conexões celulares e tratanonecomometadataassim que um script chama o métodoload()do elemento. Listas de regras publicadas ficam desatualizadas: a regra de Data Saver no artigo do web.dev sobre pré-carregamento não está nesse código-fonte. - O atributo não controla players baseados em Media Source Extensions, como o hls.js, porque a própria aplicação busca a mídia e a adiciona ao elemento. Use a configuração do próprio player. Por padrão, o hls.js carrega automaticamente a playlist do nível de qualidade e os primeiros fragmentos assim que o manifesto é analisado; com
autoStartLoaddefinido comofalse, esse carregamento aguarda uma chamada astartLoad(). Nos dois casos,loadSource()solicita o manifesto, que o hls.js analisa para identificar os níveis de qualidade e as faixas disponíveis. Para não solicitar nada do fluxo antes da reprodução, adie tambémloadSource(). - Os navegadores podem solicitar um arquivo de mídia em intervalos de bytes; o padrão HTML deixa a escolha do intervalo a cargo da implementação. Em um MP4 não fragmentado, o índice geralmente é gravado no fim do arquivo, a menos que o codificador o tenha movido para o início, como faz a opção
faststartdo FFmpeg. Por isso, ler o índice sem transferir tudo o que vem antes dele depende de o servidor responder às requisiçõesRangecom206 Partial Content. O HTTP permite que um servidor ignoreRangee envie o arquivo inteiro. preload="none"não impede o carregamento do pôster. No padrão HTML, a imagem do pôster é buscada quando o elemento é criado ou seu atributopostermuda, independentemente depreload. O atributoloading="lazy"do padrão é o que adia tanto o carregamento do pôster quanto o comportamento de pré-carregamento até que o elemento se aproxime da área visível, e apenas quando a execução de scripts está habilitada; confirme se os navegadores de destino o implementam para vídeo.
Quando o pré-carregamento de vídeo é importante
Defina preload explicitamente, pois o padrão varia entre navegadores. none é adequado para páginas em que a reprodução é improvável ou que listam muitos vídeos, metadata é adequado para players que precisam da duração e das dimensões antes da reprodução, e auto é adequado para um vídeo que se espera que o espectador assista, ao custo de transferir mídia que talvez nunca seja reproduzida.
Como a Transloadit ajuda no pré-carregamento de vídeo
O pré-carregamento é decidido pelo navegador ou player no momento da reprodução, portanto não é uma configuração da Transloadit. A Transloadit prepara os arquivos que um player carrega: o Robot /video/thumbs extrai imagens de um vídeo para uso como prévias, que podem fornecer a imagem de pôster que um player exibe antes que qualquer mídia tenha sido buscada.
Defina o valor de preload no seu próprio código de marcação ou na configuração do player e escolha qual quadro extraído publicar como imagem de pôster.
Fontes
- Padrão HTML: elementos de mídia, incluindo os atributos preload, poster e loading
- MDN: o elemento video e seus atributos preload, poster e loading
- web.dev: reprodução rápida com pré-carregamento de áudio e vídeo
- RFC 9110: semântica do HTTP, seção 14 (requisições de intervalo) e seção 15.3.7 (206 conteúdo parcial)
- Código-fonte do Chromium: HTMLMediaElement::load(), PreloadType() e EffectivePreloadType()
- Documentação da API do hls.js: autoStartLoad e startLoad()
- Código-fonte do hls.js: loadSource() e startLoad()
- Código-fonte do hls.js: carregador de playlists, onManifestLoading() e checkAutostartLoad()
- Documentação de formatos do FFmpeg: muxer MOV/MP4 e a flag faststart