Hay os dejo los resultados obtenidos después de mis modificaciones. Ahora os cuento como las hice paso a paso.
Si tenéis wordpress lo mejor de lo mejor que vais a leer en todo Google es utilizar plugin wp-rocket es la mejor opción para llegar a esos números sin necesidad de complicaros, pero lo que pasa muchas veces es que los programadores llegamos un punto que nos preguntamos ¿Porque pagar un plugin si podría hacerlo por código fuente? Y eso fue lo que me paso a mi y me puse a investigar y empece a mirar, buscar, analizar….
Lo primero que os recomiendo es que tengáis un Child entiendo que si tenéis un wordpress como buena practica de instalación habréis puesto un child y eso es lo que yo tengo, así que os vais al funtions.php ya que la mayor parte de la velocidad son los CSS & JS asi que vamos a ponerlos en el footer.
1 –> Funtion
function load_myscripts() { wp_enqueue_script( ‘my-scripts’, get_template_directory_uri() . ‘/js/scripts.min.js’, array( ‘jquery’ ), ”, true ); } add_action( ‘wp_enqueue_scripts’, ‘load_myscripts’ );
2–> Funcion
// Remove scripts from head. function move_scripts_from_head_to_footer() {
//Copiar tal y como esta
remove_action( ‘wp_head’, ‘wp_print_scripts’ );
//En la frase anterior eliminamos del head los srcript
remove_action( ‘wp_head’, ‘wp_print_head_scripts’, 9 );
remove_action( ‘wp_head’, ‘wp_enqueue_scripts’, 1 );
add_action( ‘wp_footer’, ‘wp_print_scripts’, 5);
//En esta parte añadimos todos los script al footer para que la carga no renderice la pagina
add_action( ‘wp_footer’, ‘wp_enqueue_scripts’, 5);
add_action( ‘wp_footer’, ‘wp_print_head_scripts’, 5); }
add_action(‘wp_enqueue_scripts’, ‘move_scripts_from_head_to_footer’);
3–> Con esta función nos aseguramos que el Jquery no cargue en el head.
function force_jquery_to_footer() { wp_deregister_script( ‘jquery’ ); wp_register_script( ‘jquery’, includes_url( ‘/js/jquery/jquery.js’ ), false, NULL, true ); wp_enqueue_script( ‘jquery’ ); } add_action( ‘wp_enqueue_scripts’, ‘force_jquery_to_footer’ ); // Remove jQuery from old wp_print_scripts function remove_jquery_from_wp_print_scripts() { wp_deregister_script( ‘jquery’ ); } add_action( ‘wp_print_scripts’, ‘remove_jquery_from_wp_print_scripts’ );
Con estas funciones ya debería cargarse los JS en el footer y habréis mejorado la carga y velocidad de vuestra web, pero vamos a continuar porque esto no queda aquí.
Ahora vamos a instalar dos plugins esenciales que os van ayudar con los CSS & JS + optimizar img y base de datos aparte de mejorar la cache.
1 –> Autotimize (Optimice para mejorar la velocidad).
2–> Lazi Load
Una vez instalados y configurados (La configuración es muy básica sobre todo los css y js y ir leyendo).
Ahora yo lo que hice fue ir al .htaccess y añadí un nuevo código pero claro antes hacer una copia de seguridad, no toquéis nada y os lancéis sin haceros una copia de seguridad mi recomendación prioritaria.
1. Control de caché: Con esto hacemos que las personas que ya han visitado nuestra página y regresen de nuevo a ella, no se bajen de nuevo todos los archivos, sino que utilicen los que ya tienen en caché (guardados en su ordenador). Se debería utilizar en archivos multimedia, scripts, y hojas de estilos. El código es el siguiente:
<FilesMatch “\.(js|css|ico|pdf|flv|jpg|jpeg|png|gif|swf|mp3|mp4)$”>
Header set Cache-Control “public”
Header set Expires “Thu, 15 Apr 2020 20:00:00 GMT”
</FilesMatch>
2. Activar la compresión: La idea es simple: Es más rápido comprimir un archivo, enviarlo, y descomprimirlo, que no enviarlo directamente sin comprimir. Aunque el proceso es más complejo, es mucho más rápido, ya que la información comprimida que se envía ocupa mucho menos. El código es el siguiente:
<FilesMatch “\.(js|css|ico|pdf|jpg|jpeg|png|gif|php)$”>
SetOutputFilter DEFLATE
</FilesMatch>
Hay plugins que os van ayudar también a optimizar las img con darle a un simple boton como
Smush – Compress, Optimize and Lazy Load Images para mi de los mejores si es que anteriormente no has ido optimizando una a una las img antes de subirlas.
Con estas modificaciones que os he comentado he llegado a conseguir esas números si que es cierto que se pueden mejorar y en ello estoy así que mi idea es llegar a un 90 y tantos % en mobile y un 98% en pc son números altos pero si haces lo que os he indicado podréis por lo menos estar dentro de los valores que Google le gusta. Espero que os haya gustado el post y lo dicho este post es después de muchas horas de análisis no hagas un control C control V please 😉
