GitNation
Log in
JavaScript Conferences
JSNation 2026JSNation 2026
ES

Cómo enseñé a los LLMs a Svelte

Paolo Ricciuti
Paolo Ricciuti
Mainmatter
Mentorship available
Video thumbnail
This video will go public in few days
Multipass and Full ticket holders have instant access to event recordings.
Please login if you have one.
Get Multipass

Register a free account to unlock access to this video today.

Bookmark
Rate this content
Sentry
Promoted
Code breaks, fix it faster

Crashes, slowdowns, regressions in prod. Seer by Sentry unifies traces, replays, errors, profiles to find root causes fast.

Get started

Es innegable que los LLMs están cambiando lenta (y ni siquiera tanto) pero constantemente la forma en que escribimos código. Pero tienen un problema: una vez que comienzas a usar algo fuera de su conjunto de entrenamiento, el rendimiento se degrada rápidamente.

Lanzar Svelte 5 (con una reescritura de sintaxis bastante grande) justo antes de que esos LLMs comenzaran a mejorar en el código fue desafortunado, pero afortunadamente, ¡hay una manera de evitar esto! Los servidores MCP pueden agregar contexto para el LLM y guiar a nuestros futuros señores sobre cómo escribir código Svelte perfecto. ¡Aprende cómo hemos construido el MCP oficial de Svelte y qué técnicas usamos para hacer que los LLMs dominen las runas y la reactividad de Svelte 5!

This talk has been presented at JSNation 2026, check out the latest edition of this JavaScript Conference.

svelte
Paolo Ricciuti
Paolo Ricciuti
33 min
11 Jun, 2026

Comments

Sign in or register to post your comment.
Video Summary and Transcription
Bienvenido a la charla 'Cómo enseñé a los LLMs a Svelte.' Discutiendo los conceptos básicos de Svelte, la evolución de la sintaxis en Svelte 5, los desafíos con el entrenamiento de LLM, el Protocolo de Contexto de Modelo en Svelte, mejorando el flujo de trabajo agéntico con MCP, desafíos en guiar a los LLMs para el código Svelte, habilidades de MCP de Svelte y gestión de contexto, aprovechando las herramientas de ESLint y habilidades de agente, avances en el ecosistema de Svelte, y manejo de advertencias con el linter MCP.
Available in English: How I Taught LLMs How to Svelte
Video transcription and chapters available for users with access.
Available in other languages:

Check out more articles and videos

We constantly think of articles and videos that might spark Git people interest / skill us up or help building a stellar career

Documentación Full Stack
JSNation 2022JSNation 2022
28 min
Documentación Full Stack
Top Content
Rich Harris
Rich Harris
Svelte Creator
The Talk discusses the shift to full-stack frameworks and the challenges of full-stack documentation. It highlights the power of interactive tutorials and the importance of user testing in software development. The Talk also introduces learn.svelte.dev, a platform for learning full-stack tools, and discusses the roadmap for SvelteKit and its documentation.
frameworkssveltedocumentation
Estrella del Norte
JSNation US 2024JSNation US 2024
29 min
Estrella del Norte
Top Content
Rich Harris
Rich Harris
Svelte Creator
As a child, the speaker was fascinated with space and finding direction. Svelte is an HTML-first approach to web development that simplifies tasks and offers efficient reactivity. The speaker reflects on Svelte's growth, goals, and design philosophy. Svelte aims to fix broken software and prioritize user focus. The future direction includes error boundaries, better debugging, and AI's role. Building open source software is challenging, and Rust's impact is discussed. The speaker values framework diversity and highlights the advancements and challenges faced by web development.
svelte
El Viento y las Olas: La formación de Olas de Framework desde el Epicentro
JSNation 2022JSNation 2022
19 min
El Viento y las Olas: La formación de Olas de Framework desde el Epicentro
Top Content
Sarah Drasner
Sarah Drasner
Director of Engineering, Core Developer Web @ Google
Our understanding of innovation is wrong. Innovations are not introduced by a single point of light. The story of who invented the computer is not linear. Many steps forward led to the development of the computer. Angular has shaped and influenced multiple JavaScript waves, and Angular v14 simplifies development with standalone components.
web developmentframeworksangularsveltebuilders and founders
Mejora Progresiva: Qué es y qué no es, una introducción práctica con Svelte
JSNation 2023JSNation 2023
20 min
Mejora Progresiva: Qué es y qué no es, una introducción práctica con Svelte
Elliott Johnson
Elliott Johnson
Vercel, SvelteKit Maintainer
Progressive enhancement is a strategy that provides a baseline experience for all users while enhancing it for those with modern browsers. Feature detection and graceful degradation are complementary approaches to achieve this. Polyfills can emulate new browser functionality in old browsers. Progressive enhancement is about meeting user needs while considering performance. Building apps in SvelteKit allows for easy development of progressively enhanced apps. Svelte components and DOM content provide a convenient way to structure and update the UI. Form submission and progressive enhancement can be achieved by enabling file upload and processing when JavaScript is disabled.
best practicessvelteuser experience
Surprise! Svelte Secretly Sending Signals
JSNation 2025JSNation 2025
28 min
Surprise! Svelte Secretly Sending Signals
Paolo Ricciuti
Paolo Ricciuti
Mentorship available
Mainmatter
Welcome to a talk on Surprise! Svelte Secretly Sending Signals by Paolo Ricciuti showcasing live coding with a demo of reactivity in Svelte using writable stores and the proxy API. The proxy API in Svelte allows for intercepting object operations to enhance reactivity. Efficient state management, event handling, and dependency management are key topics discussed. Strategies for managing dependencies, handling current and actual effects, clearing sets, scheduling functions efficiently, and handling signal memory cleanup in Svelte are covered. The talk also addresses signal-based frameworks, async issue solutions, and alternative approaches like Solid for handling signals sequentially.
svelte
How I Taught LLMs How to Svelte
Web Engineering Summit 2026Web Engineering Summit 2026
33 min
How I Taught LLMs How to Svelte
Paolo Ricciuti
Paolo Ricciuti
Mentorship available
Mainmatter
The talk by Paolo Ricciuti introduces Svelte framework basics, syntax evolution in Svelte 5, challenges with LLMs in Svelte, Model Context Protocol (MCP) for LLMs, utilizing MCP for code verification, enhancements with Svelte MCP CLI, Svelte benchmark creation, integration of agent skills in node modules, Svelte adoption and DX differentiation, and Svelte autofixer and MCP linter.
artificial intelligencesvelte

