Saltar al contenido principal
Tiempo de lectura de 6 minutos (1143 palabras)

Cómo agrupar y minimizar recursos en WordPress

file-group-and-minify

Tener el mejor rendimiento posible es el sueño de todos los que administran un sitio web, agrupan y minimizan recursos en WordPress, es una de las mejores cosas que podemos hacer para eso, pero podría ser realmente difícil. Agrupar todos sus recursos (archivos css y js principalmente) puede exponer su sitio web si no es un desarrollador porque puede generar conflictos.

WP Speed of Light es la mejor solución para realizar tu sitio de wordpress porque tiene muchas opciones para que tu sitio se cargue rápido con un tablero realmente amigable y sí, una de estas opciones es agrupar y minificar recursos. La inclusión / exclusión de un solo archivo del grupo y el proceso de minificación es clave para una optimización personalizada sin conflictos.

Vamos a utilizar un sitio de wordpress de ejemplo para esta publicación de blog y aprenderemos cómo hacerlo para que el proceso de configuración de todo sea más fácil.

 

Cómo hacer una minificación de WordPress JS y CSS

Aprendamos cómo hacer una minificación de WordPress js y CSS, pero primero, necesitamos saber qué significa la minificación "La minificación se refiere al proceso de eliminar datos innecesarios o redundantes sin afectar la forma en que el navegador procesa el recurso, por ejemplo, comentarios de código y formatear, eliminar el código no utilizado, usar nombres de funciones y variables más cortos, y así sucesivamente ".

Ahora, lo que vamos a hacer es una prueba de velocidad en nuestra página para ver los cambios, para este ejemplo, estamos usando un sitio con woocommerce y algunos productos, por lo que la primera vez se cargará un poco lentamente.

 

antes de la prueba

 

Sí, 2,79 segundos para cargar la página, no está mal pero podría ser mejor, solo minifiquemos js y CSS y veamos la diferencia, ve a WP Speed of light > SpeedUp > Group & Minify , podrás para ver el menú con todas las opciones para minificar. La versión gratuita del complemento incluye la opción de grupo y minificación, pero la exclusión de archivos visuales solo está disponible en la versión PRO Addon.

 

grupo-y-minify-dashboard

 

Las opciones de complementos PRO son: excluir el script en línea (excluir el script en línea de la minificación), mover los scripts al pie de página (le permite acelerar su sitio moviendo todos los scripts minificados al pie de página), fuente de grupo y fuentes de Google (fuentes locales de grupo y fuentes de Google en un solo archivo para que se sirva más rápido) y Exclusión avanzada de archivos.
 
Tienes la opción de minificar, como puedes ver, JS, CSS y también el HTML ahora solo activa estas opciones, haz clic en guardar y todos tus recursos se minificarán de inmediato, podría tener problemas ya que es una configuración avanzada pero todo se puede arreglar con la exclusión de algunos códigos y archivos (con el complemento pro).

 

minify-resources

 

 

Ahora todo el trabajo de desarrollador que podría llevar horas se realiza en solo unos segundos.

 

Siguiente paso, WordPress optimiza CSS y JS

Con este complemento, permitiremos que wordpress optimice CSS y js simplemente habilitando las opciones de grupo en el tablero, vaya a WP Speed of Light > SpeedUp> Group & Minify , podrá ver un tablero con las opciones para agrupar CSS y js.

Estas opciones le permiten:

  • Grupo JS: Agrupar varios archivos Javascript en un solo archivo minimizará el número de solicitudes HTTP
  • CSS grupal: Agrupar varios archivos CSS en un solo archivo minimizará el número de solicitudes HTTP.

Solicitudes HTTP: son solicitudes que se realizan al servidor cada vez que seleccionamos algo o vamos a otra página en el mismo sitio, por lo que si podemos reducir estas solicitudes, el tiempo de carga se reduciría.

Para verificar cuántos archivos, secuencias de comandos puede agrupar en su sitio web, simplemente abra la consola de su navegador (clic derecho> Inspeccionar o F12) y abra el panel de red .

 

