Grosshat crece :)

23 de enero, 2010 - por | | Just for fun

El 22 de enero Grosshat se despertó con una figurita más. Venía algo retorcido y no resultó fácil atraerlo hacia fuera, pero una vez que lo conseguimos, ya nos dijo que venía para quedarse. Así que le hicimos su rinconcito, con un poco de algodón dulce sobre las heridas del pasado.

En nuestro espacio en Flickr ya es el principal protagonista. Algunas de nuestras preferidas son éstas:


Siempre está rodeado de Regaliz, Estufito y el resto de amigos de Anita. :D

Artistas del mail

12 de diciembre, 2009 - por | | Curiosidades, Kernel

Si has tenido la curiosidad de trastear alguna vez con el kernel de linux, habrás visto que hay todo un directorio dedicado a documentación, tanto general como particular, ésta última organizada a su vez en directorios que se corresponden con las partes del sistema.

Bueno, el caso es que dentro de la documentación general hay varias joyitas literarias, entre las que suelen destacar las firmadas por Linus Torvalds, el alma mater del proyecto. Una de esas joyitas es el fichero “email-clients.txt”, que describe algunos de los requisitos que debe tener el cliente de email con el que trabaje el desarrollador. ¿Por qué? Pues porque los patches para el kernel de linux se envían a través de emails, y a poder ser, como texto dentro del cuerpo del mensaje. Ésto no es siempre así; el “mantainer” del código puede que acepte adjuntos, pero incluso en ese caso, hay toda una serie de reglas que deberías respetar cuando compongas el adjunto.

Es un nivel de detalle, y para algo que ya nos es tan familiar, que estas cosas son las que me conquistan siempre dentro del espíritu de linux: no hay ninguna barrera humana -cualquiera puede hacerte llegar el patch-, pero se establecen ciertas convenciones -que éstas sí se siguen rigurosamente- para que el trabajo resulte productivo y esa no-barrera pueda llegar a ser una realidad. Por ahí le vas viendo el sentido a toda la arquitectura liviana del entorno: “todo se trata como un fichero”, “pequeñas utilidades que se interconectan”, “cuanto más complejo, más probabilidad de errores”, etc.

Para que veais lo seria que se pone la cosa con la composición de emails, transcribo algunas de las convenciones:

Don’t let your email client do automatic word wrapping for you. This can also corrupt your patch.

Email clients should generate and maintain References: or In-Reply-To:
headers so that mail threading is not broken.

It’s a good idea to send a patch to yourself, save the received message,
and successfully apply it with ‘patch’ before sending patches to Linux
mailing lists.

Lotus Notes (GUI) Run away from it.

Si te parece interesante, échale a un vistazo a otros ficheros tan instructivos como éste en el repositorio del proyecto.

Lecciones de bazaares

13 de noviembre, 2009 - por | | Open Source

En el libro de Eric Raymond, The Cathedral & the Bazaar, hay una parte que me gusta especialmente: aquélla en la que el autor reconoce cómo de chocante les resultó, incluso a los mismos que se encontraban ya en los círculos del desarrollo abierto entre los 80 y los 90, la forma en que el por entonces emergente linux se organizaba. Es donde mejor se aprecian las diferencias entre los 2 mundos que dan título al libro: la catedral que ellos conocían como forma de trabajar, relacionarse y construir, frente al bazaar linuxero lleno de novedades más sociales que técnicas.

Algunas de las que más me gustan:

  • no hay barreras de entrada, la contribución puede llegar de cualquiera en cualquier momento
  • los usuarios se transforman en co-desarrolladores
  • no tiene sentido no beneficiarse de una base cuanto más grande mejor de beta-testers y co-desarrolladores que a la postre se acaban convirtiendo en otras partes del proyecto
  • las fronteras tradicionales entre los profesionales/especialistas y los “otros” se diluyen

