Resaltado de sintaxis en tu web

Durante el cambio de Drupal a Blogger me surgió el problema del resaltado de sintaxis. En los artículos de mi web hay mucho código, y éste es uno de los puntos más importantes. En muy poco tiempo he visto tres maneras diferentes de gestionarlo y me gustaría compartirlas con vosotros. No sería justo olvidar que la solución final la encontré gracias a un comentario de Ángel Guzmán.

Opción Drupal: GeSHi

Cuando usaba Drupal siempre utilizaba la opción fácil: El módulo GeSHi para Drupal . Este modo tiene una ventaja: lo gestiona todo Drupal y no tenemos que preocuparnos por nada. También tiene una desventaja: lo gestiona todo Drupal y si queremos migrar somos incompatibles con todo.

Es un formato muy sencillo, ya que basta con incluir unas marcas especiales code indicando, de forma opcional, el lenguaje del código.

Opción hardcoded

La segunda opción que utilicé durante la migración fue traducir el código a HTML mediante algún traductor, como highlight (paquete Debian).

En este caso se consigue un buen resultado y rápido de cargar, pero con muchas pegas. La primera es que consume mucho más espacio. Requiere numerosas marcas y cambios de formato, lo que constituye una gran carga. Además, ofusca todo el código y cualquier modificación posterior es un infierno. Pero el mayor problema de esta solución es la poca versatilidad: si necesitas cambiar el formato tienes que reescribir todo el código e ir aplicándolo trozo a trozo.

Opción GitHub

En el repositorio GitHub tienes la posibilidad de añadir Gists. Estos gists consisten en pequeños trozos de código indexable y con control de versiones.

La gran ventaja de este formato es que tienes todo el código junto y con control de versiones. La gran desventaja, que en seguida tienes miles de Gists difíciles de gestionar y que tienes el código separado del resto de tu artículo. Como ventaja adicional, puedes compartir el código entre distintos artículos. Pero esto es arriesgado, ya que un artículo puede requerir una modificación que entorpezca la lectura del otro, por lo que en la práctica no lo compartirás.

Otro problema adicional es que los feeds no resuelven las direcciones, por lo que puedes perder el código en estos feeds.

Opción SyntaxHighlighter

Exiten algunas soluciones dinámicas, como es el caso de SyntaxHighligther . En este caso tenemos un puñado de archivos JavaScript y un formato simple en nuestro código, muy similar al que necesitábamos en Drupal. Además, las marcas son estándar, por lo que los feeds perderán el formato pero seguirán siendo legibles.

Si no confías en que los archivos javascript vayan a continuar en el servidor, puedes copiártelos a tu site. Utilizar los comunes tiene una ventaja: los navegadores cachean los archivos javascript que utilizan las webs, con el fin de reutilizarlos si se trata de acceder a la misma URL. De esta manera, si tenemos la suerte de que ya han accedido a otro site que requería los mismos archivos javascript, conseguiremos una mayor velocidad de carga. Además, así las nuevas versiones las gestiona otro :D

También me ha sorprendido la gran versatilidad, ya que puedes resaltar líneas o cambiar el formato.

Veamos un ejemplo:

1
2

print 'Esto es el típico hola-mundo en python'
print 'Y esta línea estará resaltada'

¿Desventajas? Carga un poco más lento que otras soluciones y la página en general pesará más. Además, tienes que seleccionar un nuevo javascript por cada lenguaje que quieras soportar. Si estás usando un sistema de blogs público (como Blogger) o simplemente genérico (como Drupal), no te queda más remedio que meter esos javascripts en todas la plantilla, apareciendo en todas las páginas. Tampoco es demasiado grave, ya que cuando los usuarios repitan, tendrán los archivos javascript ya descargados en su máquina.

La gran ventaja es que cambiando el estilo en la plantilla, cambiará el estilo del código de todo tu site (si no has hecho marranadas especificándolo a capón).

Un saludo.