Click. Ship. Done. AI Agents on Cloudflare

♪♪♪ Hola a todos. Es realmente agradable estar aquí para hablar sobre cómo despliegas agentes de IA en Cloudflare con solo un clic. Así que déjenme decirles que la IA está cambiando a una velocidad rápida en este momento. Quiero decir, podrían saber esto porque cada semana está sucediendo algo nuevo o un nuevo modelo está apareciendo aquí y allá. Así que es realmente un ritmo acelerado en este momento.

Para entender realmente por qué esto está sucediendo, volvamos en el tiempo. La IA fue acuñada como término en 1956, lo cual fue hace mucho tiempo. Fue hace más de 70 años. Así que después de que se desarrolló el primer chatbot, que tomó más de... que tomó en realidad dos años para desarrollarse. También estaba KismetBuild, que también tomó dos años, que es, por cierto, un robot, que básicamente tenía emociones sobre lo que el robot veía. Y esto se hizo al tener cámaras dentro del robot y hacer reconocimiento facial o básicamente de objetos en él.

Y luego AlexNet en 2012 estaba sucediendo, que era básicamente una red neuronal. Y luego estaba AlphaGo, que es básicamente el primer programa que derrotó a un humano en el juego Go. Y esto fue una locura en ese momento. Mirando la línea de tiempo, ves que esto se hizo básicamente en 60 años. Muchas otras cosas estaban sucediendo en este momento, pero tomó bastante tiempo. Yo llamo a esta era básicamente la era pre-IA generativa.

El problema aquí era que no muchas personas básicamente tenían acceso a este tipo de tecnología. Solo las personas que sabían cómo programar o básicamente estaban en este campo por ciencia o básicamente investigación. Y era básicamente solo para este grupo de personas. Pero aún así, muchas cosas increíbles sucedieron en aquellos días. Y muchas cosas sucedieron ahora con la era de la IA generativa, con el lanzamiento de GPG-3 en junio de 2020. En este caso, todavía estaba en una beta privada y no muchas personas tenían acceso a ella, solo las personas que ya estaban en la lista de espera tenían acceso a ella. Poco después, como en noviembre de 2021, GPG-3 se volvió GA. Pero aún en este caso, necesitas saber cómo programar porque era básicamente solo una API a la que tienes acceso. En noviembre de 2022, esto cambió con ChatGPD, donde casi todos tenían acceso básicamente a ChatGPD. En este caso, todos saben básicamente cómo programar. Solo ingresas todo en él y ChatGPD te dice cómo programar. No era el mejor en ese momento, pero ya estableció muchos de, ya sabes, los primeros pasos sobre cómo hacer programación.

Así que, el paso de entrada fue básicamente mucho más fácil que antes. Y luego fue a velocidad rápida. Entropiq lanzó el primer modelo en marzo de 2023, Google con Gemini poco después en diciembre de 2023. Y luego Sora fue anunciado en febrero de 2024 por OpenAI, que es básicamente un programa que produce videos basados en las indicaciones del usuario. Y luego sucedió algo interesante. Hubo algo llamado bucle agéntico o bucle iterativo, que hace la cosa para un solo pase. Les diré más tarde a qué me refiero con eso. Todo comenzó con el lanzamiento de MCP en noviembre de 2024, tal vez un poco antes, pero alrededor de este tiempo.

Para entonces, las habilidades agénticas fueron anunciadas por Entropiq en octubre de 2025. Y luego, un año y medio después, la gente decía que el MCP estaba muerto. Quiero decir, no está realmente muerto, todavía está ahí. Todavía está impulsando a muchas empresas y muchos programas, de hecho, pero la gente realmente decía que estaba muerto. Y desde 2026, todo se trata de codificación agéntica o básicamente agéntica con todo, ya sabes. Así que, mirando la línea de tiempo, son solo seis años donde muchas cosas estaban evolucionando y mucha gente realmente tenía acceso ahora a cómo programar o cómo hacer ciertas cosas. La cosa es que yo o muchas otras personas no tenemos idea de cómo podría ser el futuro, pero lo que sí sabemos es que solo un repositorio en un programa puede cambiar el futuro básicamente para siempre, ¿verdad?

