Plugin para optimizar carga de vídeos en páginas web

  • Autor Autor Sam40
  • Fecha de inicio Fecha de inicio
Sam40

Sam40

Eta
Verificación en dos pasos activada
Verificado por Whatsapp
Tengo un blog con muchos vídeos y mis páginas son muy lentas porque youtube inserta muchísimo JS a las publicaciones. Una publicación sin Youtube tiene una puntuación en pagespeed de 99, con youtube de 50. ¿Existe algún pluguin que impida que Youtube rompa la optimización de las páginas? Que cree una falsa captura del vídeo y que solo se active al hacer click sobre ella o algo similar, no se. ¿Alguna idea?

Gracias
 
Si, los videos enlentecen un montón.
Yo uso plugins, según la web me funcionan mejor unos que otros, son todos gratis:

- Lazy Load - Optimize Images
- WP YouTube Lyte
- a3 Lazy Load
 
Puedes hacer algo que coloque solo la imagen destacada del video y que al dar click recién cargue el video de youtube (no hace toda la carga al inicio, solo cuando el usuario le de click).
 
Puedes hacer algo que coloque solo la imagen destacada del video y que al dar click recién cargue el video de youtube (no hace toda la carga al inicio, solo cuando el usuario le de click).
Y eso cómo se hace?
 
Y eso cómo se hace?

HTML:
<iframe src="http:/www.tupagina.com/reproductorredirect.php?player=1&code=SbHhaVmdEvc&thumbnail=https://i.imgur.com/ebLaJZX.jpeg"></iframe>

Dentro de reproductorredirect.php:
PHP:
<?php
if (isset($_GET['thumbnail']) && isset($_GET['code'])) {
    $thumb = $_GET['thumbnail'];
    $code = $_GET['code'];
}
?>
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Redirect</title>
</head>

<body>
    <div id="player">
        <div id="background" style="position:absolute;opacity:0.4;z-index:1;background:url('<?php echo $thumb ?>');background-repeat:no-repeat;background-size:cover;width:100%;height:100%;left:0;top:0;"></div>
        <div style="text-align: center;"> click me </div>
    </div>
    <script>
        document.getElementById('background').onclick = function() {
            document.getElementById('player').innerHTML = '<iframe id="player" frameborder="0" allowfullscreen="1" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" title="YouTube video player" width="640" height="360" src="https://www.youtube.com/embed/<?php echo $code ?>"></iframe>';
        }
    </script>
</body>
</html>

Como se ve, no es complicado xd. en la pagina youtube player se pueden ver las opciones que se le puede poner.
 
Última edición:
Atrás
Arriba