Playwright CLI vs MCP Server: ¿Cuál es REALMENTE mejor para Claude Code?

BBetter Stack
컴퓨터/소프트웨어AI/미래기술

Transcript

00:00:00Playwrights CLI es la forma más reciente de usar Playwright con tu agente de programación, permitiéndote gestionar
00:00:04el almacenamiento local y de sesión, tomar capturas, gestionar pestañas... básicamente todo el poder del
00:00:09motor de Playwright dentro de tu terminal.
00:00:12¿Pero por qué alguien usaría esto en lugar del servidor MCP de Playwright?
00:00:17De hecho, ¿por qué se están creando más CLIs de herramientas que antes eran servidores MCP?
00:00:22Suscríbete y vamos a descubrirlo.
00:00:24Empecemos probando tanto el CLI de Playwright como el servidor MCP en una tarea sencilla.
00:00:31Voy a pedirle que me ayude a probar una herramienta en la que he estado trabajando para descargar vídeos de
00:00:35Twitter.
00:00:36Le pediré a Playwright que tome el enlace de este tweet, lo pegue aquí, extraiga el
00:00:40vídeo, espere 10 segundos antes de hacer una captura de pantalla y luego limpie el almacenamiento local
00:00:45para que el siguiente agente empiece de cero.
00:00:48Primero lo probaremos con el CLI de Playwright usando Claude Code, y si lo instalamos,
00:00:54deberíamos tener la función disponible aquí.
00:00:56Observa que solo ocupa 68 tokens.
00:00:59Ahora voy a darle este prompt, que le dice explícitamente al agente que use la
00:01:03función del CLI de Playwright, solo para facilitar un poco las cosas.
00:01:06Pulso Enter, carga la función, introduce esta URL en el cuadro de texto, hace clic en
00:01:11“Extract Video” y luego esperará 10 segundos.
00:01:13Ya ha tomado la captura, limpiado el almacenamiento local y cerrado el navegador.
00:01:17Ya está todo listo, dice que la captura se guardó aquí, y si la miramos,
00:01:21podemos ver que muestra que el vídeo se descargó correctamente.
00:01:24Y todo el proceso ha consumido alrededor del 16% de los tokens.
00:01:27Ahora probemos lo mismo usando el servidor MCP.
00:01:29Podemos usar el comando MCP para comprobar que lo tenemos instalado.
00:01:33Y antes de seguir adelante, echemos un vistazo al contexto.
00:01:35Si subimos, vemos que ya se está usando el 15% del contexto, porque se están cargando
00:01:41todas estas herramientas MCP, que ocupan unos 3,6K tokens.
00:01:46Bien, con eso en mente, vamos a usar el mismo prompt.
00:01:50Y fíjate que estoy usando las herramientas del servidor MCP de Playwright, en lugar de la función del CLI.
00:01:55Ha procedido a usar el servidor MCP, que abre un nuevo navegador.
00:01:59Luego ha pegado el enlace en la entrada.
00:02:01Después hará clic en el botón.
00:02:02He notado que el servidor MCP pide muchos más permisos que el CLI, lo cual es normal.
00:02:08Y ha tenido algunos problemas al hacer la captura de pantalla, quizá porque ya tengo un archivo
00:02:12con ese nombre.
00:02:13De hecho, lo intenté de nuevo con el servidor MCP de Playwright, y aunque probó con un
00:02:17nombre de captura diferente, tuvo problemas varias veces al intentar extraer la imagen.
00:02:22Y ahora ha terminado.
00:02:23Pudo hacer todo excepto tomar la captura de pantalla.
00:02:26Pero miremos ahora el contexto: vemos que ha usado 35K, lo que supone un 18%.
00:02:32Solo un poco más que el CLI, y el grueso fue ocupado por las herramientas MCP.
00:02:37Pero hay una forma de hacer exactamente el mismo conjunto de tareas usando algo menos de contexto,
00:02:43de lo que hablaré un poco más adelante en el vídeo.
00:02:45Sé que este es solo un ejemplo, e incluso puede haber escenarios donde el servidor MCP
00:02:51use menos tokens que el CLI de Playwright, según la tarea, aunque lo dudo.
00:02:56Y quizás pienses que la diferencia entre el 16 y el 18% no es para tanto.
00:03:02Pero el CLI tiene otras ventajas sobre el servidor MCP.
00:03:06Por defecto, el servidor MCP de Playwright no expone todas las herramientas disponibles.
00:03:11De hecho, tendrías que activar herramientas extra como la generación de PDF o el rastreo
00:03:16para poder usarlas, porque ocupan demasiado contexto.
00:03:19El CLI, sin embargo, no tiene esa limitación.
00:03:22De hecho, todas las herramientas están disponibles desde el principio.
00:03:25Y el CLI no solo es bueno para agentes, también para humanos, porque para tareas
00:03:29repetitivas o pruebas de extremo a extremo, puedes crear un simple script de bash
00:03:34que un humano pueda ejecutar para verificar resultados, pero que un agente también pueda correr.
00:03:39Esto no significa que el servidor MCP sea inútil, porque si estás creando un bucle de agente
00:03:44que quieres ejecutar en cualquier lugar (en el navegador, escritorio o apps móviles), no solo en la
00:03:49terminal, entonces el servidor MCP es perfecto, porque es un protocolo estándar que
00:03:54los agentes usan para acceder a herramientas. Y como Playwright ejecuta código JavaScript o TypeScript,
00:03:59puedes correr este código en cualquier entorno que soporte el entorno de ejecución de JavaScript.
00:04:03Además, el servidor MCP corre en modo con interfaz por defecto, mientras que el CLI corre en modo oculto,
00:04:09ya que está diseñado para ejecutarse en segundo plano en agentes de código.
00:04:13Y si te preocupa reducir los tokens en el servidor MCP de Playwright, puedes configurarlo
00:04:17activando o desactivando ciertas herramientas.
00:04:20De hecho, si tu objetivo es usar la menor cantidad de tokens posible, no deberías usar tampoco
00:04:26el CLI de Playwright, porque el navegador de agentes de Vercel usa Playwright internamente pero tiene un
00:04:32CLI en Rust, lo que lo hace más rápido, y está diseñado para usar menos tokens que Playwright, como viste en
00:04:38mi ejemplo anterior.
00:04:39Echa un vistazo al siguiente vídeo para aprender todo sobre Agent Browser y llevar las
00:04:43habilidades de navegación de tus agentes de código al siguiente nivel.

