Optimizando las prestaciones para sacar tremenda nota en PageSpeed Insights

  • 21 Dic 2015
  • Drupal 7

La selección de las distintas herramientas, módulos y configuraciones que ofrece Drupal para optimizar sus prestaciones dependerá seguramente de la topología de cada sitio. Raramente la misma receta sirva a dos pacientes completamente distintos. Igualmente, la mayor parte de los puntos a tener en cuenta antes de salir online son válidos para más de un escenario. Esta guía toma los puntos principales. Para cada caso, será necesario estudiar la mejor solución.

1. Desactivar módulos y funciones de desarrollo

Antes de comprimir archivos, trabajar con aggregation, etc, sería conveniente reducirlos al mínimo. No solo para mejorar las prestaciones (lo que no se cargue, no pesa) si no también desde el punto de vista de la seguridad. Un ejemplo es el módulo devel que es fundamental a la hora de desarrollar pero inútil para el funcionamiento del sitio. Otros módulos son igualmente necesarios pero necesitan una configuración particular mientras se desarrolla que debemos revertir antes de pasar el sitio al ambiente productivo. Revisar las configuraciones de:

  • Theme: Rebuild theme registry on every page
  • Less: Desactivar LESS developer mode

Dependiendo del escenario, podría ser importante prevenir la carga de archivos js y css directamente en el theme utilizando hook_css_alter y hook_js_alter. Si se utiliza un subtheme de Bootstrap pueden excluirse directamente en el archivo .info del theme. Seguramente también sea posible con otros tipos de templates

;Exclude
;css
exclude[css][] = sites/all/themes/bootstrap/bootstrap/css/bootstrap.css
exclude[css][] = sites/all/themes/bootstrap/bootstrap/css/bootstrap-responsive.css

;Exclude
;javascript
exclude[js][] = sites/all/themes/bootstrap/bootstrap/js/bootstrap.js

2. Reducir HTML, CSS y JS

De la misma manera que comprimimos imágenes con el fin de hacer más liviana una página web, los archivos css y javascript también deben ser comprimidos. Un módulo alternativo al core de Drupal es minify. Su configuración es muy simple. Minify agrega la opción minify html en admin/config/development/performance y la pestaña Minify JavaScript files que sirve para comprimir individualmente cada uno de los archivos javascript de Drupal.

Drupal Performance - Minify HTML

3. JS y CSS Aggregation

Una vez que logramos reducir la cantidad de archivos al mínimo necesario, se procese con la aggregation. Básicamente, aggregation consiste en agrupar una serie de archivos para reducir el número de solicitudes al servidor. El mejor módulo al momento en ocuparse de esta tarea (mejorando la función ya incluida en el core de Drupal) es Advanced CSS/JS Aggregation. También sería conveniente instalar el módulo HTTP Parallel Request & Threading Library que puede ser utilizado por adv css/js aggregation.

Drupal Performance - Advanced CSS/JS Aggregation

4. Habilitar compresión desde .htaccess

Dependiendo del hosting donde se aloje el sitio será posible o no, de una manera u otra habilitar la compresión gz o deflate de los archivos. El siguiente es un ejemplo del código necesario en el archivo .htaccess para habilitar la compresión deflate.

<IfModule deflate_module>
    AddOutputFilterByType DEFLATE text/css text/csv text/html text/plain text/richtext text/sgml text/tab-separated-values application/javascript application/x-javascript httpd/unix-directory
    AddOutputFilter DEFLATE html htm shtml php php4 pl rb py cgi css js txt
    BrowserMatch ^Mozilla/4 gzip-only-text/html
    BrowserMatch ^Mozilla/4\.0[678] no-gzip
    BrowserMatch \bMSIE !no-gzip !gzip-only-text/html
  </IfModule>

Una vez hecho todo esto, podremos pedirle a google que nos indique donde seguir trabajando. Visitar PageSpeed Insights, ingresar la url del sitio y comprobar el resultado en los puntos Should Fix y Consider Fixing.

Para solucionar "eliminate render-blocking JavaScript and CSS in above-the-fold content" existe un módulo en Drupal llamado magic, que entre otras cosas se ocupa de mover los archivos js al footer. Su configuración se realiza desde la configuración del theme. También sirve a excluir archivos css y js inútiles.

Una  vez terminado el trabajo de optimización del rendimiento de Drupal, podemos pasar al de mejorar el sistema de la caché.