Videos Chrome HTML5 dejan de funcionar si hay demasiadas pestañas abiertas. ¿Problema de memoria?

Question

Estoy usando jQuery para escribir dinámicamente objetos <video> y ejecutando videojs para iniciarlos. Después de reproducir un video, A VECES cuando trato de reproducirlo, simplemente no se reproduce, y desde ese momento, incluso después de actualizar la página, no se reproducirán videos. Cada vez, se renderiza el objeto <video>, pero el video simplemente no se reproduce. Nada está escrito en la consola. No parece haber ningún error. Al reiniciar Chrome, se resuelve el problema, pero solo momentáneamente. Después de reproducir algunos videos, el problema vuelve nuevamente.

Descubrí que cerrar otras pestañas en Chrome realmente soluciona el problema, por lo que parece ser algún tipo de problema de memoria.

estoy corriendo Chrome 19.0.1084.46

Answer 1

Exactamente cuántos video etiquetas que usted tiene? ¿Qué es lo que parecen? ¿Incluyen el atributo preload='none'? ¿Los videos originales están todos en el servidor?

Lo pregunto porque si usted tiene más de seis video etiquetas en una sola página que apuntan al mismo servidor de origen entonces usted podría estar experimentando "el hambre de conexión":

• Chrome permite sólo seis conexiones abiertas a una sola servidor (basado en el nombre DNS en la URL)
• valor por defecto del atributo precarga del muelle de la etiqueta HTML5 video es 'auto'
• comportamiento automático de Chrome es para cargar previamente algunos datos y dejar la conexión abierta lista para tirar más datos para el video

Por lo tanto, con más de seis etiquetas de video en una sola página apuntando a un único servidor, los videos no se reproducirán. Para resolver este problema en particular, configure el atributo preload en 'none'

Answer 2

Stu es correcto. Pero a veces, en mi experiencia, Chrome ignora el atributo preload = "none" y sigue adelante y abre una conexión de todos modos. He tenido muchos problemas con esto al desarrollar un sitio que tenía muchos videos más pequeños. Las conexiones bloquearon el resto del contenido (imágenes, fuentes personalizadas (y cuando las fuentes personalizadas se retrasan, el texto ni siquiera se procesa)) Mi solución fue construir un preloader propio que cargue las imágenes. Esto me aseguró de poder controlar al menos cuando se cargaron las imágenes (que era el aspecto más importante desde el punto de vista del diseño).

Eso resolvió el problema con las imágenes que no se muestran, pero el problema persiste. Entonces, la mejor solución es configurar subdominios apuntando al mismo servidor, como: v1.server.com, v2.server.com, y así sucesivamente. Esto significa que no tendrá que mover sus archivos y obtendrá el beneficio de permitir que los navegadores tengan más conexiones abiertas. Sin embargo, ten cuidado con el aumento en el tiempo de búsqueda de DNS.

Answer 3

Hay un known bug con Chrome. No reproducirá el mismo video en varias pestañas al mismo tiempo. Esto es probablemente lo que te encuentras si eres un desarrollador y tienes tu página abierta en dos pestañas al mismo tiempo.

El error se conoce desde hace casi 5 años. No dude en visitar el Chromium bug report y protagonice el problema. Esperemos que aumente en prioridad para los desarrolladores de Chrome.

---

Mientras tanto, una solución consiste en utilizar un parámetro de consulta aleatorio en su video de src.Por ejemplo, en lugar de <video src="vid.mp4">, use <video src="vid.mp4?_u=1253412">. Esto romperá el mecanismo de caché de Chrome y permitirá que el mismo video se transfiera a dos pestañas diferentes al mismo tiempo.

Answer 4

Tuve un problema similar pero relacionado que puedo ampliar ligeramente aquí.

Tenía 14 videos pequeños diferentes en una página, pero solo 2 estaban disponibles a la vez. Establecer precarga = 'ninguno' no solucionó el problema, así que también usé un atributo de datos para almacenar el src y eliminé el src para todos los videos que no se están viendo actualmente.