jueves, 9 de junio de 2016

Tu dosis diaria de WordPress - Ayuda WordPress

Gracias por estar suscrito a Ayuda WordPress
Ver email en el navegador

Ayuda WordPress

Recursos, themes, plugins y tutoriales en español

Activando la carga asíncrona para mejorar la velocidad de tu web

Por Fernando el Jun 09, 2016 07:09 am

¿Carga tu web excesivamente lenta o no carga todo lo rápido que quisieras? Hay muchos posibles aspectos que afectan negativamente a la velocidad de carga de una web,  y una pueden ser los plugins, o el modo en que se ejecutan.

De hecho hay muchos plugins WordPress que usan JavaScript y, salvo que hagamos algo al respecto, todos ellos intentan cargar su código de inmediato en cuando se accede a tu sitio.

De hecho este problema es fuente de muchos de los avisos de optimización WPO necesaria que nos suele recomendar el servicio Google PageSpeed Insights, que tanto nos trae de cabeza, y lo que nos espera.

El modo de evitar esta carga masiva y sin control, que puede ralentizar la velocidad de visualización de tu contenido, lo que realmente importa, sería forzar la carga asíncrona de los mismos, algo que puede reducir los tiempos de carga.

Hace tiempo hablamos de cómo aplazar mediante código la carga de JavaScript, hoy vamos a darle una segunda vuelta con algunos plugins, sí plugins, que nos darán mayor control sobre este problema.

Pero ¿qué es eso de la carga asíncrona?

En realidad es un concepto bastante sencillo. Cuando aplicas la carga asíncrona lo que haces es controlar que no haya una carga al unísono de códigos, sino secuencial.

O sea, que en vez de cargar todo de golpe, a la vez, cada código cargado de modo asíncrono espera a que termine de cargarse un elemento (JavaScript o CSS) antes de empezar a cargar el siguiente.

En esta imagen creo que se ve de manera sencilla…

carga asíncrona y síncrona

Y como los plugins, en general, no saben si vas a usarlos en conjunción de otros se dan la máxima prioridad y cargan “lo suyo” sin esperar a otros. Lo que consigues sin carga asíncona es un cuello de botella en la carga de tu web con todos los códigos queriendo cargarse al unísono.

Afortunadamente hay modo de poner orden en este embrollo, y nos vamos a ayudar de algunos plugins para ello.

Plugins de carga asíncrona

Async CSS

La función de este plugin es definir qué CSS se carga y en qué momento para organizar el tráfico de este código en tu web.

Se suele utilizar para cargar tu hoja de estilos principal de modo síncrono y luego elegir qué archivos CSS no vitales se cargarán después, de manera asíncrona. Por archivos CSS no vitales me refiero a fuentes, iconos, CSS de plugins, etc.

Ajustes Async CSS Ejemplo carga asíncrona

WP Deferred JavaScripts

Este plugin se ocupa de retrasar la carga de todos los JavaScripts añadidos mediante wp_enqueue_script(). El resultado es una mejora significativa de los tiempos de carga.

Es compatible con todas las funciones JavaScript de WordPress (wp_localize_script(), js en la cabecera, en el footer…) y funciona con todos los plugins que estén medianamente bien programados, que usen funciones estándar de WordPress.

Funciona con activar y listo, pero hay una serie de parámetros que puedes aplicar.

JS & CSS Script Optimizer

Esta virguería de plugin hace muchas cosas, y buenas, por ti:

  • Agrupa varios scripts en uno solo para minimizar las peticiones http
  • Combina varios archivos CSS agrupándolos por tipo de medio
  • Enpaqueta los scripts usando el Dean Edwards’s JavaScript Packer
  • Minimiza los archivos CSS, o sea, borra comentarios, tabulaciones, espacios, saltos de línea, etc.
  • Pone todo el JavaScript para que cargue al final de tu página

Y además es compatible con WordPress Multisitio.

Ajustes del plugin Añadiendo JS Añadiendo CSS

¿Funciona? te preguntarás. Echa un vistazo a resultados de YSlow antes y después de tener el plugin en marcha…

Antes Después

Plugins para compartir en redes sociales

Mención especial merecen los plugins de iconos para compartir en redes sociales, porque todos tenemos instalado alguno y, especialmente, porque suelen ser enormes granos en el culo en lo que a optimización de rendimiento y velocidad se refiere.

Sí, esos pequeños botones son grandes generadores de peticiones, enormes consumidores de recursos y fuente de muchos problemas en lo que se refiere a WPO.

Hay varios por ahí que declaran realizar la carga asíncrona, como Async Social Sharing o el popular AddToAny, pero salen tan mal parados en general en las pruebas de rendimiento que casi estropean más que lo que en teoría podrían aportar con su carga asíncrona.

Mi consejo en este sentido es que uses la maravilla de Monarch, que no solo resultó ganador en los tests de rendimiento sino que además puedes configurarlo totalmente según tus necesidades.

¿Que no me haces caso? Vale, entonces al menos usa uno que te permita no mostrar la cantidad de veces que se ha compartido algo, o que puedas modificarlo en este sentido, ya que esta pequeñez duplica las peticiones de cada una de tus páginas, por lo menos.


¿Dudas, opiniones?

Este es tu blog, yo he abierto la conversación y aportado algo de información y consejos, espero que útiles, pero si tienes algo que contarnos, discutirme, o aportar, ahí tienes los comentarios.


Verlo en el navegador »


Artículos recientes:

Cómo crear un producto simple en WooCommerce
¿Se dice URL o URI?
WordPress Professional Network
Activa plugins solo donde quieras
La solución definitiva para los gastos de envío en tu tienda WooCommerce

Si quieres saber más sobre lo que ofrecemos en Ayuda WordPress echa un vistazo a los siguientes enlaces …  



Curso de WordPress TOTAL

TU EXPERTO WORDPRESS ONLINE
Hosting especializado WordPress
100% fiable


FORMACIÓN WORDPRESS ONLINE
Twitter
Facebook
YouTube
Google Plus
Web
Copyright © 2016 Ayuda WordPress, Todos los derechos reservados.
Recibes este correo al estar suscrito a la lista de noticias de Ayuda WordPress

Ayuda WordPress
Madrid
España, ES 1001
Spain

Add us to your address book


Puedes cambiar tus preferenciasanular la suscripción

Email Marketing Powered by MailChimp

No hay comentarios:

Publicar un comentario

Seguidores

Archivo del blog