My name is Mauro and I work for a company called Doubleloop in Italy. Today, I'm going to share my learning journey through puzzles and challenges related to React Server Components (RSC). RSC allows for server-side rendering and streaming of components. React flight, a protocol used to serialize and share rendering jobs, is a key feature of RSC. RSC can be used without a server, known as React Serverless Components. Using RSC, different types of content can be switched using the useState hook. RSC can be effectively used on a server by starting Node.js with a specific flag. Client-only components recognized by RSC can be executed on the client. React Streaming Components introduces the streaming concept and allows for continuous updates of the page. Advanced features of React Streaming Components include asynchronous rendering, suspense, and recursion. The React Strange Constraints challenge focuses on optimizing rendering by sending the initial page as HTML. The use of a proxy and RSE payload allows for client hydration of RSC. The possibility of using languages other than JavaScript, such as Rust, for server components is explored. RSC has the potential to become a language-agnostic protocol. The meaning of client-server roles in RSC can be extended. RSC offers streaming capabilities and the ability to balance server and client work. Infinite streaming is possible with server sockets. RSC hydration is believed to be faster than regular hydration. The Talk concludes by encouraging questions during the Q&A session.

Talk on Bund: Overview of Bund, its speed optimization, components like runtime, package manager, test runner, and bundler. Efficient features include fast npm manager, pnpm lockfile support, Jest-compatible test runner, and optimized runtime components. Built-in features like modern password hashing, WebSocket server, file glob API, and database clients. API design focuses on common use cases and optimization. Enhanced JavaScript functionality with SIMD, native code, and performance improvements. Challenges in JavaScript productivity, BUN adoption, deployment, and support. React support, community involvement, security, Next.js compatibility, and transition.

The speaker introduces Tanstack Start, emphasizing type safety for better development experiences. Tanstack Start offers a client-first approach with seamless server-side integration. Tanstack Router provides server-side solutions like SSR and API routes. The demo showcases Tanstack CLI usage and server functions. Tanstack Start enables isomorphic code with server-only logic. Enhanced data validation and URL state management are highlighted. TanStack Start enhances React development speed and quality. Integration of trpc with SSR data-only mode simplifies application migration. TanStackRouter focuses on type safety and advanced functionality compared to ReactRouter.

Talk on cross-platform React using ReactStrict DOM to unify web and native React, standardizing for consistent UI development. Fragmentation challenges in React due to lack of standardized styling systems, impacting development efficiency and product consistency. Exploring unsuccessful cross-platform React approaches and the importance of minimizing migration costs. Enabling web developers to build native apps with React Native while enhancing it with web APIs for seamless code migration. Benefits of code sharing for cross-platform apps, AI integration for React Strict DOM, and the future vision for React Native as a web renderer. Unified styling in React Native, Tailwind integration, and UI best practices. Flexibility and readiness in React DOM, potential inclusion in React Foundations, and considerations for reversibility of decisions in React DOM.

In the Talk, various key points were discussed regarding micro-front-end architecture. These included challenges with micro-intents, common mistakes in system design, the differences between micro-intents and components, granularity in software architecture, optimizing micro-front-end architecture, efficient routing and deployment strategies, edge computing strategies, global state and data sharing optimization, managing data context, governance and fitness functions, architectural testing, adaptive growth, value of micro-frontends, repository selection, repo structures, and web component usage.

Gil from Wix discusses solving a React performance bottleneck with selective hydration using Suspense API, showcasing real examples. Challenges of SSR with React hydration and its impact on interactivity and performance are outlined. The importance of selective hydration, efficient component loading, promise handling, lazy loading, and real-world impact are highlighted. Selective hydration enhances performance by reducing JS load, comparing server components with Suspense, and introducing React 19 optimizations. React 19 brings cleaner promise-based behavior, selective hydration improvements, and key takeaways on SSR benefits, suspense power, and React 19 enhancements.

Chris introduces himself as a web developer with vast experience in UX engineering, emphasizing the importance of evoking emotions through interfaces. Childhood influences from anime, Disney, and video games shape career choices. Navigating dreams of soccer and software engineering, finding joy in challenges. Reflecting on 3js experiences and the significance of the golden ratio. Explaining Fibonacci sequence, GPU shaders, and natural patterns. Using React 3 Fiber to enhance particle playground. Celebrating creativity in frontend development as a fusion of engineering and creativity.

Karl Vorden introduces signals for reactivity in JavaScript, aiming to demystify its implementation for better understanding. Signals in JavaScript provide efficient reactivity by updating only the necessary code without extra work. Different frameworks offer signal implementations like createSignal in solid JS, resembling React's useEffect but functioning differently. Vue signals are called refs, created with the ref function, returning an object with a value property. Define effect functions for tracking changes and execution in reactive signals. Explore computed functions for complex operations within reactive signals. Beware of pitfalls with conditionals affecting signal execution.

Three years ago, faced tough decision job change. Chose tech co-founder role for innovative idea 'war with apply to job button' for universities. Startup validation via email engagement with decision makers, avoiding premature seeking of investment. Emphasis on tech stack adaptability, modular design, and reusability. Challenges with third-party library management, component library reorganization, and optimizing CSS loading. Focus on app quality improvement, release process enhancement for global success.

Exploring AI's impact on React coding quality and the importance of context, tools, and practices in leveraging AI effectively. AI as a force multiplier, differences between vibe coding & AI-assisted engineering, AI models' competencies in React prompts, and React developers' favorable position amidst AI advancements. AI's implications for React development, complexity cliff in React work, and AI's design challenges for React developers. React work's complexity cliff, Design Arena benchmarks for AI design capabilities, AI's design challenges for React developers. AI's role in visual design control, Design Arena's insights on scaffolding impact, AI's UI scaffold capabilities and human judgment necessity. Vercell's Next.js evals, Webbench by ByteDance, and Web Dev Arena insights on AI performance in web development. Gemini 3 and GPT-5 catching up in design models, exploring website code generation, and design sensibility in AI for React workflow. Solving the purple problem in AI training, tips for using AI in React development for building sites, and managing AI like a junior developer. Evaluating AI's performance in complex tasks, lessons on using AI like a developer, and the importance of specificity and human oversight in AI usage. Enforcing productivity and supervision, addressing context failures through engineering and providing comprehensive context for agent performance. Template for context engineering, controlling tooling quality, using Context-7 for fresh docs and examples, leveraging MCP servers for real data, and improving overall quality loop. Connecting tools for closed-loop coding, Vive coding for rapid product creation, UI components for isolated, reusable components. UI components arena focus on isolated, reusable components and visual comparisons. Guidance for UI component generation and complex 3D and data visualization models for interactive experiences. AI assistants integration strategies for 3D and data visualization. Importance of specific details like libraries and scene descriptions for optimal AI assistance. Balancing control with AI model generation and the critical factors in AI code success or failure. Debugging workflow lessons applicable to all; New flow state in AI-assisted development focusing on orchestration and code creation; Gemini 3 launch for web development and design leadership. Website aesthetics and design improvements; Proactive tool utilization for React devs; Embrace AI for faster product development. AI in automated debugging with AI agents; Limitless potential of AI in coding quality; Image generation tools for slides; Addressing security and architectural regressions in AI-generated code. AI's Impact on Future Frameworks and Team Alignment in Workflow Standardization. Strategies for Context Bugs and Workflow Optimization.