Key Takeaway

El CLI de Playwright es más eficiente en tokens y versátil para desarrolladores en terminal, mientras que el servidor MCP destaca por su estandarización en entornos diversos.

Highlights

El CLI de Playwright permite gestionar el almacenamiento local, capturas y pestañas directamente desde la terminal.

Comparativa de consumo de tokens: el CLI utilizó un 16% frente al 18% del servidor MCP en una tarea de extracción de video.

El servidor MCP (Model Context Protocol) consume más contexto inicial (3,6K tokens) debido a la carga de múltiples herramientas.

El CLI ofrece acceso total a herramientas como generación de PDF sin las restricciones de configuración del servidor MCP.

El servidor MCP es superior para flujos de trabajo multiplataforma (móvil, escritorio) gracias a su protocolo estándar.

Mención de 'Agent Browser' de Vercel como una alternativa en Rust aún más eficiente en el uso de tokens.

Timeline

Introducción y Comparativa Inicial

El narrador introduce Playwright CLI como una herramienta potente para agentes de programación que operan desde la terminal. Se plantea la interrogante de por qué los desarrolladores están prefiriendo CLIs sobre los servidores MCP tradicionales. El video propone un experimento práctico utilizando una herramienta de descarga de videos de Twitter para evaluar el rendimiento. El objetivo es comparar la extracción de datos, el manejo de capturas de pantalla y la limpieza de almacenamiento. Esta sección establece el contexto técnico necesario para entender las ventajas de cada arquitectura.

Prueba de Rendimiento con Playwright CLI

Se realiza la primera prueba utilizando Claude Code y la interfaz de línea de comandos de Playwright. La función específica solo ocupa 68 tokens, lo que demuestra una ligereza notable en el contexto del modelo. Durante la ejecución, el agente automatiza la navegación, espera tiempos específicos y captura la pantalla con éxito. Los resultados finales muestran un consumo total del 16% de los tokens disponibles. Esta eficiencia es un punto clave para desarrolladores que buscan maximizar el espacio de trabajo del agente.

Evaluación del Servidor MCP de Playwright

En esta etapa se utiliza el servidor MCP para realizar exactamente la misma tarea de descarga de video. Se observa que la carga de herramientas MCP consume inicialmente 3,6K tokens, elevando el uso del contexto al 15% antes de empezar. El proceso enfrenta dificultades técnicas, fallando en la captura de pantalla por conflictos de nombres de archivos. Al finalizar, el uso del contexto sube al 18%, mostrando una carga ligeramente superior al CLI. El autor destaca que, aunque la diferencia parece pequeña, el overhead del protocolo MCP es constante.

Ventajas del CLI sobre MCP y Casos de Uso

El análisis se profundiza al explicar que el CLI expone todas las capacidades de Playwright por defecto. A diferencia del servidor MCP, no requiere configuraciones adicionales para funciones pesadas como la creación de PDFs. El CLI también resulta más amigable para los humanos, permitiendo crear scripts de bash que tanto personas como agentes pueden ejecutar. Esto facilita las pruebas de extremo a extremo de manera repetitiva y predecible. La flexibilidad operativa se presenta como un factor decisivo para elegir la herramienta según el flujo de trabajo.

Cuándo elegir MCP y Alternativas de Optimización

El video concluye reconociendo que el servidor MCP es vital para aplicaciones que no se limitan a la terminal, como interfaces web o móviles. Al ser un protocolo estándar, garantiza que el agente pueda interactuar con herramientas en cualquier entorno que soporte JavaScript. Se ofrecen consejos para reducir tokens en MCP mediante la desactivación de herramientas no utilizadas. Finalmente, se menciona el 'Agent Browser' de Vercel, escrito en Rust, como la opción definitiva para quienes priorizan la velocidad y el ahorro extremo de tokens. El contenido cierra invitando a los espectadores a explorar soluciones de navegación más avanzadas.

Community Posts

No posts yet. Be the first to write about this video!

Write about this video