Safari en dispositivos iOS está cargando imágenes corruptas – sitio de WordPress

4 minutos de lectura

Las imágenes en cuestión son JPEG y las he reducido a un tamaño más pequeño (30 kb). El sitio de wordpress en cuestión responde y este problema ocurre cuando estoy usando la red móvil para cargar el sitio. De forma inalámbrica, no tiene problemas, pero en 3G/4G, las imágenes se cargan aleatoriamente, algunas están dañadas, las imágenes cambian de lugar, por lo que todo css y js parecen desordenados. Estoy usando caché W3 para mejorar la velocidad, pero nada ayuda. Algunas imágenes son medio grises, negras y, a veces, parecen corruptas. Esto solo ocurre en dispositivos iOS con navegador Safari.

¿Alguien más se enfrentó al mismo problema? En el escritorio con cable, inalámbrico, nunca he tenido este problema.

No estoy seguro si tiene que ver con la base de datos o el rendimiento general del sitio del servidor. Cualquier ayuda es muy apreciada.

  • Acabo de encontrarme con este mismo problema hoy. Al borrar la memoria caché del navegador móvil, las “imágenes problemáticas” cambiaron y se intercambiaron o dañaron diferentes imágenes. Al igual que tú, mi problema desaparece en wifi. Nuestros activos estáticos son atendidos por Akamai, por lo que la velocidad del lado del servidor no debería ser un problema. No estamos ejecutando WordPress, por lo que tampoco es el problema central. El problema se encontró en un iPhone 4S con iOS 8.1 y comunicándose a través de 4G. El mismo dispositivo en wifi no tenía el problema de corrupción/intercambio.

    – Brandon Belvin

    30 de octubre de 2014 a las 2:27


  • Aparentemente, este no es un problema nuevo o poco común: discusiones.apple.com/thread/6563683

    – Brandon Belvin

    30 de octubre de 2014 a las 2:45

  • Gracias Brandon. Investigué un poco y descubrí que había alguna restricción para que el tamaño del contenido de ajax se cargara en safari con el servicio 3g/4g. Aunque no he encontrado una solución. Está afectando a todos los dispositivos iOS y no solo al iPhone 4S.

    – solo yo

    7 noviembre 2014 a las 20:36

  • ¿Sucede esto si usa la aplicación Chrome como navegador en lugar de Safari?

    – Marc

    13 mayo 2015 a las 22:05

  • ¿Ha intentado usar una solución de optimización de imágenes en la nube como Cloudinary? Optimizaría las imágenes según lo que sea mejor para el navegador. Si se trata de un problema de tamaño de imagen, este servicio sin duda ayudaría. Lo usamos en la producción de nuestros sitios de noticias, y hace cosas asombrosas para el rendimiento de carga de páginas porque tenemos muchas imágenes.

    – Set C.

    6 de julio de 2015 a las 19:58

Mientras apoyaba a nuestros clientes de WordPress, me he enfrentado a este problema docenas de veces. Hay dos razones generales para este comportamiento:

  1. Está utilizando alguna CDN (red de entrega de contenido) que no mencionó en su pregunta, y diferentes servidores de CDN generan una versión de caché de sitio web diferente. Si está utilizando CDN, intente purgar el caché de su complemento local, deshabilite su complemento local y purgue su caché de CDN.
  2. A veces, las miniaturas de las imágenes pueden estar dañadas, mientras aún existen. Intenta instalar “Forzar regeneración de miniaturas” complemento y regenerar todas las miniaturas.

Aunque las dos razones anteriores son las más comunes, el problema en sí también puede estar relacionado con otra cosa, por ejemplo, con algún complemento en particular. Para este caso, podría ser una buena idea desactivar temporalmente sus complementos uno tras otro y ver si se resuelve el problema.

En caso de que alguno de estos no ayude, requerirá un trabajo de depuración, por lo que podría ser una buena idea contratar a un desarrollador de WordPress durante aproximadamente una hora para solucionar este problema.

¡Buena suerte!

Si tiene acceso a un mac + safari, puede intentar la depuración remota de su dispositivo iOS. Si hace esto, podría abrir la barra de herramientas del desarrollador para el dispositivo para que pueda ver si la información realmente se está cargando. es decir. si la imagen desordenada es de 300k en el sitio de escritorio, pero el dispositivo iOS está cargando una imagen de 30k, sabrá que está perdiendo datos en alguna parte.

No he visto este problema específico, pero he tenido problemas similares emergentes debido a enlaces CDN incorrectos, complementos de almacenamiento en caché y carga diferida de imágenes.

Otra nota a tener en cuenta sería si su tema/plantilla/complementos usan conjuntos src. Es posible que su versión normal de la imagen esté bien, pero las imágenes en el srcset para dispositivos móviles están desordenadas.

Como se indicó anteriormente, deshabilite completamente la memoria caché w3 para solucionar el problema. Entonces eche un vistazo a los complementos.

¿Ha sido útil esta solución?