Las sensaciones que debieron tener todos aquellos grupos de ingenieros altamente especializados, que habían conseguido hacerse con un espacio propio donde ellos ponían las reglas y marcaban las distancias respecto de todo lo “externo”, seguro que fueron muy mezcladas. Otra vez, las batas se diluían, como habían hecho ellos a su vez con la generación anterior, para dar paso a una nueva forma de hacer las cosas que encima se demostraba productiva.

La evolución otra vez: les llegaba el turno esta vez a los barbudos que un día jubilaron a los encorbatados. Es algo que aún hoy no se ha acabado de asimilar, y todas las modas de palabras sobre redes sociales, web 2.0, etc. dicen mucho al respecto.

Herramientas para la calidad front

20 de agosto, 2009 - por | | Calidad, Frontend

Cuando se dispone de cierta cantidad de código funcionando y estable, es conveniente empezar a pensar en términos de calidad. Del lado front la cosa no es distinta, y existen varias herramientas plenamente funcionales que nos pueden hacer la vida más fácil, al menos para empezar a poner las bases.

Para que todo nos resulte más manejable, es conveniente separar 3 partes del área front:

  • el marcado (html/derivados y css)
  • la interacción (javascript)
  • la disponibilidad (pesos, cabeceras, peticiones)

Para la primera parte existen algunos principios generales que permiten definir una orientación general de cara a la calidad, así como varias herramientas que ayudan a concretar esos principios. De éstas sin duda la que ha llegado a hacerse más popular ha sido la que tiene que ver con la validación del marcado html/xhtml, que se refleja en los conocidos iconos del W3C indicando si el documento ha pasado cierta validación.

Para la segunda parte se han ido asentando, con el tiempo, varias directrices generales, así como diferentes herramientas a nivel de análisis sintáctico, debugging y testing. La popularización de librerías marco, asociadas a plugins para funcionalidades concretas, ha introducido mayores niveles de calidad como punto de partida, pero también ha conducido el desarrollo a un entorno más complejo y, por lo tanto, potencialmente más difícil de mantener.

Por último, de cara a la disponibilidad el creciente uso intensivo de interacción ha llevado progresivamente a una mayor conciencia sobre la importancia de establecer rangos de pesos, tiempos de expiración para las cabeceras, y máximos de peticiones asumibles. Y estas ideas cuentan ya con algunas herramientas que permiten analizarlas y cuantificarlas, haciendo que la optimización sea un objetivo pragmático.

Voy a intentar recorrer esas 3 partes en diferentes entradas con la intención de:

  1. llamar la atención sobre los procesos de calidad en el área front;
  2. ayudar a que se entienda un poco mejor la interrelación entre las 3 partes mencionadas;
  3. recopilar ideas comunes y herramientas frecuentes del trabajo diario;
  4. poner mi granito de arena para que se entienda qué consigue cada proceso de calidad, de forma que no se mezclen ni se asocie burdamente calidad con eliminación completa de problemas.

Charla de Nate Koechley, desarrollador front de Yahoo! – séptima entrega -

20 de julio, 2009 - por | | Análisis, Frontend

El 18 de marzo se publicó en YUI Theater la charla de Nate Koechley, primer ingeniero front de yahoo! Grosshat ha pensado que sería interesante traducir al español algunas partes con mucha sustancia de la transcripción de la charla, ya que resultan muy esclarecedoras sobre el desconocido papel que desempeña el desarrollador front en las empresas que se dedican a la web (frontend engineer en USA).

Nuestra traducción de la séptima parte de la charla

Ahora vamos a echarle un vistazo a la perspectiva histórica hablando sobre algunas de las creencias y principios. Me gustarÍa profundizar en algunas de las principales partes de la tecnología que tienen que tener en cuenta un ingeniero del interfaz.

