Configuración de módulos de mod_pagepeed en Ubuntu 18.04 para Apache 2
Introducción
Después de instalar mod_pagespeed es necesario configurar nuestro módulo dependiendo de la necesidades que tengamos para nuestra página web e incluso dependiendo de las capacidades de nuestro servidor.
Hay que tomar en cuenta que hay varios niveles de configuración ya sea en el área principal de apache y también se puede realizar la configuración directamente en el virtualhost, en este caso vamos a con los archivos de virtualhost para poder tomar el control de cada uno de los sitios de nuestro servidor.
Mod pagespeed coloca por default varios archivos en nuestro servidor entre ellos pagespeed.conf en donde se encuentran todas las configuraciones, si lo queremos editar podemos hacerlo asi:
vim /etc/apache2/mods-available/pagespeed.conf
Deshabilitamos mod pagespeed en un solo sitio
En lugar de editar pagespeed.conf es mas recomendable editar los virtualhost de cada uno de nuetros sitios. En mi caso voy a des habilitar mod_pagespeed de mi sitio programadornovato asi:
vim /etc/apache2/sites-available/programadornovato.com.vhost
Agregamos estas lineas de codigo:
# Deshabilitar mod pagespeed
ModPagespeed off
Para que tomen efecto los cambios reiniciamos apache asi:
sudo service apache2 restart
Ahora podemos ir a comprobar que mod_page speed esta des habilitado en nuestro sitio:
Ahora para habilitar mod pagespeed colocamos este codigo:
# Habilitar
ModPagespeed on
Y reiniciamos apache
sudo service apache2 restart
Activar y desactivar filtros
Para activar un o varios filtros debemos colocar este codigo:
ModPagespeedEnableFilters nombre_modulo,nombre_otro_modulo
Para desactivar un o varios filtros debemos colocar este codigo:
ModPagespeedDisableFilters nombre_modulo,nombre_otro_modulo
Lista de filtros principales
Filter Name | Brief Description |
responsive_images | Hace responsive las imagenes agregando srcset con imagenes optimizadas para varias resoluciones (Requiere resize_images para funcionar). |
add_head | Agrega el elemento <head> al HTML (solo si el <head> no esta presente) |
combine_heads | Une (combina) todos los <head> que encuentra en el documento. |
inline_import_to_link | Dentro de los elementos <style> que continene solo CSS sustituye los elementos @imports por su equivalente en <link>. |
outline_css | Saca los CSS muy grandes para que puedan ser archivos cacheables. |
outline_javascript | Saca los JS muy grandes para que puedan ser archivos cacheables. |
move_css_above_scripts | Mueve los elementos CSS arriba de los elementos <script>. |
move_css_to_head | Mueve los elemntos CSS dentro del <head>. |
combine_css | Une (combina) todos los CSS que encuentra en el documento. |
rewrite_css | Vuelve a escribir los archivos CSS para eliminar el exceso de espacio en blanco y los comentarios y, si está habilitado, reescribe o almacena en caché las imágenes a las que se hace referencia en los archivos CSS. En el modo OptimizeForBandwidth, la minificación se realiza in situ sin cambiar las URL. |
fallback_rewrite_css_urls | Reescribe los recursos a los que se hace referencia en cualquier archivo CSS que, de lo contrario, no se pueden analizar ni minimizar. |
rewrite_style_attributes | Reescriba el CSS en los atributos de estilo aplicando el filtro rewrite_css configurado. |
rewrite_style_attributes_with_url | Reescriba el CSS en atributos de estilo si contiene el texto ‘url (‘ aplicando el filtro rewrite_css configurado en él. |
flatten_css_imports | CSS en línea al aplanar todas las reglas de @import. |
prioritize_critical_css | Reemplaza las etiquetas CSS con versiones en línea que incluyan solo el CSS utilizado por la página. |
make_google_analytics_async | Convertir el script sincrónico de la API de Google Analytics a asíncrono. |
make_show_ads_async | Convertir el script sincrónico de la API de Google AdSense a asíncrono. |
rewrite_javascript | Vuelve a escribir los archivos JavaScript para eliminar el exceso de espacio en blanco y los comentarios. En el modo OptimizeForBandwidth, la minificación se realiza in situ sin cambiar las URL. |
rewrite_javascript_external | Implícito en rewrite_javascript. Vuelve a escribir los archivos externos de JavaScript para eliminar el exceso de espacio en blanco y los comentarios. En el modo OptimizeForBandwidth, la minificación se realiza in situ sin cambiar las URL. |
rewrite_javascript_inline | Implícito en rewrite_javascript. Reescribe los bloques de JavaScript en línea para eliminar el exceso de espacios en blanco y los comentarios. |
include_js_source_maps | Agrega mapas de origen a archivos JavaScript reescritos. |
combine_javascript | Une (combina) todos los elementos de script que encuentra en el documento. |
canonicalize_javascript_libraries | Redirige las librerias de JavaScript a un servidor de hosting de JavaScript. |
inline_css | Inserta el contenido de pequeños archivos CSS en el documento HTML. |
inline_google_font_css | Inserta el contenido de pequeños archivos CSS utilizados por fonts.googleapis.com en el documento HTML. |
inline_javascript | Inserta el contenido de pequeños archivos JS en el documento HTML. |
local_storage_cache | Cache inlined resources in HTML5 local storage. |
insert_ga | Agrega el fragmento de Google Analytics a cada página HTML. |
rewrite_images | Optimiza las imágenes, recodificándolas, eliminando el exceso de píxeles e insertando imágenes pequeñas. En el modo OptimizeForBandwidth, la minificación se realiza in situ sin cambiar las URL. |
convert_jpeg_to_progressive | Convierte archivos JPEG más grandes a formato progresivo. Implícito en recompress_images. |
convert_png_to_jpeg | Convierte imágenes gif y png en jpegs si parecen ser menos sensibles a los artefactos de compresión y carecen de transparencia alfa. Implícito en recompress_images. |
convert_jpeg_to_webp | Genera una imagen webp (con pérdida) en lugar de imágenes jpeg para navegadores compatibles con webp. Implícito en recompress_images. |
convert_to_webp_animated | Reemplaza las imágenes gif animadas por imágenes webp en los navegadores que admiten el formato. |
convert_to_webp_lossless | Reemplaza las imágenes gif no animadas y png con imágenes webp en los navegadores que admiten el formato. Implícito en rewrite_images. |
insert_image_dimensions | Agrega los atributos de ancho y alto a las etiquetas <img> que carecen de ellos. |
inline_images | Reemplaza pequeñas imágenes por bydata: urls. Implícito en rewrite_images. |
recompress_images | Vuelve a comprimir las imágenes, eliminando el exceso de metadatos y transformando gifs en pngs. Implícito en rewrite_images. |
recompress_jpeg | Vuelve a comprimir los archivos JPEG, eliminando el exceso de metadatos. Implícito en recompress_images. |
recompress_png | Recomprime pngs, eliminando el exceso de metadatos. Implícito en recompress_images. |
recompress_webp | Vuelve a comprimir webps, eliminando el exceso de metadatos. Implícito en recompress_images. |
convert_gif_to_png | Optimiza gifs a pngs. Implícito en recompress_images. |
strip_image_color_profile | Elimina la información del perfil de color de las imágenes. Implícito en recompress_images. |
strip_image_meta_data | Desmota metadatos EXIF de imágenes. Implícito en recompress_images. |
jpeg_sampling | Reduce la muestra de color de las imágenes jpeg a 4:2:0. Implícito en recompress_images. |
resize_images | Redimensiona las imágenes cuando la etiqueta <img> correspondiente especifica un ancho y una altura más pequeños. Implícito en rewrite_images. |
resize_rendered_image_dimensions | Redimensiona una imagen cuando las dimensiones renderizadas de la imagen son más pequeñas que la imagen real. Implícito en rewrite_images. |
inline_preview_images | Utiliza imágenes en línea de baja calidad como marcadores de posición que se reemplazarán con imágenes originales una vez que se cargue la página web. |
resize_mobile_images | Funciona igual que inline_preview_images, pero usa imágenes de marcadores de posición más pequeñas y solo sirve para los navegadores móviles. |
remove_comments | Elimina comentarios en archivos HTML (pero no en JavaScript o CSS en línea). |
collapse_whitespace | Elimina el exceso de espacio en blanco en los archivos HTML (evitando <pre>, <script>, <style> y <textarea>). |
elide_attributes | Elimina atributos que no son significativos de acuerdo con la especificación HTML. |
extend_cache | Extiende la vida útil de la caché de CSS, JS y los recursos de imagen que de otra forma no se han optimizado, firmando URL con un hash de contenido. |
extend_cache_css | Extiende el tiempo de vida de la caché de los recursos CSS que no se han optimizado al firmar URL con un hash de contenido. Implícito en extend_cache. |
extend_cache_images | Extiende el tiempo de vida de la caché de las imágenes no optimizadas al firmar URL con un hash de contenido. Implícito en extend_cache. |
extend_cache_scripts | Extiende la duración de la caché de los scripts no optimizados al firmar URL con un hash de contenido. Implícito en extend_cache. |
extend_cache_pdfs | Extiende la duración de la caché de los PDF firmando URL con un hash de contenido. |
sprite_images | Combina imágenes de fondo en archivos CSS en un solo sprite. |
trim_urls | Acorta las URL al hacerlas relativas a la URL base. |
pedantic | Agrega tipos predeterminados para las etiquetas <script> y <style> si el atributo type no está presente y la página no es HTML5. El propósito de este filtro es ayudar a garantizar que PageSpeed no rompa la validación de HTML4. |
remove_quotes | Elimina las comillas alrededor de los atributos HTML que no son requeridos léxicamente. |
add_instrumentation | Agrega JavaScript a la página para medir la latencia y enviarlo de vuelta al servidor. |
convert_meta_tags | Agrega un encabezado de respuesta para cada meta tag con el atributo anhttp-equiv. |
defer_javascript | Aplaza la ejecución de JavaScript en HTML hasta que se complete la carga de la página. |
dedup_inlined_images | Reemplaza las imágenes en línea repetidas con JavaScript que carga la imagen desde la primera aparición de la imagen. |
lazyload_images | Carga imágenes cuando se hacen visibles en la ventana gráfica del cliente. |
insert_dns_prefetch | Inserta <link rel=”dns-prefetch” href=”//www.example.com”>tags para reducir el tiempo de resolución de DNS.. |
hint_preload_subresources | Inserta Link:</example.css>; rel=preload headers para permitir la obtención anticipada de recursos importantes.. |