Por qué Gumroad no eligió Htmx

• Gumroad consideró htmx al iniciar su nuevo proyecto Helper.
• Querían usar htmx para evitar la complejidad de React, pero hubo opiniones divididas dentro del equipo.
• Al principio, htmx parecía prometedor para agregar interacciones simples.

Limitaciones de htmx

• Intuitividad y experiencia del desarrollador: trabajar con htmx no resultó más intuitivo que con Next.js. Al implementar formularios complejos y validación dinámica, la lógica del lado del servidor se volvió más complicada.
• Limitaciones de UX: htmx adopta por defecto un enfoque tipo Rails/CRUD, lo que hizo que la experiencia de usuario se volviera monótona. Implementar una interfaz de arrastrar y soltar fue más difícil que con React.
• Soporte de IA y herramientas: Next.js se lleva bien con las herramientas de IA, pero htmx no tanto. Esto afectó la velocidad de desarrollo y la resolución de problemas.
• Problemas de escalabilidad: a medida que el proyecto se volvió más complejo, htmx no pudo seguir el ritmo de los requisitos. Al agregar colaboración en tiempo real y visualización de datos compleja, la gestión de estado se volvió difícil.
• Comunidad y ecosistema: el ecosistema de React/Next.js es maduro y ofrece diversas soluciones, mientras que htmx no.

Decisión final: cambio a React/Next.js

• React/Next.js era más adecuado para construir una UX compleja.
• Aprovecharon las ventajas de React en funciones como arrastrar y soltar, gestión de estado compleja, generación dinámica de formularios, colaboración en tiempo real y optimización del rendimiento.
• Cambiaron a React para superar las limitaciones de htmx, y esto respalda la visión de largo plazo del proyecto.
• Están satisfechos con esta decisión y, por ahora, les ha permitido avanzar más rápido, crear una experiencia de usuario más atractiva y aprovechar las herramientas y bibliotecas existentes.

Lecciones aprendidas de la experiencia

• Es importante considerar alternativas ligeras, pero también elegir una tecnología que pueda crecer junto con el proyecto y respaldar una visión de largo plazo.
• En el caso de Helper, React y Next.js demostraron ser esa elección, y desde la migración pudieron mejorar significativamente la experiencia de usuario de la app para sus clientes principales.

Resumen de GN⁺

• La experiencia de Gumroad muestra que es importante considerar alternativas ligeras, pero también elegir una tecnología que pueda respaldar el crecimiento del proyecto y su visión de largo plazo.
• htmx puede ser adecuado para modelos de interacción simples o aplicaciones existentes renderizadas en el servidor.
• Para la interfaz compleja y basada en estado de Helper, React y Next.js fueron una mejor opción.
• La pila tecnológica puede reevaluarse según las necesidades, y es importante mantener la flexibilidad cada vez que aparecen nuevas tecnologías.

[GN⁺]

Comentarios en Hacker News

• El CEO de Gumroad compartió su experiencia de haber probado htmx y luego cambiarse a NextJS. Fue información útil para quienes buscaban experiencias negativas con htmx

  • Las herramientas de IA están familiarizadas con Next.js, pero no con htmx. Esto plantea una predicción importante sobre el futuro de las herramientas de desarrollo
  • Existe la predicción de que los LLMs reforzarán la estructura existente de que el ganador se lo lleva todo y fomentarán el uso de herramientas de código abierto

• Al crear formularios complejos, la lógica del lado del servidor se volvió más complicada y difícil que el trabajo del lado del cliente en React

  • Hay un meme que enfatiza que la validación también debe implementarse del lado del servidor

• Intentaron mantener ligero el frontend con htmx, pero terminaron usando bibliotecas de terceros para manejar una UI/UX compleja y la gestión de estado

  • Hay quien opina que trabajar en React fue más fácil porque usaron bibliotecas de terceros
  • También hay opiniones de que, si había que manejar estados complejos y renderizado, entonces htmx probablemente no era una buena elección desde el principio

• Fue difícil implementar una interfaz de arrastrar y soltar con htmx, y con una biblioteca de React pudieron obtener una experiencia más fluida

  • Con htmx, lo ideal es usar solo el bundle de frontend que realmente haga falta
  • Se puede aprovechar el evento htmx.onLoad para encontrar markup con atributos en el contenido cargado y conectarlo

• El equipo parece sentirse más cómodo con el desarrollo frontend y tuvo dificultades para comunicarse con el backend

  • Se reconocen las ventajas de los componentes de React y la facilidad para encontrar documentación y ayuda

• Hay opiniones de que el proceso de desarrollo con Next.js se sintió más natural

  • También hay opiniones de que la sintaxis de ReactJS no se siente natural

• A HTMX le parece interesante compartir este tipo de experiencia, y hay quien opina que existen proyectos para los que HTMX por sí solo no es suficiente

  • Se vuelve a enfatizar que la validación de formularios también es necesaria en el backend
  • Resulta interesante el caso de un equipo que llegó a depender mucho de herramientas de IA
  • Hay opiniones de que hacen falta plugins que puedan compensar las limitaciones de HTMX

• Hay elogios hacia HTMX.org por alojar este tipo de ensayo

• Existe preocupación de que las herramientas de IA puedan dificultar la adopción de nuevos frameworks o lenguajes de programación

  • Se imagina la posibilidad de que influyan en las herramientas de desarrollo de forma similar al SEO

• Se imagina la posibilidad de que influyan en las herramientas de desarrollo de forma similar al SEO