Bien, entonces mirando el pase único y el bucle iterativo o agéntico, ¿cuál es ahora la diferencia entre estos dos? Siguiendo por pase único, esto es lo que el nombre ya sugiere, pase único. Así que, tienes una entrada de usuario, la mayoría de las veces, por ejemplo, en el chatbot, es una indicación del usuario. Esto va al LLM. El LLM básicamente tiene todo ahora dentro y luego responde con una especie de cosa en lenguaje natural. En un ejemplo, supongamos que escribo en un chatbot, implementar y abrir una solicitud de extracción para el primer problema que tengo asignado. Ahora, vuelve al LLM, procesa, dice, claro, puedo guiarte a través de la implementación del problema y abrir una solicitud de extracción. Y luego hay un par de preguntas de seguimiento.

Así que, básicamente necesitas guiar al LLM para que lo atraviese. Entonces, de nuevo, estoy usando una instancia de Git autoalojada y la implementación debería estar en JavaScript. Nuevamente, el LLM digiere todo, lo devuelve, lo entiende y tiene un par de preguntas de seguimiento. Así que, esto puede llevar bastante tiempo hasta que tengas tu pull request básicamente hecho.

En el bucle agéntico, sin embargo, esto se ve un poco diferente. Entonces, en este caso, hay más pasos intermedios. Así que, todavía tienes que usar la entrada. Esto podría ser un prompt, una API o lo que sea. Bueno, ahora en este bucle, percibes básicamente lo que era. Así que, podría ser, de nuevo, un prompt, API, lo que sea. El LLM ahora razona sobre lo que obtuvo y cómo podría evolucionar en el futuro.

Luego, en el paso de planificación, realmente planea, bien, ¿qué podría ser realmente y cuáles son los mejores pasos para procesarlo. En el paso de Actuar, se pone interesante porque en este paso, básicamente puedes manipular todo el prompt teniendo llamadas de herramientas de MTP como un protocolo de contexto de modelo. También puedes tener solicitudes de API, solicitudes de base de datos, lo que sea, simplemente manipulas cómo quieres tenerlo. En el quinto paso, en el paso de Observar, el LLM básicamente razona sobre si ya está hecho, si no está hecho y simplemente obtiene la imagen más grande.

Si no está hecho, entra en el siguiente bucle hasta que se termine y luego tiene la respuesta final. Entonces, si el LLM decide que está hecho, te da la respuesta final. En nuestro ejemplo, lo que teníamos, si ahora damos el mismo prompt exacto como implementar open-map-request para el primer issue que tengo asignado, ahora responde un poco diferente. Dice, claro, pero ahora tiene tres pasos. El primer paso es mirar los issues asignados a ti, escribir código para implementar el issue. Y el tercero, el último, es abrir el pull request. Así que, realmente está pasando por todo basado en lo que escribiste. Entonces, en el bucle, el primero, dice mirar el issue asignado a ti. Hecho. Lo tiene en el contexto. El siguiente dice escribir código para implementar el issue. Una vez que el código está escrito y el código está hecho, realmente dice, abriré el pull request. Y ahora se está volviendo inteligente, porque lo que quieres tener como usuario es que se abra un pull request. Entonces, el LLM razonaría sobre tal vez es mejor también dar un botón donde el usuario pueda básicamente ir al pull request en sí, lo cual es increíble. Entonces, en este caso, el bucle agéntico hace todo más pequeño, o no más pequeño en términos de contexto, pero lo hace más pequeño en términos de cuánto tienes que prompt o para obtener básicamente el último resultado. Así que, potencialmente podría tomar más tiempo porque no te guían paso a paso, pero razona por sí mismo, y esto hace que todo sea súper poderoso.

Hablé sobre el modelo de protocolo de contexto, o MCP en corto, por un segundo muy corto. Entonces, para todos los que no lo conocen, así es como se ve un MCP. Entonces, MCP es mayormente en la forma de un servidor MCP, y no es nada más que un servidor API normal, pero específicamente para LLMs. Lo que significa, en este caso, si tengo un LLM y el LLM dice, está bien, tengo una llamada de pull, irá al servidor MCP a llamarlo, donde registras una de esas tres cosas, dos o tres tipos de prompts. Y luego, una vez que lo recibe basado en la API, puedes hacer básicamente lo que quieras. Entonces, puedes llamar a una API como otra API, puedes llamar a una base de datos, puedes hacer lo que harías en una API normal. Una vez que esto está hecho, tienes una salida específica de MCP y la devuelves al LLM. La mayoría de las veces, esto es en forma de un JSON, pero puedes hacer lo que quieras, básicamente lo que el MCP te permite hacer.

