Name: JSNation 2026
Start: 2026-06-11T11:00:00.000Z
End: 2026-06-15T19:00:00.000Z

Varun

Ciarán Curley

Lera

Aleksei Podgaev

Faris Aziz

Seungho Park

Krasimir Tsonev

Phil Nash

Rajni Gediya

Kyle Langford

Houda Mouttalib

Joanna Otmianowska

 Vinicios Neves

Vasilii Boldurean

Hunor Márton Borbély

Jose Pablo Fernandez Guerra

David Barry

Jeroen van Wissen

David Pugh

Rosario Terranova

Alla Kaplia

Petar Kuzmanov

João Portela

Emerson Marini

Mangirdas Darguzis

Boris Karaivanov

Carolina

Svetlana Smirnova

Denis Radin

Ondrej Zicha

Ivan Almasi

Alex Perez

Ever wonder how much of your codebase is just… hanging around, doing nothing? At Sentry, we did too - and the answer was more than we expected. In this talk, I’ll share how we used Knip, a powerful tool for detecting unused files, exports, and dependencies, to declutter our frontend codebase. You’ll learn about the practical steps we took to safely identify and remove dead code, how we integrated Knip into our workflows, about unexpected edge-cases and what we learned along the way. Whether you're maintaining a massive monolith or just looking to tidy up, this session will give you practical strategies - and maybe a little inspiration - to start decluttering your own codebase, one Knip at a time.

Dead Code Shouldn’t Exist: How We Removed 28k Lines of Code, One Knip at a Time

Dominik Dorfmeister

In this workshop, we'll go beyond the fundamentals and explore some of the more powerful features React Query has to offer. You'll gain a deeper understanding of how it works under the hood and learn how to write scalable, maintainable React Query code.Together, we'll build a simple example app and incrementally enhance it with one core objective in mind: delivering the best possible user experience. That means snappy interactions, minimal layout shifts, and avoiding unnecessary loading spinners wherever we can.To achieve this, we'll dive into advanced techniques like various forms of prefetching (including integration with route loaders), seeding the query cache, crafting smooth paginated experiences, and even persisting query state through full page reloads using persistence plugins.Note: You should have prior knowledge about React Query if you attend this workshop.

React Query - Beyond the Basics

