Diferencia entre revisiones de «Optimizacion»

De Apu
Ir a la navegación Ir a la búsqueda
Línea 30: Línea 30:
  
 
<IfModule mod_deflate.c>
 
<IfModule mod_deflate.c>
 
+
AddOutputFilterByType DEFLATE application/javascript  
AddOutputFilterByType DEFLATE application/javascript
+
AddOutputFilterByType DEFLATE application/rss+xml  
 
+
AddOutputFilterByType DEFLATE application/vnd.ms-fontobject  
AddOutputFilterByType DEFLATE application/rss+xml
+
AddOutputFilterByType DEFLATE application/x-font  
 
+
AddOutputFilterByType DEFLATE application/x-font-opentype  
AddOutputFilterByType DEFLATE application/vnd.ms-fontobject
+
AddOutputFilterByType DEFLATE application/x-font-otf  
 
+
AddOutputFilterByType DEFLATE application/x-font-truetype  
AddOutputFilterByType DEFLATE application/x-font
+
AddOutputFilterByType DEFLATE application/x-font-ttf  
 
+
AddOutputFilterByType DEFLATE application/x-javascript  
AddOutputFilterByType DEFLATE application/x-font-opentype
+
AddOutputFilterByType DEFLATE application/xhtml+xml  
 
+
AddOutputFilterByType DEFLATE application/xml  
AddOutputFilterByType DEFLATE application/x-font-otf
+
AddOutputFilterByType DEFLATE font/opentype  
 
+
AddOutputFilterByType DEFLATE font/otf  
AddOutputFilterByType DEFLATE application/x-font-truetype
+
AddOutputFilterByType DEFLATE font/ttf  
 
+
AddOutputFilterByType DEFLATE image/svg+xml  
AddOutputFilterByType DEFLATE application/x-font-ttf
+
AddOutputFilterByType DEFLATE image/x-icon  
 
+
AddOutputFilterByType DEFLATE text/css  
AddOutputFilterByType DEFLATE application/x-javascript
+
AddOutputFilterByType DEFLATE text/html  
 
+
AddOutputFilterByType DEFLATE text/javascript  
AddOutputFilterByType DEFLATE application/xhtml+xml
+
AddOutputFilterByType DEFLATE text/plain  
 
+
AddOutputFilterByType DEFLATE text/xml  
AddOutputFilterByType DEFLATE application/xml
+
AddOutputFilterByType DEFLATE image/jpg  
 
+
AddOutputFilterByType DEFLATE image/png  
AddOutputFilterByType DEFLATE font/opentype
+
AddOutputFilterByType DEFLATE image/webp  
 
+
AddOutputFilterByType DEFLATE video/webm  
AddOutputFilterByType DEFLATE font/otf
+
BrowserMatch ^Mozilla/4 gzip-only-text/html  
 
+
BrowserMatch ^Mozilla/4\.0[678] no-gzip  
AddOutputFilterByType DEFLATE font/ttf
+
BrowserMatch \bMSIE !no-gzip !gzip-only-text/html  
 
+
Header append Vary User-Agent  
AddOutputFilterByType DEFLATE image/svg+xml
 
 
 
AddOutputFilterByType DEFLATE image/x-icon
 
 
 
AddOutputFilterByType DEFLATE text/css
 
 
 
AddOutputFilterByType DEFLATE text/html
 
 
 
AddOutputFilterByType DEFLATE text/javascript
 
 
 
AddOutputFilterByType DEFLATE text/plain
 
 
 
AddOutputFilterByType DEFLATE text/xml
 
 
 
AddOutputFilterByType DEFLATE image/jpg
 
 
 
AddOutputFilterByType DEFLATE image/png
 
 
 
AddOutputFilterByType DEFLATE image/webp
 
 
 
AddOutputFilterByType DEFLATE video/webm
 
 
 
BrowserMatch ^Mozilla/4 gzip-only-text/html
 
 
 
BrowserMatch ^Mozilla/4\.0[678] no-gzip
 
 
 
BrowserMatch \bMSIE !no-gzip !gzip-only-text/html
 
 
 
Header append Vary User-Agent
 
 
 
 
</IfModule>
 
</IfModule>
  
 
== PASOS FINALES ==
 
== PASOS FINALES ==
 