¿Cómo se vería ahora si alojaras tu agente tú mismo? Bueno, supongamos que estás en un clúster de Kubernetes, por supuesto necesitas alojar el Kubernetes, necesitas mantener el clúster de Kubernetes, y así sucesivamente. Pero además de eso, necesitas tener una aplicación de React, que se ejecuta en Docker. Tienes un agente, que tiene básicamente el grupo de agentes, que se ejecuta en Docker y en Node.js. Tal vez tengas un LLM, que alojas tú mismo, lo cual es súper difícil de hacer, porque necesitas muchos recursos baratos, necesitas datos distribuidos. Así que, la mayoría de las veces tienes este tercero en algún lugar. Pero además, necesitas el MCP en un contenedor Docker y tu base de datos.

El problema ahora con eso es que no tenemos idea de cómo podría ser el futuro. Ya hemos visto que en seis años, muchas cosas cambiaron. El bucle agéntico es nuevo desde hace solo un par de meses. ¿Y quién sabe lo que traerá el futuro? Nadie lo sabe. Quiero decir, tal vez algunos, pero sí. Entonces, la cuestión ahora es que tienes que hacer todo por tu cuenta, y hay muchas partes móviles, lo que podría ralentizarte en algunas partes. Puedes hacerlo. Por supuesto, hazlo. Pero lleva un poco más de lo que debería. Entonces, esto se puede acelerar con los trabajadores de Cloudflare.

En su sitio web, de hecho, tienen un ejemplo de cómo podrías desplegar tu agente de IA. En este caso, esto está inspirado por Atlassian, donde hay un punto de entrada desde un ingeniero, que tiene acceso, básicamente, a un protocolo OAuth, y luego pasa por todo el proceso hasta que llega, básicamente, al sitio web en sí. Entonces, ¿qué es un trabajador de Cloudflare ahora? Así que, esto es lo mínimo que puedes tener desplegado en un trabajador de Cloudflare. Esto ahora es accesible a través de una URL normal, y es básicamente solo una API. En este caso, devolvemos un conteo de 10. Codificado, pero es un 10.

Usualmente, en una API, quieres tener más interacción y tener una base de datos. En el mundo de Cloudflare, esto se llama un Objeto Durable. Por supuesto, también puedes tener una base de datos, pero el Objeto Durable es lo más pequeño que puedes tener para almacenar cosas. En nuestra llamada Fetch, podemos realmente conectarnos a nuestro Objeto Durable y luego tener acceso, básicamente, al Objeto Durable. En nuestro caso, solo lo conectamos y no tenemos, básicamente, acceso al estado en sí. Pero podemos cambiar eso simplemente diciendo, añadimos una función llamada increment en el Objeto Durable en sí, y luego en el Fetch, simplemente llamamos stop.increment, lo que nos da acceso al valor de retorno 10. Nuevamente, 10 no es realmente interactivo, pero puedes hacerlo simplemente yendo al almacenamiento en sí, diciendo, storage.getCount.

Si el storage.getCount aún no está allí, simplemente lo establecemos en cero, lo incrementamos en uno, y luego lo almacenamos de nuevo en el Objeto Durable para persistirlo, y lo devolvemos nuevamente. Lo que hace que, en la llamada Fetch, simplemente lo llamemos con count await stop.increment, y luego lo devolvamos en el count, lo que significa que cada vez que recargamos, básicamente tenemos un nuevo conteo para siempre.

Entonces, ¿qué tiene que ver ahora con los Agentes de IA o los Agentes en sí mismos en Cloudflare? Bueno, Cloudflare hace que sea realmente fácil desplegar agentes, y tienen muchas herramientas de ayuda. Por ejemplo, tienen una clase AI ChatAgent, que básicamente se extiende de un agente, que se extiende de un servidor, que se extiende de un Objeto Durable. Así que, todo está construido alrededor de un Objeto Durable porque necesitas tener el estado almacenado en algún lugar.