At tldraw, we've been exploring the infinite canvas as a surface for real-time collaboration between multiple agents and multiple users. Learn about what works, what doesn't, and whether the future AI might live on the canvas.Our work with AI on the canvas began with makereal.tldraw.com, often cited as the first "vibe coding" tool to reach escape velocity in November 2023. We later did work with realtime drawing (drawfast.tldraw.com), autocomplete, and a canvas interface for AI with (teach.tldraw.com). In 2024, we shipped an AI workflows app (tldraw.computer) and then returned to our canvas AI learnings with a public starter kit for working on the canvas with cursor-style AI agents (https://tldraw.dev/starter-kits/agent) and then later our spatialized agents-on-the-canvas experiment (fairies.tldraw.com).

Agents on the Canvas With tldraw

Steve Ruiz

Claude Code is no longer just a coding assistant, it's becoming an operating system for software development. In this talk, I'll walk through how reusable templates, agents, hooks, skills, and MCP integrations can transform Claude Code into a structured, composable workflow engine. Drawing from building <a href="https://www.aitmpl.com/skills" target="_blank">aitmpl.com</a> and shipping these patterns in production at scale, I'll show how developers can stop prompting from scratch and start building on top of a shared, evolving component layer.

Templates and Components for Claude Code: The Future of AI Coding Workflows

Daniel Ávila

The hype around AI coding agents is very real, and autonomous coding systems are improving fast. In this talk, we'll explore the "Ralph Wiggum" method, where AI agents run in persistent iteration cycles until tasks are actually complete. You will learn about backpressure mechanisms to let the LLM self-correct and retry without human intervention. We will discuss how to structure the prompts, practical patterns for turning test failures into actionable AI feedback, and honest insights about when this approach works best versus where it falls flat. This is about making AI agents actually useful for real work by applying agentic engineering principles, not vibe coding. If you're curious about the future of AI-assisted development and want to see what's possible when we design systems that expect and handle failure, this talk is for you.

Autonomous AI Agents in Action With the Ralph Wiggum Method

Eddy Vinck

Ever wondered what it takes to power millions of voice conversations at ChatGPT's scale?When OpenAI needed infrastructure for ChatGPT's Advanced Voice Mode, they turned to LiveKit's open source Agents framework. Not a proprietary black box. Not a closed platform. Open source software that anyone can use, modify, and deploy.In this talk, I'll take you behind the scenes of building production voice AI infrastructure that handles millions of conversations:<ul><li>Why Open Source for Production AI – The technical and business reasons behind the choice</li><li>Architecture Decisions – How we built for scale, reliability, and low latency</li><li>Scaling to Millions of Calls – The challenges you don't anticipate until you hit them</li><li>Lessons Learned – What we'd do differently knowing what we know now</li><li>What's Possible Now – How you can use the same infrastructure for your projects</li></ul>This isn't a sales pitch, it's a technical deep dive with real production metrics, architectural diagrams, and honest discussions about trade-offs. You'll see the actual stack, understand the scaling challenges, and learn from our mistakes.Whether you're building your first voice agent or scaling to production, you'll walk away with insights from one of the largest voice AI deployments in the world. Because the infrastructure powering ChatGPT's voice mode is open source, and it's available to everyone.

Open Source Voice AI: How We Built ChatGPT's Voice Mode Infrastructure

Jesse Hall

The JavaScript ecosystem is moving towards a standardized module system, and Node.js is evolving to aid its adoption. What actually happens when Node.js loads an ES module today? This talk walks the full pipeline - resolution, loading, parsing, compilation, linking, instantiation, and evaluation. We will cover how the work is split between V8 and Node.js, where Node.js differs from browsers and bundlers, and the recent changes in Node.js that unlocks new patterns for better interop, performance, and customization in ESM. You will leave with a clearer mental model of how ESM is loaded in Node.js, shed obsolete knowledge and misconceptions, understand where to look when your modules don't work, and learn about the new capabilities that will help you write, run, and share ESM code better on Node.js today.

Life of an ESM in Node.js – and How It's Changing for the Better

Joyee Cheung

In this workshop, we will explore React's latest features: Server Components, Server Actions, and Forms. Gain insights into optimizing server-side rendering, enhancing application interactivity through Server Actions and React 19 hooks, and mastering form creation for robust data handling and validation. Designed for developers of all levels, this workshop provides practical skills to build scalable, performant web applications.

Hands-on React Server Components, Server Actions, and Forms

Aurora Scharff

Code generation scales. Planning and review don't, limiting how fast AI-native teams can ship. This talk traces the evolution of developer tooling to the current explosion of coding agents, and makes the case for why the biggest opportunity now is helping engineers plan and review faster.

Why Software Engineering Is Becoming: Plan and Review

Louis Knight-Webb

For over a decade, Node.js documentation relied on legacy tooling, despite being the critical source of truth for @types/node, Bun, Deno, and AI models. In this talk, we unveil the engineering behind @nodejs/doc-kit – the modular successor to Node’s documentation engine. Discover how we parse massive ASTs and leverage modern Web Standards to solve complex rendering and accessibility issues, creating a high-performance experience designed to delight humans and power the ecosystem.

From Legacy to Delight: The Future of Node.js DX

 Claudio Wunder

It's undeniable that LLMs are slowly (and not even that much) but steadily changing the way we write code. But they have a problem: once you start using something outside of their training set, the performance quickly degrades.Releasing Svelte 5 (with a pretty big syntax rewrite) right before those LLMs started to get good at code was unfortunate, but luckily, there's a way around this! MCP servers can add context for the LLM and guide our future overlords on how to write perfect Svelte code. Learn how we've built the official Svelte MCP and which techniques we used to make LLMs master Svelte 5's runes and reactivity!

How I Taught LLMs How to Svelte

Paolo Ricciuti

Direct the code. Don't just write it.The development landscape is shifting from manual coding to system orchestration. Whether you are a seasoned React engineer looking to 10x your output or a product-driven creator aiming to turn a prototype into a functional app, this workshop is your gateway to AI-native development.Join us for a hands-on, 4-hour masterclass where we build a feature-rich, fullstack application from scratch using Cursor Composer. We skip the boilerplate and focus on the exact workflows used to ship high-quality features in minutes, not days.What You’ll Master<ul><li>AI Orchestration: Move beyond simple autocomplete to manage multi-file changes and complex app logic.</li><li>The .cursorrules Framework: Learn how to enforce project standards and prevent AI "hallucinations" for consistent, professional code.</li><li>Rapid Fullstack Scaffolding: Generate type-safe database schemas and backend logic instantly.</li><li>High-Fidelity UI Iteration: Transform prompts into polished, responsive interfaces using modern CSS and component libraries.</li><li>Hardening &amp; Refactoring: Use AI to hunt bugs, clean up "spaghetti" code, and generate comprehensive test suites.</li></ul>The ProjectWe will build a modern, data-driven web application that demonstrates the power of AI-assisted development. By the end of the session, you will have a functional codebase that showcases complex data relationships, dynamic UI, and optimized state management. Who Is This For?Developers who want to eliminate repetitive tasks and focus on high-level architecture.Founders &amp; Prototypers who need to bridge the gap between an idea and a working product rapidly.Tech Enthusiasts eager to master the professional AI-native toolkit.Requirement: Bring a laptop with Cursor installed. We provide the roadmap; the AI provides the speed; you provide the vision. As this is a live online session, we encourage you to sign up ASAP to receive the pre-workshop setup guide and ensure you are ready to build from minute one.

Building Fullstack Apps With Cursor

Maurice de Beijer

This workshop explores how standalone agents operate at the runtime level and how they differ from traditional AI pipelines. We’ll examine agent architecture, planning loops, memory models, and tool execution. We’ll also cover multi-agent coordination, including state isolation and resource control. A key focus is security and governance — capability-based access, sandboxing, and injection risks. Finally, we’ll address observability and supervision: tracing reasoning, auditing tool usage, and implementing control mechanisms for production systems. All examples and concepts will be grounded in the Node.js stack and we will explore why Node.js is particularly well-suited for building production-ready agent runtimes — serving as the control plane for supervision, integration, streaming execution, and distributed coordination. References: OpenClaw, n8n, LangChain.

Operating Agent-Based Systems - Overview, Configure, Run, Orchestrate, Monitor

Alex Korzhikov

Pavlik Kiselev

<div>Many front-end developers build modern applications with confidence, but struggle when it comes to shipping those applications to production. Docker, CI/CD, environment configuration, performance tuning, and deployment often remain “someone else’s job” — until something breaks and becomes your responsibility. This workshop closes that gap. It’s a practical, production-focused workshop designed for front-end developers who want to take full ownership of their front-end applications — from local development to stable, production-ready deployments. You’ll learn how to: </div><ul><li>Dockerize front-end applications for both development and production</li><li>Create optimized, production-ready Docker images for modern front-end frameworks</li><li>Optimize front-end applications for performance, stability, and reliability</li><li>Avoid common production mistakes seen in real-world front-end projects</li></ul>Docker for Front-end Developers is a practical book designed specifically for front-end engineers who want to truly understand and confidently use Docker in real-world projects — written by Docker Captain and author of the official Docker React.js sample documentation Kristiyan Velkov — with 30% off using code DOCKER30.

DevOps for Front-end Developers: From Local Code to Production by Docker Captain

Kristiyan Velkov

Standardization pays off - but adoption is where teams bleed. An engineer’s view of adopting Netflix’s UI paved road tooling - Web Framework, Hawkins design system - covering the bumps (and fixes) with real-life examples and playbooks you can apply.

Walking the Netflix Paved Road (Bumps Included): Web Framework, Hawkins Design System

Misha Kazakov

TanStack AI is an open-source project built to make it easy for developers to use AI in their applications and in this talk Alem will explain how they used AI to help them prototype concepts, solidify API's and ship the final library in under a month's time. Learn practical use-cases for AI in your day to day life through the lessons learned on the development of TanStack AI.

How We Used AI to Build TanStack AI

Alem Tuzlak

Memory leaks in single-page applications are often viewed as mere technical debt, but data shows they directly degrade user experience and engagement. In this talk, we introduce MemLab, an automated framework that identifies memory leaks by simulating user interactions and analyzing heap snapshots.

MemLab: Automating Memory Leak Detection and Heap Analysis

Liang Gong

In this hands-on workshop, you’ll learn how to integrate AI directly into your application using TanStack AI. We’ll build a working AI chat feature end-to-end, starting from server setup and finishing with a streaming client, tool calling, human-in-the-loop workflows, and real debugging using TanStack DevTools. Through guided exercises, you’ll learn how to set up TanStack AI on the server, connect a client application to a streaming AI backend, build a functional chat interface, create your first AI tools, and implement approval flows so humans can stay in control when tools are invoked. By the end of the session, you’ll understand the core building blocks of AI-powered applications and walk away with a solid foundation for adding intelligent chat and tool capabilities to your own apps. Workshop outcomesWhen you're finished with this workshop you will:<ul><li>Understand how to set up TanStack AI on the server and wire it to a provider (like OpenAI)</li><li>Know how to connect a client app to a streaming AI endpoint and handle incremental updates cleanly</li><li>Build a functional chat UI with a solid state model for messages, streaming tokens, and tool results</li><li>Create and use your first AI tools with clear inputs, outputs, and predictable behavior</li><li>Build human-in-the-loop workflows with tool approvals so your app can ask for confirmation before executing sensitive actions</li><li>Debug and inspect your AI app using TanStack DevTools, including tool calls, responses, and streaming behavior</li></ul>What you'll learn TanStack AI gives you the primitives to build real AI features, not just a demo prompt box. This workshop focuses on wiring everything together properly, from server-side streaming to client UX, then layering in tools, approvals, and debugging so the final result is something you can confidently evolve into production features. You’ll learn the following through these exercises:<ul><li>Server setup - Configure TanStack AI on the server, connect to your model provider, and expose endpoints that support streaming chat</li><li>Streaming and SSE - Implement and consume streaming responses, understand the lifecycle of a stream, and build UI that stays responsive while tokens arrive</li><li>Chat UI and state - Build a chat interface that handles message history, partial responses, loading states, and tool outputs in a clean way</li><li>Tools - Define tools, validate inputs, return structured outputs, and integrate tool results back into the conversation flow</li><li>Human in the loop - Add approval steps for tool execution, implement “approve/deny” flows, and keep users in control when actions matter</li><li>Debugging with TanStack DevTools - Inspect requests, responses, tool calls, timing, and streaming behavior so you can troubleshoot fast and iterate safely</li></ul>Prerequisites This workshop assumes you can build and run a React + TypeScript app locally and you are comfortable working with a basic server setup.<ul><li>Basic understanding of SSE and streaming is required (we’ll use streaming heavily throughout the workshop)</li><li>Experience with React is required (components, state, props, rendering lists)</li><li>Basic TypeScript knowledge is required (we’ll rely on types for tools and structured outputs)</li><li>You will need an OpenAI API key with available credits to use during the workshop exercises</li></ul>

Building AI-Powered Apps with TanStack AI - From Setup to Chat Tools

For 11 years the WhatsApp Web platform has been used by a billion people, without any consistent design system the entire time. This talk is the story of I sold the project, built one from scratch, and influenced others, to migrate it into a 1M+ LoC frontend. Plus, how this project was both boosted by AI and strongly benefits AI productivity.

Creating a Design System for 1B+ Users in the Age of AI

Noah Yamamoto

JS Nation

I’m attending JSNation – the main JavaScript conference of the year. You may join me there for free with 10k other JS engineers and 40+ great speakers. Just follow this badge. 

#javascript

Discover the future of the JavaScript development ecosystem and get connected to its stellar crowd! JSNation is the best place to learn about JavaScript – beside the main JS conf talks and panel discussion with high-profile specialists, be prepared for awesome MCs, in-depth workshops, a number of discussions &amp; networking rooms, interactive entertainment, and engaging challenges for all participants.

JSNation 2026

FocusReactive

TinyMCE

Hygraph

Storyblok

Sentry

Handsontable

Twilio

FusionAuth

Datadog

CodeRabbit

Algorand

AG Charts

A front-end component that combines data grid features with spreadsheet UX/UI. Professional support included. Works with React, Angular, Vue, and plain JavaScript.

AG Charts is a new JavaScript Charting Library built by AG Grid. With support for React, Angular, Vue and Vanilla JS, AG Charts is built with the same focus on performance, reliability and ease of use you've come to expect from us, and works seamlessly alongside AG Grid or as a completely standalone solution. Get started with our free community version, or upgrade to Enterprise to access advanced series types and features, which you can also use via Integrated Charts in AG Grid. Learn more at <a href="https://ag-grid.com/charts/" target="_blank" rel="noopener noreferrer">ag-grid.com/charts</a>.

Storyblok is a CMS that works with all modern frameworks and platforms so you are completely free to choose the best option for your project. Kickstart a new CMS project with your favorite technology in a matter of minutes, and for free.

Sentry is essential for monitoring application code quality. From Error tracking to Performance monitoring, developers can see clearer, solve quicker, and learn continuously about their applications — from frontend to backend.&nbsp;

Twilio equips developers with tools to create seamless communication experiences. Whether it's secure verification, real-time messaging, or interactive customer support, Twilio's solutions make it easy.

Get RCS on Twilio Messaging — no code changes required

Any Language. Any Platform. Any Technology.

CodeRabbit is an AI Code Reviewer that works with your existing tool chain like ESLint, Biome, and provides context-aware code review comments with 1-click computable suggestions.&nbsp;CodeRabbit is free for open source.&nbsp;

Algorand is an energy-efficient, quantum-secure, single-layer blockchain with instant finality, consistently high throughput, and low fees.

FocusReactive is a <a href="https://focusreactive.com/nextjs-agency">NextJS expert agency</a> with deep expertise in <a href="https://focusreactive.com/headless-cms-agency">Headless CMS</a> and <a href="https://focusreactive.com/headless-commerce-agency">Headless Commerce</a>. Independent <a href="https://focusreactive.com/storyblok-expert-agency/">agency partners of Storyblok</a>, Payload CMS, Vercel, Shopify, and Sanity to build fast, scalable, SEO-friendly platforms - and provide NextJS tech &amp; AI SEO audits to optimize existing sites.

JSNation 2026

The main JavaScript conference of the year

Varun

Ciarán Curley

Lera

Lera

Aleksei Podgaev

Faris Aziz

Seungho Park

Krasimir Tsonev

Phil Nash

Rajni Gediya

Kyle Langford

Houda Mouttalib

Joanna Otmianowska

Vinicios Neves

Vasilii Boldurean

Hunor Márton Borbély

Jose Pablo Fernandez Guerra

David Barry

Jeroen van Wissen

David Pugh

Rosario Terranova

Alla Kaplia

JA

Petar Kuzmanov

João Portela

Emerson Marini

Mangirdas Darguzis

Boris Karaivanov

Carolina

Svetlana Smirnova

Denis Radin

Ondrej Zicha

Ivan Almasi

Alex Perez

Total attendees