Ahora que ya hemos hecho todo esto debemos volver a analizar la pagina con la utilidad de [https://developers.google.com/speed/pagespeed/insights/?hl=es Google PageSpeed] y documentarlo juntamente con los resultados anteriores, si se han seguido los pasos y no ha ocurrido nada fuera de lo normal debería mejorar bastante.
 
Ahora que ya hemos hecho todo esto debemos volver a analizar la pagina con la utilidad de [https://developers.google.com/speed/pagespeed/insights/?hl=es Google PageSpeed] y documentarlo juntamente con los resultados anteriores, si se han seguido los pasos y no ha ocurrido nada fuera de lo normal debería mejorar bastante.

Revisión del 12:38 3 sep 2020

Esta página recoge toda la información para optimizar las páginas web que se hagan

PREPARATIVOS

Google PageSpeed

Con el fin de demostrar al cliente el antes y el después de la optimización debemos de hacer algo de faena antes que nada:

  1. Primero que todo tenemos que ir a la pagina de Google PageSpeed e introducir la URL de la página que estamos optimizando, esto habrá que hacerlo dos veces seguidas para que no se quede con el primer resultado ya que suele dar errores.
  2. Una vez realizado el paso anterior deberemos de hacer capturas i documentar la información que nos da la página, lo suyo seria recabar toda la información pero con que nos quedemos con las puntuaciones y con los tiempos de carga servirá.

BackUp

Este es casi el punto mas importante, en caso de que algo falle deberemos de tener una copia de seguridad del sitio web por si tenemos que restaurarla, así pues ¡¡corre a hacerla!!


Wordpress

En este punto deberemos de actualizar en la medida de lo posible los plugins que dispongan de una nueva versión y en el caso que el plugin haya sido marcado como obsoleto deberemos buscar uno que cumpla la misma función en las nuevas versiones tanto de WordPress como de PHP.

  1. Tendremos que actualizar los plugins solucionando los problemas que vayan saliendo a medida que avanzamos.
  2. Si hay algún plugin que no tiene actualizaciones igualmente deberemos mirar en la pagina oficial del plugin si existe alguna.
  3. Una vez actualizados los plugins deberemos de actualizar WordPress, pero antes deberemos mirar si los plugins son compatibles con la nueva versión de este, asi pues podemos descargar el siguiente plugin que nos ahorrará tener que comprobarlo nosotros. --> click aquí
  4. Cuando actualizemos WordPress podremos subir la versión del php siempre y cuando el plugin de compatibilidad nos haya dado el Okey, sino deberemos solucionar los problemas antes.
  5. Si hay algún plugin que no se usa se debe desinstalar, ¡no queremos basura en las webs de los clientes!

IMPORTANTE: AUNQUE LA VERSIÓN DEL PHP DE PLESK DIGA QUE NO ESTA OBSOLETO DEBEMOS MIRARLO EN LA PAGINA OFICIAL PUES A VECES PLESK NO ESTA ACTUALIZADO AL DIA


INSTALAR WPROCKET

Se debe seguir el siguiente manual para optimizar las paginas, se actualizará esta pagina para albergar el manual, por ahora referir-se a este documento --> clic aquí

MODIFICAR .HTACCESS

Se deben añadir las líneas de código siguientes al inicio del fichero .htaccess del dominio del cliente, esto lo que hace es habilitar la compresión del contenido antes de ser enviado, de esta manera conseguimos empaquetar todo antes de enviar i no inundamos el servidor a miles de peticiones.


<IfModule mod_deflate.c> AddOutputFilterByType DEFLATE application/javascript AddOutputFilterByType DEFLATE application/rss+xml AddOutputFilterByType DEFLATE application/vnd.ms-fontobject AddOutputFilterByType DEFLATE application/x-font AddOutputFilterByType DEFLATE application/x-font-opentype AddOutputFilterByType DEFLATE application/x-font-otf AddOutputFilterByType DEFLATE application/x-font-truetype AddOutputFilterByType DEFLATE application/x-font-ttf AddOutputFilterByType DEFLATE application/x-javascript AddOutputFilterByType DEFLATE application/xhtml+xml AddOutputFilterByType DEFLATE application/xml AddOutputFilterByType DEFLATE font/opentype AddOutputFilterByType DEFLATE font/otf AddOutputFilterByType DEFLATE font/ttf AddOutputFilterByType DEFLATE image/svg+xml AddOutputFilterByType DEFLATE image/x-icon AddOutputFilterByType DEFLATE text/css AddOutputFilterByType DEFLATE text/html AddOutputFilterByType DEFLATE text/javascript AddOutputFilterByType DEFLATE text/plain AddOutputFilterByType DEFLATE text/xml AddOutputFilterByType DEFLATE image/jpg AddOutputFilterByType DEFLATE image/png AddOutputFilterByType DEFLATE image/webp AddOutputFilterByType DEFLATE video/webm BrowserMatch ^Mozilla/4 gzip-only-text/html BrowserMatch ^Mozilla/4\.0[678] no-gzip BrowserMatch \bMSIE !no-gzip !gzip-only-text/html Header append Vary User-Agent </IfModule>

PASOS FINALES

Ahora que ya hemos hecho todo esto debemos volver a analizar la pagina con la utilidad de Google PageSpeed y documentarlo juntamente con los resultados anteriores, si se han seguido los pasos y no ha ocurrido nada fuera de lo normal debería mejorar bastante.