1

Hola actualmente tengo estas líneas de código, para restear un iframe de video que aparece en un modal, el detalle esta en que su ejecución es bastante lenta y llega a ser percibida por el usuario, es decir una vez que el usuario le da clic en cerrar, el modal cierra pero el iframe sigue ejecutándose de fondo por unos milisegundos mas.

$(".videos-grid .modal .close").click(function() {
    //Cerrar modal
    $(this).parents('.modal').toggleClass('active');
    
    //Buscar iframe
    console.time('search');
    var $frame = $(this).parents('.modal').find('iframe');
    var vidsrc = $frame.attr('src');
    console.timeEnd('search');
    
    //Reset de iframe
    console.time('reset');
    $frame.attr('src','');
    $frame.attr('src', vidsrc);
    console.timeEnd('reset');
});

El resultado de los console.time llega hacer hasta de: resultados de console.time

2
  • Optimizar jQuery, salvo que entres en el propio código de la librería y hagas cambios no se puede. Puedes optimizar como se usa, p.e. si ese iframe tuviera un ID lo vas a cargar más rápido que buscando en el DOM... En general, muchas de estas cosas las puedes hacer hoy con Vainilla JS y funciona infinitamente más rápido...
    – Orici
    Commented el 11 jun. 2021 a las 17:44
  • Diría que no tienes que esperar hasta que se cierra el modal para buscar el $frame, este podrías tenerlo en una variable, de manera que no tengas que buscarlo. Esta variable podría llenarse después de abrir el modal, por ejemplo. Ahorrándote el tiempo de búsqueda, ya solo queda el tiempo de reset, que si no te puedes quitar de encima.
    – jachguate
    Commented el 11 jun. 2021 a las 19:31

1 respuesta 1

2

Al final omití jQuery de esta porción del código, la ejecución es mas veloz y el usuario no lo percibe tanto.

console.time('search');
var $frame = this.closest('.modal').querySelector('iframe');
var vidsrc = $frame.getAttribute('src');
console.timeEnd('search');

console.time('reset');
$frame.setAttribute('src','');
$frame.setAttribute('src', vidsrc);
console.timeEnd('reset');

nuevos resultados

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.