Por qué On Running elige Nuxt para su web

Respuesta corta: On Running construye su tienda online con Nuxt, el framework basado en Vue que genera las páginas en el servidor antes de enviarlas al navegador. Para una marca de retail con un catálogo grande y campañas estacionales, la elección tiene sentido por tres motivos: velocidad, SEO y separación entre contenido y presentación.

Una aclaración antes de seguir: no conocemos la arquitectura interna de On. Sabemos qué framework usa su web porque se ve desde fuera, pero no qué gestor de contenidos, qué backend ni qué proveedores tiene detrás. Lo que sigue es por qué Nuxt encaja en un caso así y qué puede aprender de ello una empresa mucho más pequeña.

Por qué la velocidad es dinero en retail

En una tienda online, cada segundo de espera es una oportunidad de que el cliente se vaya. Hay datos que lo respaldan: un estudio encargado por Google y realizado por Deloitte sobre 37 marcas europeas y estadounidenses, con más de 30 millones de sesiones, encontró que mejorar 0,1 segundos la velocidad en móvil aumentaba un 8,4 % la conversión en webs de retail (web.dev).

Dos matices para leer bien esa cifra: los datos son de finales de 2019, y la mejora solo aparecía cuando todas las páginas del recorrido de compra ganaban velocidad, no solo la portada. La conclusión práctica sigue siendo válida: la velocidad no es una métrica técnica, es una variable de la cuenta de resultados.

El problema de las plataformas rígidas

Muchas tiendas crecen sobre plataformas pensadas para empezar rápido: un tema comercial, varios plugins y un servidor que construye cada página en el momento en que alguien la pide. Funciona bien con poco catálogo y poco tráfico. Los problemas aparecen al escalar:

• Cada plugin añade peso. Scripts y estilos que se cargan en todas las páginas aunque solo se usen en una.
• Cada visita genera trabajo en el servidor. Si el tráfico se multiplica por una campaña, también lo hace la carga.
• Diseño y contenido van atados. Cambiar la experiencia de compra obliga a pelearse con la plantilla.

Qué aporta Nuxt

Nuxt es un framework de código abierto basado en Vue. Su principal ventaja para una web comercial es que puede entregar las páginas ya construidas:

• Renderizado en servidor o generación estática. El HTML llega al navegador con el contenido dentro. Los buscadores y los asistentes de IA leen el texto sin depender de ejecutar JavaScript, y el usuario ve la página antes.
• Navegación de aplicación. Tras la primera carga, moverse entre páginas es rápido porque solo se piden los datos que cambian.
• Facilidad para cumplir Core Web Vitals. Google considera buena una web con LCP de 2,5 segundos o menos, INP de 200 milisegundos o menos y CLS de 0,1 o menos, medidos en el percentil 75 de las visitas (web.dev). Nuxt no lo garantiza, pero da las herramientas para conseguirlo.
• Separación del contenido. Nuxt puede leer el contenido de cualquier gestor mediante API. Es lo que se conoce como arquitectura headless: el equipo de negocio edita catálogos y campañas sin tocar el código de la web.

Qué puede aprender una pyme

No hace falta vender en 50 países para aplicar las mismas ideas:

1. Mide antes de decidir. Con PageSpeed Insights puedes ver gratis los datos reales de velocidad de tu web, si tiene tráfico suficiente.
2. Prioriza el recorrido que genera ingresos. La página de producto o de servicio y el formulario de contacto importan más que la portada.
3. No cambies de tecnología por moda. Una arquitectura como la de On compensa cuando la web es una pieza importante del negocio. Si es una web de pocas páginas que casi no cambia, probablemente no. Lo explicamos en cuándo conviene una arquitectura headless.
4. Calcula cuánto te cuesta la lentitud. Tienes un método sencillo en nuestro artículo sobre el coste de una web lenta.

Cómo lo aplicamos en BeDoers

Nuestra propia web está hecha con Nuxt y Strapi, y es la arquitectura que usamos en los proyectos donde la velocidad y la autonomía del equipo de contenidos importan. Si quieres saber si tiene sentido en tu caso, puedes ver nuestro servicio de desarrollo web de alto rendimiento o contarnos qué necesitas.

Preguntas frecuentes

¿Qué es Nuxt?

Es un framework de código abierto basado en Vue para construir webs y aplicaciones. Permite generar las páginas en el servidor o de forma estática, lo que mejora la velocidad de carga y facilita el SEO.

¿Nuxt mejora el SEO?

Facilita dos cosas que el SEO necesita: que el contenido llegue en el HTML y que la web sea rápida. Pero el posicionamiento también depende del contenido, la estructura y los enlaces. La tecnología no posiciona sola.

¿Qué diferencia hay entre Nuxt y Next.js?

Resuelven el mismo problema con distinta base: Nuxt se apoya en Vue y Next.js en React. La elección suele depender de la experiencia del equipo y del ecosistema del proyecto.

¿Cómo sé con qué tecnología está hecha una web?

Hay extensiones de navegador como Wappalyzer que lo detectan. También puedes mirar el código fuente: una web con Nuxt suele cargar archivos desde la ruta /_nuxt/.