Schedule

Playwright enables reliable end-to-end testing for modern web apps. It supports Chromium, WebKit, and firefox for testing on Windows, Linux, and macOS, locally or on CI, in either TypeScript/JavaScript, Python, .NET and Java.In this talk let's explore some advanced Playwright capabilities and uncover a range of features and tips and tricks that you may not know about from project dependencies to API mocking, testing time and more.

Learn how I built an AI-assisted codemod tool, exploring AI performance and automation. See its impressive ease and speed, inspiring you to create your own AI-driven solutions.

Because of the availability of various AI services and open source LLMs, we are now able to build very sophisticated "agentic" applications. Managing concurrently running multiple AI agents and controlling data-flow among them is quite difficult in traditional Promise or async/await programming. We propose a "data-flow programming" style along with a reference open-source implementation, GraphAI (https://github.com/receptron/graphai).

Ever want to build a component library but felt too intimidated? Don’t worry! I’ll walk you through the dilemmas you’ll face when creating your first component library. I’ll show you how to consider the right solutions, and I’ll share some of my personal experiences.

Media streaming is ubiquitous... We listen to our favourite songs while running, or sitting on the train. We are absorbed by audiobooks written by our favourite authors. We watch TV series or movies with our family and friends.

Watch me run real obfuscated malware from NPM safely while revealing what it does. Learn how it's possible and use the technology behind it to secure your application from malicious code that gets past your audits and detections.And if obfuscation is not enough, watch it applied to a malware payload delivered as pre-compiled V8 bytecode with no source code provided for it.

You can build applications with a local-first focus. In this case study, we dig into how you might use WASM to run Whisper.cpp for Speech-to-text and also use WASM to host a local SQLite database. The only reason we need a network connection at all for this application is to get the initial JS payload and to download the Whisper models from a remote store since they can get quite large.

Two aspects of resolvers have an outsized influence on their performance: the size of the execution context, and the way we compute their value. In the Node.js implementation of graphql, promises wrapping primitive values are especially disruptive, since they add a large computing overhead. The context size creates a memory usage baseline that can rise very quickly with even small additions to the context, when there are many concurrent contexts. The execution can create temporary objects, increasing memory usage.

In a world of components written in JavaScript, CSS became a second-class citizen. But forget the memes. In this talk Tony shows how modern CSS can be a JavaScript developers best friend, saving coding time, and avoiding the kinds of styling problems that use to plague JS devs and have resulted in a myriad of competing CSS abstractions, which may not be so necessary any more.

How does a big organization become accessible? Let’s talk about a11y scaling strategies. To find out how to become accessible, and stay accessible.

Local-first is a new way of building apps around local state (that is synced among users and server workers) instead of using traditional APIs and databases.In this talk we'll have a look at what that looks like with my framework, Jazz (for TypeScript/React). We'll see how writing an app becomes little more than defining a data schema and building some UI.

Nue makes cleaner codebases, brings faster tooling, and spits out websites with incredible design and usability.1. Cleaner codebases* Content first* Decoupled design* UX/CSS mastery2. Faster tooling* Closer to metal* Less of everything* 10x performance3. Incredible UX* View transitions* Motion design* 10x less to load4.

In this talk I will bring an overview how we handle with large process on Client Side (WebApp Applications)  using Web Api called Web Worker. I'm going to bring a view of a use case that I had to apply web workers and the advantages it brought in heavy processing, called “Rinha Front end” on Brazil, an challenge where we had to process Json files of various sizes just using the client side and without affecting the user experience and blocking the use of the application.So I this talk I will bring a simple case where using pure Javascript and how to use Web Workers to process out of the main thread and block our interactions with the page. We will create a simple application using vanilla JS and I will introduce you this feature.

Freestyle is a new JavaScript runtime that gets rid of your database, by letting you make your in memory JavaScript stateful🤯 . We're going to go through the implications of development beyond databases, and the implications for JavaScript engineers.

Ever been fooled by one of the many pitfalls of the JS Date object? Do you bundle time zone data? Then check out Temporal! Temporal is a TC39 proposal currently being implemented in JS engines, that brings better date and time handling, and time zone awareness, to JS.

This session will guide you through the advanced field of AI- E2E UI Testing, focusing on how it speeds up test creation and simplifies test maintenance. We'll begin by examining the challenges in generating E2E tests with AI, noting how this differs from the simpler task of creating unit tests.The discussion will then shift to a solution that addresses these challenges effectively. Prepare to see a live demonstration where we'll craft an E2E test using popular tools like Cypress or Playwright. To wrap up, we'll look into how AI comes close to fully automating the maintenance of our test suites, ensuring they stay up-to-date with minimal manual intervention.

Voice interfaces surround us daily, helping us with some tasks. But let's forget productivity for a second and experiment with our voice on the Web.We will look at the current state of the Web Speech API, explore its potential in Karaoke, and have some fun!

Tired of keeping up with the latest JavaScript test runners? You're not alone. Let's take a journey from the days of Selenium (//div[@class='nightmare']) to the refreshing simplicity of Vitest. Through conversations with framework creators and battle-scarred developers, we'll explore why we keep reinventing testing tools—and why that's not always a bad thing.

Retrieval augmented generation (RAG) provides large language models with up to date information and helps them hallucinate less. But how does it all work beneath the covers?In this live coding session we'll build the components of a RAG system from scratch in JavaScript. (Aside from the LLM, there probably isn't time for that!) By building our own, we'll understand vectorisation, similarity search, and the role of embedding models and vector databases. We'll then plug it all together to see our augmented bot in action.You'll get a good grounding in the components of successful chatbots and why they work.

In today's fast-paced digital world, real-time event-driven applications are at the heart of delivering dynamic and responsive user experiences. This session will delve into the technical intricacies and immense potential of building such applications using JavaScript.Together, we will explore the core concepts of event-driven architecture (EDA) and its implementation in JavaScript. Key topics will include a technical overview of the event loop and non-blocking I/O, WebSockets, and Message Brokers.We will further our journey with a look at how to apply these technologies into different use cases such as live data feeds, and collaborative applications while ensuring low latency and fault tolerance.

Figma, Google Docs, Miro, and several other tools allow you to see in real time what a person is doing, but how? In this talk, you’ll get to know the concept of event-brokers, pubsub design pattern, web sockets. We will unravel these features and understand how to make them.

Accessibility is crucial for creating inclusive products and often for meeting legal requirements too. However, assessing and quantifying a company's progress in this area can be challenging. At Stack Overflow, we transitioned from hastily addressing accessibility issues to a proactive strategy that integrates accessibility into our product development lifecycle.Join me as I share how the Design System team at Stack Overflow spearheaded this transformation by defining clear targets, securing engineering commitment, and developing an accessibility dashboard that tracks progress and provides actionable insights. Learn how we created a semi-automated accessibility scoring system that helped us to establish accessibility service level objectives (SLOs) for our products.

Building a monorepo is like flying a spaceship: many people work together to make sure things don't go up in flames.In this talk we'll go over tools, techniques and best practices to help us put out fires and stay on course throughout our intergalactic journey.Disclaimer: attending this talk probably doesn't qualify you to fly spaceships!

When was the last time you peeked inside the dist folder to inspect the JavaScript generated by your framework or bundler?The reality of modern JavaScript development with it's reliance of bundlers, frameworks and compilers is that the JavaScript you write is not the same as the JavaScript that runs on your browser. Tools like TypeScript and compilers like Babel allow you to support a variety of older browsers, environments, and runtimes while writing modern, maintainable code, but it can be hard to tell what is going on in that final bundle. It's crucial to understand and optimize the generated JavaScript produced during your build process so that you maximize performance.Join Abhijeet Prasad, maintainer of Sentry's open source error and performance monitoring JavaScript SDKs as he walks through the performance and bundle size implications of generated JavaScript and techniques you can use to optimize it. He'll walk through transpilation nuances, tree-shaking, minification, and loading strategies so you can understand how to deliver better experiences for your users.

SVG Filters is a powerful web technology that managed to elude the mainstream. It allows us to write computer vision primitives, that when combined can create amazing effects with just a few lines of SVG markup.In this talk we'll dive into some code examples of using SVG filters, like creating a live webcam green screen filter, adding an infrared effect to the screen, and other cool effects you wouldn't believe your browser can do so easily.

Virtual scrolling is a clever way to reduce rendering overhead, and is especially helpful as the complexity of websites increases. Although there are many plug-and-play libraries which support virtual scrolling in various frameworks, rolling your own is surprisingly easy. In addition, this allows one to maximally optimize each viewport for its content, unlocking additional performance savings.In this talk, you will learn how to create a flexible virtual scrolling viewport from scratch, and make it performant using concepts from functional programming. We will be following an implementation of a virtual scrolling viewport using web components from start to finish, including variable element heights, skeletons, asynchronous child component rendering.

As developers, we constantly ship new features to production, but how do we know their impact? In this talk, we’ll discuss why it’s important to adopt experimentation-driven development, how to get leadership buy-in, and ways this can go wrong.

The long-awaited moment has arrived: SolidStart is out of Beta!But what does this mean for us?What should we all know about this unopinionated meta-framework?Join me to learn everything you need to start shipping full-stack SolidJS applications.

Reusing front-end features built by different teams can be challenging depending on the chosen approach. If we use a library, what about versioning and maintenance? If we use a monolith, what about build times? We can find a pragmatic solution in Module Federation, not only for sharing features but also for dividing and conquering.

Every developer knows that i18n is painful. We found the curing pill in the form of version control. We'll talk about: - what's the *actual* problem with i18n?- how to solve the orchestration problem?- demo e2e collabroation between devs, designers, and translators

Micro Frontends are everywhere - on the client, on the server, and on the edge. Quite often the scalability of micro frontends is determined by the freedom and independence of the teams using them. This can lead to problems as potentially arbitrary code enters the applications at runtime asking the question of what potential vulnerabilities exist and how to mitigate them.In this session, you'll hear about some of the most frequent vulnerabilities that appear in real-world projects using micro frontends. You'll see what you can do to get rid of them and avoid mistakes leading to security issues.

What if we could use all the advanced mathematical functions, data analysis and visualization tools, etc., inside our browser, with JavaScript, instead of relying on python libraries such as numpy and scipy, without much degradation of performance? Yes, that is possible - with stdlib, which is a standard library for javascript and node.js.

This talk explores the relationship between personal career development and contributions to open-source projects. We'll look at the skills developers can level up, the visibility they can gain in the tech community, and the doors that can open through regular contributions to open source. Attendees will leave with tipson how to start contributing, how to choose projects that align with your career goals, and how to document your contributions for career growth.

TypeScript's static typing catches many errors, but how do we ensure our type definitions themselves are correct? This talk introduces type testing and demonstrates its implementation using expect-type, a lightweight library for exactly this.We'll cover:- The concept of type testing and its importance in TypeScript projects- A deep dive into expect-type's features and API- Practical examples of using expect-type to catch subtle type errors- Integrating expect-type into existing projects and CI pipelines- Advanced use cases and best practicesDrawing from real-world scenarios, we'll explore how expect-type can be used as a standalone library, or through Vitest which bundles it natively, to enhance type safety and code quality.Suitable for TypeScript developers of all levels, this talk will equip you with the tools and knowledge to write more robust, type-safe code using expect-type.

Have you ever had that sinking feeling when your favorite app suddenly stops working? You’re not alone. Frontend teams focus on client-side performance to enhance user experience, where customers spend time and revenue is generated. Tools like RUM and Synthetic Monitoring help, but they're outdated and not sufficient.

The devastating wildfires that ravaged Europe in 2023, burning an area the size of London, highlight the urgent need for improved fire detection and reporting systems at scale. In this talk, we will explore how JavaScript and widely available electronics can be combined to create a low-cost, cheap and effective wireless fire detection system. We will deploy this system in a wild forest in Greece and utilize AI models to predict where the next blaze could be sparked.