react-player

O ReactPlayer é um componente React para incorporação de reprodução de mídia de uma ampla variedade de fontes usando uma única interface. Ele aceita uma URL de mídia e carrega automaticamente a marcação apropriada ou SDK externo necessário para reproduzi-la. As fontes suportadas incluem arquivos padrão de vídeo e áudio HTML5, streams HLS via hls.js, streams DASH via dash.js, vídeos Mux via o elemento mux-player, YouTube via a YouTube iFrame Player API, Vimeo via a Vimeo Player API e Wistia via a Wistia Player API. O componente expõe um rico conjunto de props para controle de reprodução, como src, playing, loop, controls, volume, muted, playbackRate, width, height, preload, playsInline, crossOrigin, disableRemotePlayback e suporte a picture-in-picture quando disponível. Também oferece props de callback para eventos comuns do player, incluindo onReady, onStart, onPlay, onPlaying, onProgress, onTimeUpdate, onDurationChange, onPause, onWaiting, onSeeking, onSeeked, onRateChange, onEnded, onError e eventos de entrada/saída de picture-in-picture. Uma prop config permite configurações específicas por fonte para YouTube, Vimeo e HLS. O ReactPlayer inclui auxiliares estáticos como canPlay para testar se uma URL é provável de ser reproduzível, além de addCustomPlayer e removeCustomPlayers para registrar implementações de player personalizadas. Métodos de instância acessados por meio de um ref visam ser compatíveis com a interface HTMLMediaElement. Para performance, o componente suporta carregamento lazy de chunks do player quando o sistema de build suporta dynamic imports, reduzindo o tamanho do bundle principal ao carregar apenas o player necessário para uma dada fonte. Recursos adicionais incluem um light mode que exibe um thumbnail primeiro e carrega o player completo apenas após interação do usuário, suporte a thumbnails customizados, dimensionamento responsivo por meio dos estilos width, height e aspect-ratio, e compatibilidade com interfaces de controle customizadas como o Media Chrome. Desde a versão 3, o ReactPlayer também suporta múltiplos children de source e track de forma semelhante aos elementos nativos de vídeo e áudio HTML, permitindo formatos alternados e trilhas de legenda. O README observa que a versão 3 é uma atualização arquitetural importante e não é backward compatible com a versão 2, e que a manutenção é agora conduzida pela Mux enquanto permanece open source.