Lo primero es el contenido de la capa: la capa HTML. Debe ser lo primero en el día a día de trabajo – queremos conseguir unas base sólida, antes de comenzar con otras partes tecnológicas. Antes de ponerte a escribir HTML tienes que definir en qué tipo de HTML vas a escribir mediante el doctype. ¿Qué es el doctype? El doctype es lo primero que aparece en un documento HTML. El elemento contiene una indicación sobre la definición del tipo de documento – lo cual sirve de indicación definitoria para el lector de la hoja, es decir, es una explicación de la tecnología que estás utilizando. En la práctica esto es importante porque da lugar a que los navegadores se comporten de modos diferentes. A principios de esta década, dado que los más modernos navegadores se estaban desarrollando, existía la preocupación de que si no se fijaban las singularidades de los viejos tiempos, los sitios que no se actualizasen podrían tener dificultades de renderización en los nuevos navegadores. Por lo que se quería ofrecer una forma de apoyar la idea de la compatibilidad con versiones anteriores, de sitios estrafalarios, a pesar de que los desarrolladores estaban empezando a crear más estándares basados en los sitios. Así que los vendedores de los navegadores eligieron el doctype como la forma de que los autores del documento – desarrolladores, fronted – optaran por alguno de los formatos existentes. En Yahoo!, utilizamos el HTML Estricto 4.01 DTD dentro de nuestro doctype, y esto, junto con varios otros doctypes, le dice al navegador el estándar que seguimos.

Una cosa más sobre el modo de los estándares vs al modo de las peculiaridades. Los navegadores realizan un gran trabajo como adivinos – somos capaces de lanzarles código propenso a errores pero los navegadores están diseñados para ser resistentes así que arreglan muchos de los fallos o hacen su mejor aproximación. Ellos hacen un buen trabajo de adivinación pero hacen un mejor trabajo si no tienen que adivinar en nuestro nombre. Así que como ingenieros fronted, nosostros debemos definir exactamente el lenguaje en el que escribimos – en este caso el HTML Estricto 4.01 – y eso nos asegurará obtener la mejor visualización posible.

La segunda cosa que me gustaría comentar sobre el marcado: ¿cuál es la presentación por defecto de los elementos HTML? ¿Cómo se pinta un elemento strong? ¿Y un H1? ¿Y una lista? Y son preguntas con trampa porque el marcado no tiene una presentación visual inherente – no hay nada en el HTML en sí mismo que diga que un elemento H1 tiene que ser grande y destacado y con mucho margen alrededor de él. Eso, en realidad, lo define la css dentro del navegador. Y así, darnos cuenta de que el marcado no tiene una visualización inherente nos libera para usarlo tal y como fue diseñado. El trabajo del marcado mejora el contenido de la página y se envuelve de aquellos elementos que le dan al contenido más significado. Podemos coger una cadena de texto y decir: esta es la cabecera. Podemos coger una serie de frases y decir: esto es una lista. Marcas lo que tienes y lo enriqueces con más significado.

Pero como ya he mencionado, los diferentes navegadores llaman al fichero interno CSS que nos proporciona la presentación de los elementos HTML, incluso de aquellos elementos que no forman parte del HTML en sí mismo. Esta es la razón por la que hemos creado, como parte de la librería YUI de Yahoo!, un fichero que se llama “CSS Reset”. Este fichero normaliza la presentación de los elementos HTML en diferentes navegadores. Si tienes un fichero CSS Reset, ya sea el de YUI o el que hayas desarrollado tú mismo, las páginas se van a ver iguales – hemos hecho que el navegador quiera usar nuestra preesentación inicial – reduciendo así el campo de juego. Así que en este caso ùedes cer que en la primera línea hay una cabecera h3 y, después, un h4, h5 y h6. Aquí obtenemos una lista y aquí otra. Y podríamos esperar que la lista se comportara con puntos o números – nosotros los hemos suprimido, así que sólo tratamos con HTML sin pensar en cómo podría verse en la página. Esto nos libera, realmente, y nos hace ocuparnos de qué elemento utilizar preocupándonos, únicamente, de su significado.

Charla de Nate Koechley, desarrollador front de Yahoo! – sexta entrega -

26 de junio, 2009 - por | | Análisis, Frontend