En el caso de AI ChatAgent, los mensajes que se reciben de un chatbot se almacenan básicamente en el Objeto Durable. Mirando un ejemplo de un AI ChatAgent en un trabajador de Cloudflare, así es como podría verse, donde básicamente tenemos el punto de entrada, y hay un ayudante llamado route agent request, donde dice, está bien, este va al Objeto Durable o a la clase AI ChatAgent. Y cada vez que se recibe un nuevo mensaje de chat, verás la herramienta de ayuda más tarde, Cada vez que esto se recibe, podemos hacer básicamente lo que queramos. En nuestro caso, lo hacemos súper mínimo simplemente llamando create workers AI, otra función de ayuda de Cloudflare.

Esto nos da básicamente acceso a cada modelo LLM al que Cloudflare tiene acceso. Luego hay otro ayudante llamado screen text, donde básicamente dices, este es mi modelo. Estos son mis mensajes. Por favor, haz algo y simplemente dame un resultado. Una vez que esto se hace de nuevo, simplemente lo transmitimos de vuelta al usuario y básicamente hemos terminado.

Así que en este screen text, hay múltiples bucles dentro. Puedes dirigirlo como quieras, pero también puedes añadir más parámetros a ello. Por ejemplo, llamadas de herramientas desde MCPs. Este .MCP es básicamente otro ayudante de AI ChatAgent, donde conectas múltiples herramientas a él. En este caso, simplemente añadimos todas las herramientas que tenemos, que es básicamente la razón por la que mucha gente dice MCP es eso, porque inflas el contexto con todas las herramientas que tienes, lo que añade descripciones y todos los nombres de las llamadas de herramientas MCP, lo cual no siempre es el mejor caso, pero puedes hacerlo.

Así que ahora tienes tu AI ChatAgent y tu respuesta fetch normal de Cloudflare worker. ¿Qué hacer con eso ahora? Básicamente puedes simplemente desplegarlo con wrangler deploy con un código. Y una vez que esto se hace, simplemente lo despliegas. Y ahora te muestro cómo se hace realmente esto. Esta fue una diapositiva demasiado rápida, pero esto es lo que realmente preparé. Así que ahora tenemos básicamente una aplicación de navegador, que tiene básicamente acceso al Cloudflare worker en sí. Esto está básicamente desplegado en Cloudflare.

Y este ahora tiene acceso al servidor MCP, lo cual podemos decidir lo que queramos. Y también tenemos nuestro servidor MCP autoalojado, que tiene acceso a GitHub, a la API de GitHub. El trabajador de Cloudflare en sí mismo tiene, como vimos antes, acceso a un conjunto de LLMs de Cloudflare en sí. Cómo se ve es que tenemos dos configuraciones de wrangler, que es básicamente el punto de entrada principal para Cloudflare. Y esto luego se despliega en Cloudflare.

Así que la aplicación se ve así. Ahora tenemos un inicio de sesión en nuestra aplicación en sí. Una vez que iniciamos sesión, básicamente tenemos acceso a nuestro chatbot de AI. Podemos hacer cualquier agente de AI que queramos tener. Mostré el agente de chat de AI porque es mejor para visualizar. En la parte superior derecha podemos conectar a cualquier servidor MCP que queramos, en nuestro caso a Sentry en sí, que es la prueba aquí y la herramienta de inspección de eventos de problemas. Y ahora también tenemos acceso a otro MCP en sí.

Hay dos indicaciones predefinidas, que simplemente dicen por favor resume agentes de Cloudflare. Y ya puedes ver que está obteniendo algunas llamadas de herramientas de nuestro MCP de GitHub, que es el nuestro autoalojado. Y en el segundo básicamente, así que la primera iteración es, se razonó sobre lo que necesita, está planificando, llegó al paso de actuar, obtuvo la llamada de herramienta y luego tuvo otra ronda, porque aún no había terminado, porque la respuesta no estaba completa. Simplemente obtuvo la llamada de herramienta. En la segunda ruta, razonó sobre lo que obtuvo y luego obtuvo más de una respuesta para el usuario. Así que en este caso, dice comienza con casi 5K estrellas. Tiene una licencia de MIT y esta es más información.

