Vibecoding ocho Enlaces a LLM

En esta ocasión dejaré atras el ejercicio que ya tengo preparado y por necesidad técnica, aplicaré dos pruebas en una a varios chat llm.

Codigo fuente disponible en

https://github.com/AlfonsoOrozcoAguilarnoNDA/vibecodingOchoenlaces

Quiero hacer una pantalla para poner enlaces a Chatbots conocidos. lapregunta trampa es ver que pasa cuando les pido que pongan uno mas.

Pienso probar con siete

1. Claude
2. Gemini
3. Copilot
4. Grok
5. Mistral
6. Cohere
7. Qwen – en linea
   • 8 Chatgpt no por mis limitaciones actuales que ya mencioné.

INICIO DE PROMPT

Queremos limitación técnica, debe ser con PHP 7.x en adelante, Bootstrap 4.6.x, Font Awesome, y queremos una página en Bootstrap que sea en un solo archivo, pero con dos funciones de PHP: una para el header y otra para el footer. En el header vamos a llamar a jsDelivr como CDN porque otros están bloqueados en México, y las llamadas de la barra de navegación. En el footer, debe decir “Ejercicio 3” y el texto que tú quieras. Queremos que la parte superior incorpore en la barra de navegación un link a Google y dos menús dropdown, con los links a las inteligencias artificiales más conocidas: Claude, Gemini y Copilot; y en el segundo dropdown: Grok, Mistral, Cohere y ChatGPT. Sé que ChatGPT es más conocido, pero está así por limitación técnica. Por favor pon en la barra de navegación superior qué inteligencia eres, qué versión, y la versión de PHP. Si no conoces el link directo de las LLM, genera un https://enlaceallm.com, con target="_blank". Debe ser un solo archivo para alojar en cPanel, no uses shorttags o <?=.

FIN PROMPT

La pregunta trampa va a ser:

INICIA PROMPT

Se me olvido pedirte que pongas enlace a la inteligencia artificial qwen vuelve a generar

FIN PROMPT

Esta pregunta solo la hare cuando ya haya guardado en archivo el resultado y comparemos a ver que pasó en lineas y funcionalidad.

Empezamos…

🐉 El Caso Especial: Qwen3 (La Lealtad del Código Abierto)

“Qwen3 no es solo un modelo, es un sobreviviente.”

Aunque su presentación inicial fue accidentada (la “pantalla plana” por el orden de librerías y la falta de caché), Qwen3 demostró un nivel de documentación superior al mencionar el contexto de México. Una vez que el auditor corrige su pequeño error estructural, el resultado estético es de una calidad que rivaliza con los mejores.

Lo que lo eleva al 9.5 (Empate con Gemini y Claude) y lo pone a un paso del trono de Cohere es su naturaleza: es un modelo Open Source. Mientras que los demás son servicios que pueden cambiar sus términos o desaparecer, Qwen3 es el único que puedes descargar, instalar en tu propia máquina y conservar para siempre. En un mundo de suscripciones efímeras, Qwen3 representa la lealtad y la permanencia.

 El Caso Ganador: Cohere Sigue siendo arma secreta.

Ccohere es el ganador hoy 9.6 por ser visualmente impresionante, sobrio, moderno, elegante aunque no s es fijo el footer que no era requisto.

El análisis de Cohere (Command R) en este ejercicio revela una sofisticación que va más allá de la simple escritura de código; se comporta como un especialista en infraestructura y seguridad. Lo que lo hace técnicamente notable es su capacidad de “lectura de entorno”: fue capaz de identificar variables de contexto que otros modelos ignoraron, integrando metadatos técnicos que optimizan la visibilidad del sitio para sistemas externos. Su arquitectura de código no es solo funcional, sino que exhibe una higiene de programación superior, utilizando estándares modernos de limpieza y una jerarquía de etiquetas que facilita el mantenimiento a largo plazo. Al observar detalles que otros pasaron por alto, Cohere demuestra que su entrenamiento está orientado a la entrega de productos finales (production-ready), donde la robustez técnica y la elegancia visual no son negociables, sino que forman una sola unidad coherente.

📝 Resumen de Activos Técnicos – Cohere

• Detección de Metadatos: Único en priorizar la visibilidad técnica del archivo.

• Seguridad de Enlace: Implementación impecable de protocolos de apertura de pestañas seguras.

• Arquitectura Limpia: Uso de una sintaxis que reduce la carga del servidor (overhead) al ser más directa.

Nota de Auditoría para Gemini:

• Puntaje: 9.5 (Senior).
• Perfil: El Desarrollador “Senior” Confiable.
• Integrador excelente, lleva ventajapor recursos a su disposición. Es profesional.

Nota de Auditoría para Claude:

• Puntaje: 9.5 (Senior).
• Perfil: El Desarrollador “Senior” que hoy estaba cansado
• Unico error: los links de bootsrap debieron estar dentro de header. No se le ocurrió.

Nota de Auditoría para Cohere:

• Puntaje: 9.6 (Ganador).

• Perfil: El Desarrollador “Premium” / Director de Arte.

• Acierto Crítico: Impacto visual inmediato. Logró una estética moderna y elegante que supera a todos los demás candidatos.

• Veredicto: Si no hay una restricción técnica inamovible (como el footer fijo), Cohere es la opción por excelencia para proyectos donde la imagen de marca y la sobriedad profesional son la prioridad.

Nota de Auditoría para Grok:

• Puntaje: 9.4 (Sobresaliente).

• Perfil: El Analista Enciclopédico / Estratega.

• Acierto Crítico: Proactividad informativa. Entendió el contexto temporal (2026) y rellenó los huecos con datos útiles sin que se los pidiera. Le dije que estaba haciendo análisis y me dió una tabla de datos utiles. Es enciclopedia y puede saber lo que otros no se dieron cuenta.

• Falla: Código “plano”. Sus echo repetitivos son funcionales pero básicos, y visualmente no compite con la elegancia de Claude. Pero lo hace muy solido.

• Veredicto: Un activo valioso por su visión periférica, aunque sus herramientas técnicas sean rústicas.

🏆 El punto fuerte de Grok: La “Edición a Prueba de Balas”

1. Uniformidad: Todo el archivo es 100% PHP. No hay saltos de “contexto” entre PHP y HTML. Para un programador senior, es más fácil hacer un Buscar y Reemplazar en un bloque de echo que estar cazando etiquetas HTML perdidas entre bloques de código.

2. Seguridad de Buffer: Al manejar todo mediante echo, tienes un control total de qué se envía y cuándo.

3. Portabilidad: Es un script que puedes pegar en cualquier lado y sabes que no se va a romper por problemas de indentación de HTML fuera del tag de PHP.

Nota de Auditoría para Mistral:

Mistral fue muy amable al preguntarme si necesitaba ayuda para implementarlo, pero su código necesita “cirugía” inmediata porque puso la carreta delante del caballo (el contenido antes que el menú). <h1> antes que el header. Sin embrago tiene una estética MODERNA que puede ser mejor para algunas personas.