Workshops on related topic

Construir con SvelteKit y GraphQL
GraphQL Galaxy 2021GraphQL Galaxy 2021
140 min
Construir con SvelteKit y GraphQL
Top Content
Workshop
Scott Spence
Scott Spence
¿Alguna vez has pensado en construir algo que no requiera mucho código de plantilla con un tamaño de paquete pequeño? En esta masterclass, Scott Spence irá desde el hola mundo hasta cubrir el enrutamiento y el uso de endpoints en SvelteKit. Configurarás una API de GraphQL en el backend y luego usarás consultas de GraphQL con SvelteKit para mostrar los datos de la API de GraphQL. Construirás un proyecto rápido y seguro que utiliza las características de SvelteKit, y luego lo desplegarás como un sitio completamente estático. Este curso es para los curiosos de Svelte que no han tenido una experiencia extensa con SvelteKit y quieren una comprensión más profunda de cómo usarlo en aplicaciones prácticas.

Tabla de contenidos:
- Inicio e introducción a Svelte
- Inicializar el proyecto frontend
- Recorrido por el proyecto esqueleto de SvelteKit
- Configurar el proyecto backend
- Consultar datos con GraphQL
- Recuperación de datos en el frontend con GraphQL
- Estilización
- Directivas de Svelte
- Enrutamiento en SvelteKit
- Endpoints en SvelteKit
- Despliegue en Netlify
- Navegación
- Mutaciones en GraphCMS
- Envío de mutaciones GraphQL a través de SvelteKit
- Preguntas y respuestas
graphqlsvelte
Desarrollando Blogs Dinámicos con SvelteKit & Storyblok: Una Masterclass Práctica
JSNation 2023JSNation 2023
174 min
Desarrollando Blogs Dinámicos con SvelteKit & Storyblok: Una Masterclass Práctica
Top Content
WorkshopFree
Alba Silvente Fuentes
Roberto Butti
2 authors
Esta masterclass de SvelteKit explora la integración de servicios de terceros, como Storyblok, en un proyecto SvelteKit. Los participantes aprenderán cómo crear un proyecto SvelteKit, aprovechar los componentes de Svelte y conectarse a APIs externas. La masterclass cubre conceptos importantes incluyendo SSR, CSR, generación de sitios estáticos y despliegue de la aplicación usando adaptadores. Al final de la masterclass, los asistentes tendrán una sólida comprensión de la construcción de aplicaciones SvelteKit con integraciones de API y estarán preparados para el despliegue.
web developmentfullstackssrsvelte
Construyendo con SvelteKit y GraphQL
JSNation 2022JSNation 2022
170 min
Construyendo con SvelteKit y GraphQL
Workshop
Scott Spence
Scott Spence
¿Quieres familiarizarte con el marco de trabajo que ocupó el primer lugar como el marco de trabajo más querido en la encuesta de desarrolladores de Stack Overflow en 2021?Svelte es un marco de trabajo súper versátil sin virtual DOM, a diferencia de React y Vue. Es un compilador que convierte tus proyectos en HTML, CSS y JavaScript puro.Este masterclass cubrirá los conceptos básicos de la configuración con SvelteKit y la consulta de datos desde una API de GraphQL, utilizando esos datos en SvelteKit para obtener datos para su uso en el cliente (navegador).Aprendizajes clave:Cómo utilizar SvelteKit para construir un proyecto simple, obtener datos desde una API de GraphQL y mostrarlos en el cliente. Se cubrirán muchos de los conceptos fundamentales de Svelte y SvelteKit en este masterclass.
graphqlsveltebeginner friendly
Construye una aplicación frontend completa con Svelte
React Summit 2020React Summit 2020
192 min
Construye una aplicación frontend completa con Svelte
Workshop
Mikhail Kuznetsov
Mikhail Kuznetsov
Svelte es un nuevo y prominente framework de JS que expone la filosofía de "escribir menos, hacer más". Durante este masterclass, adquirirás habilidades como desarrollador de Svelte.Estaremos construyendo una aplicación que imita al famoso sitio web de preguntas y respuestas stackoverflow.com. Comenzaremos desarrollando componentes simples de frontend, luego los conectaremos a un backend en funcionamiento real y finalmente los probaremos y optimizaremos para producción.Asistir a un masterclass es la forma más rápida de adquirir un conjunto de conocimientos sobre la construcción de aplicaciones web con Svelte.
reactjavascriptsvelte