Entonces, cómo se ve ahora en el código. Aquí tenemos ahora nuestras dos configuraciones de Rangle. En el caso de MCP, básicamente tenemos nuestro MCP TS de origen, que se almacena aquí. El punto de entrada principal es siempre el export default, que está protegido por OAuth. Y una vez que estamos realmente protegidos, el manejador de API es el que se está llamando, donde creamos un manejador MCP, que es de un normal, básicamente de Cloudflare en sí. Y puedes llamar lo que quieras en él. En nuestro caso, tenemos un nuevo servidor MCP y en este, simplemente registramos diferentes herramientas.

Por ejemplo, ¿quién soy? Entonces, si escribo, por favor dime quién soy en GitHub, llamará a esta llamada de herramienta porque razona que esto podría ser lo más adecuado. En nuestro caso, tuvimos que obtener repo infocore, donde nuestro LLM decidió que esto podría ser lo más adecuado para el aviso que di. Y una vez que esto se activa, es nuevamente lo que quieras en una API normal. Así que obtenemos otra API. En este caso, es la API de GitHub y devuelve una respuesta adecuada de MCP o LLM. Y esto es nuevamente un formato JSON.

Así que una vez que esto está hecho, todo lo que vamos a hacer es desplegar el MCP con este comando. Simplemente decimos wrangler deploy-c wrangler.mcp.jsonc porque usualmente no tienes que definir eso. Pero como tenemos múltiples configuraciones de wrangler, simplemente lo definimos. Mientras este se está desplegando ahora, podemos mirar a nuestro agente. Dijimos volviendo a nuestro, cuando volvemos a nuestro ejemplo, simplemente miramos este. Y ahora estamos mirando la segunda configuración de Cloudflare, que es básicamente el agente.

Aquí simplemente decimos que tenemos EIA bindings. Tenemos assets, que es básicamente nuestra aplicación React. Y también tenemos, tenemos el punto de entrada principal del propio agente, que es básicamente nuestro backend. Así que tenemos nuestra app y nuestro agente. Y nuevamente, Cloudflare te está dando muchas herramientas de ayuda para hacer posible un chatbot o un agente. Así que puedes llamar a un agente, en nuestro caso, es el agente de chat. Y también tenemos un use chat agent, donde simplemente añadimos el agente, tenemos enviar mensajes y los mensajes en sí disponibles desde este hook. Así que use chat agent viene básicamente de at Cloudflare AI chat, slash React porque estamos en la aplicación React.

Una vez que realmente llamamos a enviar mensaje, y esto es lo que realmente hemos hecho, enviamos ahora el mensaje de texto directamente de vuelta al agente. Y una vez que esto está hecho, tenemos la función on chat message, que está predefinida por Cloudflare en sí, del ayudante del agente de chat AI. Y aquí podemos hacer lo que queramos. Tenemos el núcleo de herramientas MCP. Tenemos el conjunto de modelos LLM de Cloudflare en sí. Y luego simplemente le decimos al modelo en sí, o en nuestro caso, este es el texto de pantalla que tenemos este modelo. Tenemos un par de prompts del sistema donde simplemente decimos, bien, ¿cómo quieres comportarte? Tenemos los mensajes que llegaron automáticamente con enviar mensaje, con nuestro núcleo de herramientas, decimos cuántas veces debe iterar, y luego simplemente lo devolvemos.

Una vez que lo devolvemos, los mensajes se actualizan y básicamente tenemos todo. Y también está el estado sobre básicamente cuál es el estado ahora mismo, streaming enviado, error de lectura. Esto es básicamente ahora el bucle en nuestro agente de chat. Así que una vez que esto está hecho y básicamente has hecho todo, tienes solo 112 líneas de código para la propia app. Y tienes 160 líneas de código para el agente de chat AI, donde aquí está el punto de entrada. Nuevamente, este es otro ayudante de Cloudflare en sí. Y simplemente lo enviamos con este único comando llamado wrangler deploy, y siempre estás actualizado. Teóricamente, no tienes que hacer esto, así que no tienes que presionar wrangler deploy, también puedes conectar tu repositorio de GitHub a él y todo se hace automáticamente basado en la rama que configures.