The state of frontend development last couple years is in an odd place for the uninitiated web developer and expert alike. Server Components? Resumability? Hydration?

No more loaders, no more errors - Suspense has revolutionized the way developers handle asynchronous operations.But have you ever wondered what magic enables Suspense to work? How does Suspense know it has to display a fallback because a query is going to happen in a component below?In this talk, we’ll explore the inner workings of Suspense to uncover the magic that empowers one of the most beloved components of React.

What's next for Astro? Hear from Fred K. Schott (Astro co-creator, core maintainer) about the future direction for Astro's content-driven web framework. Featuring new announcements and demos that build on three of Astro's foundational core primitives: Islands, Content Collections, and View Transitions.

Did you know introducing useEffect solved a whole class of performance issues? Did you know <Suspense> was designed to make hydration several times smoother without you even noticing anything? React has changed a lot. Many of these changes were driven by a desire for better architecture.

Building end-to-end encrypted applications is exciting, but also intimidating. This talk is designed to lower the entry barrier, offering a clear roadmap for integrating end-to-end encryption in collaborative, real-time applications.We begin by unveiling a simple design with one shared encryption key, promptly addressing its inherent challenges. Progressively, we delve into tools like Opaque, Secsync and CRDTs to tackle the challenges we identified and enhance our application with the goal of offering a seamless user experience without compromising on security.Each segment of the talk starts with an accessible overview before diving into practical, code-based examples. This approach not only demystifies the intimidating theory and empowers attendees with the tools and knowledge to apply these principles effectively in their projects.

Managing state in React is complicated. Humans are even more complicated. As developers, it's our job to deliver seamless and intuitive user experiences, but the sheer complexity of human behavior and the real world can make this harder than it should be. In this talk, we'll explore a radical new approach to app development where language models (LLMs) and reinforcement learning (RL) can be used to handle app logic in a more intelligent and human-centric way.

Everybody seems to be talking about "types" these days. From the TypeScript language to type description utilities such as prop-types and Zod, developers expect clear descriptions of the shapes of their React components, data, and hooks. Let's talk about the mindset shift that's happened over the last decade, and where types are taking us over the next one.Brief foundations: what is TypeScript, what "type safety" means, and setting up TypeScript in a React (Next.js) projectA history of how type safety has worked in React, starting with class componentsThinking in Type(s|Script): How modeling value shapes helps raise predictability and understandability, especially in the wildest and wackiest of React architectures.TypeScript's Limitations: By design, TypeScript can only act as a development-time type system and enforce what that system can represent. We'll want to go over what can't and/or shouldn't be represented in that type system.Raising the Runtime: Moving those type thoughts into your React runtime with programmatic frameworks or libraries such as tRPC and Zod - especially as they integrate with React metaframeworks like Next.js and Remix.React Specifics: How this "types-first" theory works helps improve common parts of projects in the React ecosystem: from prop-types back in the day to REST or RPC endpoints, testing, and documentation today.ESLint lint rules to catch common async and React code bugs - and why the language is designed to let you do those dangerous things in the first place.Ecosystem future: where the TC39 types-as-comments proposal will -and won't- take types at a language-level for JavaScript in general and React apps specifically.By allowing our types to be a reflection of the runtime reality, we embrace types-first thinking in designing code - making our code more clear to read and update.

The design-development gap hurts your React projects: slower timelines, compromised quality, and repetitive handoffs. This talk explores the origins of this problem, the differences in language and environment, and offers solutions through processes, tools, and collaboration. Discover how including designers throughout the implementation process helps developers reduce friction, speed updevelopment, and deliver exceptional UIs.

We’ve been hard at work to create a first-look at data fetching, server rendering, and streaming in universal Expo Router apps.

I've always avoided trying to do sales pitches for Redux, and tbh most of my time has been spent telling people when they _shouldn't_ use Redux :) But I still see lots of folks asking "_when_ should I use Redux?", and "how does Redux compare to $OTHER_TOOL?". So, I figure it's worth actually doing a talk where I cover the actual benefits and reasons to consider using Redux today.

SolidStart is the full stack Meta-Framework from the SolidJS ecosystem. It brings multiple tools and libraries together in a composable fashion to offer highly performant, understandable, and scalable foundations for web applications. Let's explore how SolidStart solves common UX and DX for building better apps.

This talk offers a gentle introduction to a new paradigm of durable workflows by walking the audience through a common use case: user onboarding email campaign. I’ll show how the DIY approaches tend to be slow and unreliable — or require significant investment of resources. Instead, by embracing background jobs you can deliver a great User Experience and stress-free ops. More and more companies favor short development cycles and lean approach to headcount.

Labeled arrows are one of the most widely used features when it comes to whiteboard, isn't it? In this talk, I will be deep-diving into the internals of labeled arrows and how they work under the hood in Canvas and SVG and I will be also sharing my experience building labeled arrows in Excalidraw - A virtual free Open-Source collaborative end-to-end encrypted canvas-based editor for sketching hand-drawn diagrams.

Twitter influencers would have you believe that if you just use the semantic html tag for elements instead of a div, your components will be accessible. but there’s a lot more that goes into it!Let’s zoom in on one component from GitHub (one that you’ve probably used before!) and look at all the accessibility considerations involved and interesting challenges in implementing them.

We'll delve into the intersection of web development and NFT (Non-Fungible Token) technology. As the digital landscape continues to evolve, developers are constantly seeking innovative ways to enhance user experience and security. From authentication to user permissions. NFTs offer a decentralized and secure solution that can reshape the way we interact with web applications.

Lessons I learned on my journey to working full time on open source, as well as tips for thinking and making open source projects more successful.

Create React App (CRA) was a game changer in garnering React adoption. Prior to the release of CRA, the experience of setting up a React app was more about configuring webpack than it was actually writing React code.Now that the React docs no longer list CRA as a suggestion on the “Start a New React Project” page, and additionally recommend you pick a React-powered framework, the getting started experience is once again fragmented.CRA was never meant to be how you built a full-featured React app anyway. It was a starting point, and a really good one. Inevitably many developers (such as myself) used CRA to build websites, and lots of them.