etiquetas ejemplos html css joomla user-experience

html - ejemplos - Reducir el tiempo de carga o hacer que el usuario piense que el tiempo de carga es menor



meta tags ejemplos (6)

He estado trabajando en un sitio web, y hemos logrado reducir el contenido total para una carga de página de 13.7Mib a 2.4, pero la página aún tarda una eternidad en cargarse.

Es un sitio de joomla (ick), y tiene muchos elementos de DOM redundantes (2000+ para la página de inicio) y hace más de 60 solicitudes de HttpRequest por página, contabilizando todas las solicitudes de css, js y de imágenes. A diferencia de drupal, joomla no los fusionará todos sobre la marcha, y tienen que mantenerse separados o de lo contrario los componentes joomla se volverán locos.

¿Qué puedo hacer para mejorar el tiempo de carga?

Cosas que he hecho:

  • Se agregaron colores a los elementos dom que tienen imágenes grandes como fondo para que el color se cargue, luego la imagen
  • Reducción de imágenes excesivamente grandes a tamaños de archivo mucho más pequeños
  • Elementos DOM reducidos a ~ 2000, desde ~ 5000
  • Cargando CSS al comienzo de la página y javascript al final
    • No totalmente posible, joomla inyecta su propio javascript y CSS y lo hace en el encabezado, siempre.
  • Minificado la mayoría de los javascript
  • Configurar el almacenamiento en caché y gziping en el servidor

El tamaño sin almacenamiento en caché de 2.4MB, almacenado en caché es ~ 300KB, pero incluso con tantos elementos dom, la página tarda bastante tiempo en renderizarse.

¿Qué más puedo hacer para mejorar el tiempo de carga?

¿Son necesarios todos los elementos DOM? Si lo son, ¿es posible ocultarlos mientras se carga la página? Básicamente, tendría que hacer que sus elementos importantes de la necesidad de estar allí se procesen con la página, y luego, cuando se cargue el documento, podría mostrar el resto de los elementos según sea necesario.

$(''.hidden'').removeClass(''hidden'')

Parece que has hecho un gran trabajo al solucionar el problema real: esos gráficos gigantes. Probablemente pueda exprimir un poco más la eficiencia del almacenamiento en caché, minificación, etc., pero tiene que haber una manera de reducir el tamaño de las imágenes. Trabajé con un equipo de algunos de los diseñadores más quisquillosos de la Tierra y nunca necesitaron archivos JPEG sin comprimir. ¿Quiere decir imágenes recortadas de Photoshop y guardadas con calidad total (10)? Si es así, la verdadera solución (y agradezco que no puedas lograr esto) es tener una conversación difícil en la que le expliques a la empresa de diseño: "Ustedes no son sus usuarios". Si el objetivo del sitio es impresionar a otros diseñadores visuales con la fidelidad de sus imágenes, quizás esté bien. Si el objetivo del sitio es ser una cartera que gane el trabajo de su empresa, deben volver a evaluar quién es su público y lo que quiere el público. Lo cual, supongo, no son tiempos de carga de 2 minutos.

¿Ha habilitado la compresión HTTP (gzip) en sus servidores web? Eso reducirá el tamaño de transferencia de todos los archivos basados ​​en texto en un 60-90%. Y tu página se cargará 6-10 veces más rápido.

Busque o Google para saber cómo habilitarlo. (Varía según el software del servidor: Apache, IIS, etc.).

Yo diría que no puedes hacer nada. Estás cerca del límite absoluto.

Una vez que llegue a un punto crítico, tendrá que comparar la cantidad de esfuerzo que necesitaría para ingresar para comprimir aún más el sitio contra el esfuerzo de arrojar la mayor cantidad de componentes caros de banda ancha por la ventana. Por ejemplo, puede pasar 20 horas más comprimiendo su sitio en un 1%. También puede pasar 40 horas tirando el tema de Joomla y comenzando de nuevo, ahorrando un 50%. (aunque probablemente no)

Espero que encuentres una respuesta fácil. Siento tu dolor cuando estoy luchando por terminar un proyecto de Drupal que ha sido masacrado por un diseñador que no ha implementado su propio código en años y se ha institucionalizado en un cubículo en algún lugar cerca de un sándwich de ensalada de atún.