list-script-chrome

Luego puede enumerar todos los archivos cargados por tipo, aquí, en este ejemplo, he hecho clic en la lista de archivos JS solamente.

Ahora que estamos en esta configuración, solo habilite las opciones de grupo (Group CSS y Group JS) y haga clic en guardar, tenga en cuenta que estas opciones deben usarse con precaución y tendrá que probar su página porque puede causar conflictos .

 

Seamos serios y optimicemos el peso de la fuente

¿Qué? ¿Otra optimización? ¡Sí! podrá optimizar el peso de la fuente y será tan fácil como habilitar la opción en la configuración, solo vaya a WP Speed of Light > SpeedUp> Group & Minify> Group fonts y la opción Google Fonts.
Las fuentes de grupo y la opción de fuentes de Google le permitirán agruparlas en un solo archivo para que se sirvan más rápido, esto es bastante útil ya que la mayoría de los temas y diseños de WordPress vienen con 2 o fuentes de forma predeterminada con todas las declinaciones (regular, negrita, cursiva ...)

Simplemente habilite esa opción, haga clic en guardar y todas las fuentes se agruparán.

 

fuente de grupo

 


Ahora que hemos activado todas las opciones para minimizar y agrupar los recursos, deberíamos ver una diferencia en el tiempo de carga de nuestro sitio. Verifiquemos la velocidad.

 

prueba después

 

¡Qué diferencia, de 2,8 a 0,56 segundos! Como te contamos al principio de este post, podemos mejorar el tiempo de carga;)

 

Cómo usar la exclusión de minificación de archivos

La minificación podría causar problemas en su sitio, ocurre principalmente cuando agrupa ciertos archivos que contienen un error de sintaxis o una variable similar, nombre de clase. Es por eso que con la opción "exclusión de minificación de archivos", podrá excluir archivos del proceso de minificación y agrupación, vaya a WP Speed of Light > SpeedUp > Group & Minify , podrá ver la opción de exclusión avanzada de archivos

Para utilizar la exclusión avanzada de archivos, primero deberá ejecutar un análisis, active la opción y haga clic en Ejecutar análisis.

 

alerta de conflicto de recursos de grupo


 Para poder enumerar el script cargado en su sitio web, WP Speed of Light necesita escanear su carpeta para enumerarlos. Por lo general, todos están contenidos en su carpeta / wp-content que agrupa todos sus complementos y temas. Seleccione esa carpeta (al menos) y haga clic en "Escanear ahora"

 

seleccionar carpetas para escanear

 

Ejecutará un escaneo, finalmente, haga clic en ver resultados cuando se complete el escaneo.

 

escaneado

 

A continuación, se debe mostrar una lista de archivos clasificados por tipo (Todos, JS, CSS, Fuente). Si ha identificado un archivo que causa problemas, al activar el grupo de archivos y la minificación, puede excluirlo de aquí usando un simple conmutador de ENCENDIDO/APAGADO .

 

excluir archivos

 

Esto te ayudará a excluir archivos y, de esta manera, solucionar fácilmente cualquier problema que pueda existir al minificar recursos… El proceso de agrupar y minificar aún requiere algo de trabajo, especialmente en las pruebas, pero definitivamente vale la pena el esfuerzo, y lo harás. Siempre podrás probar cómo funciona ejecutando la prueba de velocidad directamente desde WP Speed of Light .
 
Continúe y pruebe WP Speed of Light : https://www.joomunited.com/wordpress-products/wp-speed-of-light

5
Mantente informado

Cuando se suscriba al blog, le enviaremos un correo electrónico cuando haya nuevas actualizaciones en el sitio para que no se las pierda.

Artículos Relacionados

 

Comentarios

Aún no hay comentarios. Sé el primero en enviar un comentario
¿Ya registrado? Entre aquí
miércoles, 08 de mayo de 2024

Imagen CAPTCHA