El 18 de marzo se publicó en YUI Theater la charla de Nate Koechley, primer ingeniero front de yahoo! Grosshat ha pensado que sería interesante traducir al español algunas partes con mucha sustancia de la transcripción de la charla, ya que resultan muy esclarecedoras sobre el desconocido papel que desempeña el desarrollador front en las empresas que se dedican a la web (frontend engineer en USA).

Nuestra traducción de la sexta parte de la charla

Así que estas son las tres técnicas básicas que nos ayudan a alcanzar o mantener nuestra mirada hacia las cuatro prioridades que se establecieron al principio. Hay un montón de opciones que deben tenerse en cuenta. Y queremos mostrar todas las opciones que apoyan nuestros principios – pero hay algunas otras cosas a tener en cuenta en función de la elección tecnológica del día a día de trabajo.

En primer lugar, siempre queremos hacer lo correcto. Y lo correcto significa seguir los estándares siempre que sea posible. Si existe un estándar, nuestro trabajo es seguirlo – si funciona, en nuestro caso. En algunos casos, todavía no existe un estándar o está surgiendo, y en esos casos está bien seguir las convenciones. Por lo tanto, si no podemos seguir el estándar – si no hay estándar definido – entonces, echaremos un vistazo a los estándares que están surgiendo o al convenio común que sigue la industria y tratar de hacerlo. Y sólo cuando esas cosas fallan – sólo cuando no podemos seguir un estándar y no puedes apoyarte en un estándar nuevo – entonces, vuelves a la mesa de dibujo y diseñas una técnica nueva para ese caso en particular. Como ingenieros, y diseñadores, existe siempre la tentación de reinventar algo nuevo y más ingenioso – pero para la salud de la Internet, y para la estabilidad de tu proyecto, es aconsejable seguir los estándares y los que van surgiendo siempre que sea posible. Si lo estás haciendo de cualquier forma – si vas por el camino menos visitado – entonces recuerda el principio de apertura y documenta lo que estás haciendo, y exponlo a discusión como posible estándar futuro.

Además de querer hacer lo correcto, siempre queremos ser considerados. Queremos ser considerado con nuestros compañeros desarrolladores, y con nuestros usuarios. Esto significa hacer la cosa lo más simple posible – no recibes puntos de bonificación por encontrar la forma más compleja que hacer algo. Hay por lo general la belleza en la simplicidad. La segunda forma de ser considerado es el ser flexibles. Tenemos diferentes propiedades en Yahoo!, así que cuando somos flexibles en el trabajo que hacemos, beneficia a otras personas de la empresa y del sector. Así que no se trata sólo de pensar en la valoración de los widgets para un sitio web de fotografía, también se trata de imaginar cómo se puede utilizar en un sitio web de cine, o en un blog, o en cualquier otro sitio. Así las cosas que flexibilizamos a través del contexto también se flexibilizan a través de la tecnología – las cosas que vas a trabajar para tu página se abren para todo el mundo. Y, al final, será considerado por estar abierto. Coger lo que hemos aprendido, documentarlo, y subir la API y los procesos que, por definición, están abiertos.

Lo último a tener en cuenta es el cómo tomar decisiones, es mantener el sentido de la empatía. Trabajamos al servicio de nuestros usuarios, y es nuestro trabajo ofrecer una experiencia de usuario fantástica – pero no es nuestro único objetivo. También tenemos que recordar que nuestro trabajo influye en los desarrolladores del sector y de nuestra empresa, y también lo hacen las máquinas que posibilitan estos sitios web. Determinados patrones de JavaScript son más comprensibles que otros, y así si es el mismo para el usuario y para el equipo de desarrolladores, debes elegir el que va a estar más optimizado para las máquinas. Pero recuerda siempre – a pesar de que hemos descrito los tres tipos de público, los usuarios son nuestra principal preocupación. Está bien entre nosotros sufrir un poco si es para dar al usuario una mejor experiencia, que es para lo que estamos aquí.