June 13 - 17, 2024
JS Nation
Amsterdam & Online

JSNation 2024

The main JavaScript conference of the year

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 & networking rooms, interactive entertainment, and engaging challenges for all participants.

This edition of the event has finished, the latest updates of this JavaScript Conference are available on the Brand Website. Follow for more JavaScript Conferences.
HandsontableChainlink LabsNxStoryblokSentryJetBrainsTwilioBloombergAuth0 by OktaCodeiumHolepunchFocusReactiveHygraphInfobipEssent
AI First: Applications of the Future
26 min
AI First: Applications of the Future
This talk explores the ways AI is being used to shape the future of applications. It emphasizes the importance of an AI-first approach and the potential for AI to enhance various industries, such as aviation. The talk also contrasts the limitations of the AI-on-top approach with the continuous learning and user-centric focus of the AI-first approach. It discusses the importance of building trust through safety, transparency, and browser-based processing, and highlights the potential of AI to address user experience issues and improve accessibility.
AI in Front-End Dev: Your Creative Partner or Job Snatcher?
8 min
AI in Front-End Dev: Your Creative Partner or Job Snatcher?
AI in front-end development empowers developers to take on more ambitious projects and innovate at a faster pace. Natural language is a new programming language that can be used for coding, learning, and automating complex tasks. However, it is important to remember that AI is a supplement to human capabilities, not a replacement. Developers need to evolve their skills and stay ahead of emerging technologies to work effectively with AI. The demand for AI engineers is high.
Build Peer-to-Peer Applications with Pear Runtime
152 min
Build Peer-to-Peer Applications with Pear Runtime
WorkshopFree
David Mark Clements
David Mark Clements
Learn how to rapidly build peer-to-peer applications with Pear Runtime. No servers required. Understand peer-to-peer paradigms and construct applications from well-defined building blocks. This workshop will cover how to create both Desktop and Terminal applications (with discussion for Mobile) that work entirely peer-to-peer from anywhere in the world. By the end of this workshop you should know how to build a new type of highly scalable application with entirely reduced infrastructural costs (~0) along with suitable architectures and best practices for peer-to-peer applications. From the creator of Pear Runtime and the company that brings us keet.io. Table of content:- Introducing Pear- Initial Q & A- Getting Setup- Creating a Pear Desktop Application- Sharing a Pear Application- Running a Pear Application- Creating a Pear Terminal Application- Releasing a Pear Application- Architectural Discussions- Wrap-up Q & A
Leveraging LLMs to Build Intuitive AI Experiences With JavaScript
108 min
Leveraging LLMs to Build Intuitive AI Experiences With JavaScript
Workshop
Roy Derks
Shivay Lamba
2 authors
Today every developer is using LLMs in different forms and shapes, from ChatGPT to code assistants like GitHub CoPilot. Following this, lots of products have introduced embedded AI capabilities, and in this workshop we will make LLMs understandable for web developers. And we'll get into coding your own AI-driven application. No prior experience in working with LLMs or machine learning is needed. Instead, we'll use web technologies such as JavaScript, React which you already know and love while also learning about some new libraries like OpenAI, Transformers.js
How to Build Front-End Access Control with NFTs
88 min
How to Build Front-End Access Control with NFTs
WorkshopFree
Solange Gueiros
Solange Gueiros
Understand the fundamentals of NFT technology and its application in bolstering web security. Through practical demonstrations and hands-on exercises, attendees will learn how to seamlessly integrate NFT-based access control mechanisms into their front-end development projects.
10 Years of Independent OSS: A Retrospective
33 min
10 Years of Independent OSS: A Retrospective
This talk is a ten-year retrospective into the growth of the Vue.js framework as an open-source project. It highlights the challenges faced by open-source developers, the importance of finding balance and managing scope, and the collaborative nature of the Vue community. The talk also discusses the development of Vite as a build tool and the vision for a unified JavaScript toolchain. It emphasizes the need for community alignment, contributions, and testing, while acknowledging the challenges of bad actors in the open-source community.
ESLint One for All Made Easy
27 min
ESLint One for All Made Easy
ESLint is a popular and constantly improving tool that offers full control and simplicity in JavaScript with native imports. The new Flat Config simplifies the complex tree structure of shared configs and has been in the works for five years. It allows for customization and type generation, maximizing flexibility. ESLint can be used as a formatter and a tool for code mode, providing more control and customization options. It also supports other languages and can be integrated with prettier. Migrating to the Flat Config may be challenging, but compatible packages and tools are available to assist with the transition.
What's New in Astro
29 min
What's New in Astro
Astro is a web framework that aims to optimize site performance without sacrificing functionality. It introduces features such as content collections and view transitions to enhance the user experience. Astro focuses on pushing the web forward by providing browser compatibility and app-like experiences. It also explores a powerful content layer and island architecture for personalized content. Astro is recommended for content-driven websites and offers a polyfill for Safari and integration with Storyblok CMS.
From Friction to Flow: Debugging With Chrome DevTools
32 min
From Friction to Flow: Debugging With Chrome DevTools
The Talk discusses the importance of removing frictions in the debugging process and being aware of the tools available in Chrome DevTools. It highlights the use of the 'Emulate a Focus Page' feature for debugging disappearing elements and the improvement of debugging tools and workflow. The Talk also mentions enhancing error understanding, improving debugging efficiency and performance, and the continuous improvement of DevTools. It emphasizes the importance of staying updated with new features and providing feedback to request new features.
Privacy-First Architecture
29 min
Privacy-First Architecture
Building JavaScript Apps and Privacy: Understanding the importance of privacy in software development and the impact it can have on the world. Privacy concerns extend beyond targeted advertising and include data leaks and breaches. The connection of multiple pieces of data by data brokers poses a threat to privacy. The local first approach allows for data storage on local devices while still using a server for synchronization. Implementing local first requires a good database and APIs for data storage. Principles like end-to-end encryption and password protection bring benefits but also present challenges. Moving to privacy-focused analytics, using passkeys for encryption, and secure data sharing are ways to protect user privacy.
Lessons for Building Resilient Codebases
29 min
Lessons for Building Resilient Codebases
Code bases degrade over time, so it's important to build a protective layer and accept imperfections. Collocation and leaving traces in the code are key for better understanding. TypeScript's strict null checks and explicit typing can improve code reliability. Guidelines and naming conventions are crucial for maintaining a consistent and scalable architecture. Version control complexity is not significantly affected by having multiple components in one file.
Angular Renaissance
29 min
Angular Renaissance
Angular and React have similar models of reactivity, with the framework optimizing change detection. Angular introduced signals for optimizing change detection in real-world applications, resulting in improved performance. Deferrable views in Angular allow for lazy loading and significant speed improvements. The island architecture in Angular enables independent component islands without needing hydration. Angular is working on features like partial iteration and zoneless, and aims to support developers in delivering web apps with confidence.
Challenges for Incremental Production Optimizations
32 min
Challenges for Incremental Production Optimizations
TurboPack is a new bundle similar to Webpack, focusing on incremental builds to make them as fast as possible. Challenges in production builds include persistent caching, incremental algorithms, and optimizing export usage. The compilation process can be split into parsing and transforming modules, and chunking the module graph. TurboPack aims to achieve faster production builds through incremental optimization and efficiency. Collaboration and compatibility with other ecosystems are being considered, along with the design of a plugin interface and tree-shaking optimization.
Why Your Performance Work Is Not Seen
25 min
Why Your Performance Work Is Not Seen
This Talk discusses the importance of performance work and how to drive performance governance. It emphasizes the need to frame data, set meaningful budgets, and understand both engineering and product perspectives. The Talk also highlights the significance of delivering value, establishing solid performance governance, and gaining buy-in from management. Additionally, it emphasizes the importance of measuring performance, optimizing through data, and collecting performance data using tools like Speedcurve and Bugbear Sentry. The speaker also mentions their training program and expresses gratitude towards the audience.
Embracing WebGPU and WebXR With Three.js
27 min
Embracing WebGPU and WebXR With Three.js
The 3JS project has evolved into a community-driven effort with numerous contributors over the past 14 years. It started with 3D engine work in Flash and transitioned to using SVGs for rendering in HTML5 before adopting WebGL. The project showcases various projects and frameworks, including a no-code tool powered by 3.js. The team is working on a new render using WebGPU and developing a new shader language called TSL. The hope is that WebGPU will eventually replace WebGL, offering better control and performance.
Dive Into Advanced TypeScript
30 min
Dive Into Advanced TypeScript
Today's Talk discusses TypeScript and its relationship with JavaScript, emphasizing the importance of studying JavaScript first. The Talk explores type guards, runtime type checking, and the use of the 'never' type to handle errors and ensure type safety. It also delves into alternative solutions for type handling, branded types, and schema-based validation using Zod. The Talk concludes with advice on migrating to TypeScript and the need for beginner-friendly documentation and strictness in code.
Install Nothing: App UIs With Native Browser APIs
31 min
Install Nothing: App UIs With Native Browser APIs
This Talk introduces real demos using HTML, CSS, and JavaScript to showcase new or underutilized browser APIs, with ship scores provided for each API. The dialogue element allows for the creation of modals with minimal JavaScript and is supported by 96% of browsers. The web animations API is a simple and well-supported solution for creating animations, while the view transitions API offers easy animation workarounds without CSS. The scroll snap API allows for swipers without JavaScript, providing a smooth scrolling experience.
Coffee Chat With Documentation, Are You Ready?
34 min
Coffee Chat With Documentation, Are You Ready?
Maya Chavin, a senior software engineer at Microsoft, discusses generative AI and the core model for LM. The flow of a document Q&A service and the importance of prompts in enhancing it are explored. The injection and querying phases of document Q&A are explained, emphasizing the need for efficient storage, indexing, and computing relevant prompts. The talk also covers the use of embedding models, optimization strategies, and the challenges of testing and validating AI results. Creative uses of LLMs and the impact of AI on job security are mentioned.
Testing: Do More With Less
27 min
Testing: Do More With Less
This talk focuses on practical approaches for testing Node.js applications, including the use of Dora metrics and the testing trophy strategy. It emphasizes the importance of covering critical flows with integration and end-to-end tests, while also considering the cost and speed of different test types. The speaker recommends mocking third-party services and using snapshot testing, but warns about the potential for false positives. Playwright is suggested as a preferred tool, and the importance of automated test execution is emphasized.
Unlocking Digital Ownership: How to Store Accounts Using Blockchain Technology
30 min
Unlocking Digital Ownership: How to Store Accounts Using Blockchain Technology
Welcome to the talk about digital ownership using blockchain and NFTs. Explore NFTs and their integration with blockchain. Learn how to create NFTs using Remix on the Sepoia test network. Deploy and access the smart contract on the blockchain. Connect your wallet and grant access to NFTs. Understand the blockchain structure and its authentication capabilities. Connect your wallet with the frontend and interact with it. Explore blockchain connections with Chainlink. Understand gas fees and account abstraction in blockchain transactions. Learn about ownership, account recovery, and data storage on the blockchain. Discover how blockchain can be used for public information, databases, and its energy costs. Gain insights into blockchain functionality and data storage.
WebXR? Virtual Reality and Augmented Reality Natively on Browsers
28 min
WebXR? Virtual Reality and Augmented Reality Natively on Browsers
JS Nation explores the power of the web, including virtual and augmented reality experiences. WebXR and A-Frame enable creating native-like experiences using web technologies. Tooling and resources are available to develop and experiment with WebXR. The possibilities for web development and creative projects are endless. Improving AR devices, enhancing PDF viewers, and utilizing AI assistants are areas of interest. JavaScript abstraction and positive audience feedback were highlighted.
Come On Barbie, Let’s Go Party: Using AI for Music Mixing
27 min
Come On Barbie, Let’s Go Party: Using AI for Music Mixing
Today, we explore DJ mixing and how deep learning revolutionizes the art by discussing sound processing, extracting features, and using machine learning. Deep learning allows for efficient extraction of audio features and high-resolution track separation. Neural networks can achieve source separation by converting audio to spectrograms and applying convolutional and recurrent neural networks. This has immediate impact on industries such as karaoke and music transcription.
What Is the Accessibility Tree, Really?
19 min
What Is the Accessibility Tree, Really?
This is a presentation on accessibility and screen readers. The speaker discusses the evolution of screen readers and how they adapted to graphical user interfaces. Accessibility APIs and the accessibility tree are introduced, allowing programs to construct a text database used by assistive technologies. The accessibility tree may vary across browsers and platforms, excluding elements that are not relevant to assistive technologies. The ARIA hidden state and element properties play a role in determining the accessibility of elements, and the accessible name can be derived from text content or specified using ARIA attributes.
Can AI Turn Us Into 10x Developers?
7 min
Can AI Turn Us Into 10x Developers?
AI can help developers become 10x more efficient by leveraging powerful GPUs. Codium is an AI developer tool that can accelerate learning, analyze dependencies, and provide personalized coding experiences. It abstracts away complexity and allows developers to focus on building user experiences. Codium aims to transform the software industry and empower developers to become 10x engineers.
Simplify Package Releases – From Versioning to Publishing
7 min
Simplify Package Releases – From Versioning to Publishing
The Talk focuses on the Nx release command for publishing npm packages in a monorepo setup. It ensures correct package publishing order, handles versioning and change logs, and allows for simulating changes before publishing. Advanced features include configurable versioning, group releases, and support for different languages. Documentation, videos, and recipes are available for customizing and automating releases on your CI system.
Building a JS Engine -- For Fun!
9 min
Building a JS Engine -- For Fun!
Top Content
The Talk discusses the basics of building a JS engine, highlighting the complexity and feature completeness of existing engines. It emphasizes the possibility of creating a simpler engine tailored to specific use cases and target audiences. The speaker suggests starting anywhere in the process and provides tips on using parser libraries, implementing runtime features, and ensuring correctness through testing. Additionally, the Talk encourages exploring JavaScript standards and engaging with the open-source community.
Pear Runtime: Zero-Infrastructure, P2P High-Scale Applications
8 min
Pear Runtime: Zero-Infrastructure, P2P High-Scale Applications
Pair Runtime is a fully peer-to-peer runtime that operates on user devices, with no data stored in the cloud. Pair is a development and deployment tool that enables creating and running Pair applications on user devices. Pair is a platform for building terminal, desktop, and mobile applications, providing all the necessary tools and resources. It offers inherent data security and uses a hole-punching algorithm to connect peers. Pair is designed for simplicity and true security.
JSR – Next Generation JavaScript Registry
6 min
JSR – Next Generation JavaScript Registry
JSR is a new JavaScript registry that supports TypeScript and offers additional features like GitHub Action integration, provenance attestations, and documentation generation. It provides a simple website with package search, documentation, and a gamified score. The process of publishing a new package in JSR involves creating a JSR.json file with package details and exports, using MPX JSR publish to publish the package, and approving authorization in the browser. However, documentation for the package is not automatically generated and needs to be manually added.
Web Apps of the Future With Web AI
32 min
Web Apps of the Future With Web AI
Web AI in JavaScript allows for running machine learning models client-side in a web browser, offering advantages such as privacy, offline capabilities, low latency, and cost savings. Various AI models can be used for tasks like background blur, text toxicity detection, 3D data extraction, face mesh recognition, hand tracking, pose detection, and body segmentation. JavaScript libraries like MediaPipe LLM inference API and Visual Blocks facilitate the use of AI models. Web AI is in its early stages but has the potential to revolutionize web experiences and improve accessibility.
htmx Is Pro-JavaScript
22 min
htmx Is Pro-JavaScript
HTMX is a JavaScript library that extends HTML and works with a JSON API. It generalizes the functionality of links and forms, making any element a potential hypermedia control. HTMX simplifies the implementation of hypermedia functionality with a dozen core attributes. It can achieve powerful UI results without writing much JavaScript. HTMX complements JavaScript libraries and enhances user experience by providing functionality that the browser lacks.
Automate the Browser With Workers Browser Rendering API
20 min
Automate the Browser With Workers Browser Rendering API
The Talk discusses browser automation using the Worker's Browser Rendering API, which allows tasks like navigating websites, taking screenshots, and creating PDFs. Cloudflare integrated Puppeteer with their workers to automate browser tasks, and their browser rendering API combines remote browser isolation with Puppeteer. Use cases for the API include taking screenshots, generating PDFs, automating web applications, and gathering performance metrics. The Talk also covers extending sessions and performance metrics using Durable Objects. Thank you for attending!
Explain Like I’m Your Manager: Digital Accessibility
20 min
Explain Like I’m Your Manager: Digital Accessibility
Experience the challenges faced by visually impaired people and optimize user experiences for different viewports. Understand the importance of digital accessibility and its benefits for businesses. Learn about the obligations for businesses to deliver accessible features and the correlation between accessibility and organic reach in search engines. Discover the three fundamental steps to work on accessibility and the concept of continuous accessibility. Find out how to test, fix, and mentor accessibility issues and how to get people on board by gathering champions and incorporating accessibility into workflows.
Reverse-Engineering Everything to Get Rid of Trust Issues
20 min
Reverse-Engineering Everything to Get Rid of Trust Issues
JavaScript's power and versatility make it the programming language of choice for consumer applications worldwide. A JavaScript engineer should understand how things work, even if they don't know everything. The Talk discusses modifying websites, uncovering game rigging through developer tools, analyzing fetch requests and overrides, refactoring and state management, and website modification. The speaker shares personal experiences and highlights the importance of understanding and being able to modify code in real-time.
Using WebAssembly to Bring Command-Line Tutorials to Life
23 min
Using WebAssembly to Bring Command-Line Tutorials to Life
WebAssembly is a cost-effective way to distribute computation and allows for code reuse and performance optimization. It can be used for running bioinformatics tools in the browser without setup, but running it on the server or smaller devices may have limitations. WebAssembly is best suited for playgrounds, small-scale simulations, audio and video processing, and upload pre-processing. It offers few benefits outside the browser for server-side applications, but can be useful for running user-provided code and serverless functions.
Mastering Cryptography Fundamentals With Node’s Crypto Module
25 min
Mastering Cryptography Fundamentals With Node’s Crypto Module
This Talk provides an introduction to cryptography with Node.js, covering encryption concepts, AES-256-CBC algorithm, initialization vector for encryption, key derivation function and salt, randomness and key agreement, key distribution and RSA, signing and verification, public key certificates, and trust in certificate hierarchy.
Conquering Complexity: Refactoring JavaScript Projects
21 min
Conquering Complexity: Refactoring JavaScript Projects
Today's Talk explores the complexity in code and its impact. It discusses different methods of measuring complexity, such as cyclomatic complexity and cognitive complexity. The importance of understanding and conquering complexity is emphasized, with a demo showcasing complexity in a codebase. The Talk also delves into the need for change and the role of refactoring in dealing with complexity. Tips and techniques for refactoring are shared, including the use of language features and tools to simplify code. Overall, the Talk provides insights into managing and reducing complexity in software development.
The Oxc Project, and the Effect of Performance Engineering
18 min
The Oxc Project, and the Effect of Performance Engineering
The Talk discusses the JavaScript oxidation compiler (OXC) project and the impact of performance engineering. The OXC project consists of JavaScript tools written in Rust, including a parser, linter, and resolver, that are significantly faster than existing alternatives. Testimonials highlight the progress of the OXC project and the speed and effectiveness of the OXLint tool. The emphasis on performance in OXLint is demonstrated through cross-file linting and parallel processing. Performance improvements in the OXC project are achieved through benchmarking and can drive innovation in JavaScript infrastructure. The talk also discusses the need for faster website loading and the goal of creating a new minifier for better compression and performance in OXC.
Forget Polygons – Gaussian Splats, the New Approach to Photorealistic 3D Graphics
5 min
Forget Polygons – Gaussian Splats, the New Approach to Photorealistic 3D Graphics
Today, I'll be talking about GspotJS and Gaussian Splatting, a revolutionary graphics pipeline that can render high-fidelity scenes at 144 FPS. Gaussian Splatting is a technique that converts data directly into an image using Gaussians. GspotJS is a lightweight JavaScript library for Gaussian Splat rendering, with features like 4D rendering. The library aims to provide a simple and speedy way to view Splats on the web, while more advanced applications can use Mackellog Gaussian Splats 3D. Both Gaussian Splatting and gSplotJS are open-source.
What's Inside Biome's Linter?
10 min
What's Inside Biome's Linter?
Today, we're going to talk about the Biome Analyzer, which is not just a linter or a CLI tool. It takes advantage of multi-threading, channels for communication, and caching to achieve high performance. The analyzer complements the parser and provides features like import sorting and emitting new diagnostics. It is LSP ready, can automatically sort JSON keys, and can be used as a CLI tool for enforcing refactors. The Biome Analyzer showcases its impressive performance in handling large codebases in a video demonstration.
What’s the Deal With Drizzle ORM?
8 min
What’s the Deal With Drizzle ORM?
Drizzle is a TypeScript ORM that leverages SQL knowledge, is fast and has its own ecosystem. It manages database schema and supports prepared statements for peak performance. Drizzle provides a complete set of tools, including Drizzle Studio and query runners. The ecosystem includes GraphQL integration and community-built tools.
Say WAT Now!? Turbocharged JavaScript With Hand Crafted WASM
11 min
Say WAT Now!? Turbocharged JavaScript With Hand Crafted WASM
JavaScript became successful due to its association with the browser as the only runtime. WebAssembly (WASM) is a virtual machine that can run anywhere and has a different computation model. WebAssembly code can be analyzed and converted into a more readable format. It can be used to accelerate code and enhance performance. Check out Austin Theroux's repository for examples.
JS on the Big Screen: Making TV Apps
22 min
JS on the Big Screen: Making TV Apps
JavaScript is widely used in web, mobile, and backend development, and now it is also being used to create TV apps. TVs with web-based operating systems can be targeted with JavaScript applications, and React is commonly used for TV app development. React Native allows for cross-platform TV app development, except for Roku. User interactions and focus management are important considerations in TV app development. Performance optimization is crucial for TV apps, as TVs have lower device scores and limited RAM. Spatial virtualization can significantly improve TV app performance.
Web Fortified: Best Practices for Web App Security
22 min
Web Fortified: Best Practices for Web App Security
This Talk, titled 'Fortify or App Fortified', discusses the concept of treating your application as a fortress to protect it from outside threats. It highlights the importance of web application security and the risks associated with broken access control, injection, and cryptographic values. The Talk also emphasizes the need to apply best practices and use frameworks' security features. Additionally, it addresses the security concerns related to user-provided URLs, style injection, and JavaScript injections. The summary concludes by emphasizing the importance of keeping dependencies updated and following best practices to ensure project security.
Microfrontends in Safety Critical Aviation Systems
9 min
Microfrontends in Safety Critical Aviation Systems
AWS SafeKit is a market leader in airport control software, managing the entire operation of an airport. Microfrontends extend microservice architecture to the frontend, allowing components to be combined at runtime. Module federation from Webpack is a popular approach for loading remote modules. Microfrontends offer benefits such as incremental upgrades and deployment independence, but also come with downsides like poor performance and complexity. Microfrontends are recommended for large-scale enterprise applications with distinct requirements and the need for experimentation.
Internationalization (i18n) With AI-Powered Language Model
14 min
Internationalization (i18n) With AI-Powered Language Model
Today's Talk covers internationalization with the Powered Language Bundle and leveraging AI capabilities. It emphasizes the importance of planning AI roles and workflows, customizing content locally, and understanding different content types. The translation process involves linguistic analysis, accurate system instructions, and experimentation with different communication methods. The workflow includes using Express Server and Storybook for translations, connecting metadata with the user interface, and integrating AI technology responsibly for efficient and effective results.
Building a Decentralized Web With Web5
13 min
Building a Decentralized Web With Web5
Today's Talk introduces Web5, which combines the best of Web 2 and Web 3 to build a decentralized web. Web5 consists of three pillars: decentralized identifiers, verifiable credentials, and decentralized applications. Verifiable credentials are used on platforms like LinkedIn, while decentralized web nodes act as data stores for web apps. Web5 allows users to own their data, reduces friction in onboarding, and enables example applications like Universal Music Playlist and Connected Travel. Building for Web5 presents challenges such as key management and data usage, but there are resources available to learn more about the technologies.
LLRT JavaScript Runtime: Redefining Serverless Latency
20 min
LLRT JavaScript Runtime: Redefining Serverless Latency
Swift responsiveness is essential, and LLRT is a new JavaScript runtime optimized for serverless environments that offers improved performance and cost savings compared to other runtimes. LLRT achieves fast performance by removing complexities, leveraging Rust, and optimizing the AWS SDK for Lambda. It starts almost six times faster than Node.js and provides a cost saving of 2.9 times and a time saving of 3.7 times compared to Node.js.
Search Speed: Making Expedia Flights Faster
10 min
Search Speed: Making Expedia Flights Faster
The Talk discusses how the engineering team at Expedia improved the performance of customer flight search by using various metrics and techniques. These include prefetching resources during browser idle time, preemptive search to predict responses, and optimizing performance through micro queries and a micro front-end architecture. The team also focused on improving build and package size limits for better code analysis. Performance monitoring and automation were implemented for ongoing performance improvements.
Web Monetization: Your New Friendly JavaScript API
23 min
Web Monetization: Your New Friendly JavaScript API
Today's Talk explores Web Monetization, a JavaScript API that simplifies payment for web content. The challenges of monetizing web content and possible solutions are discussed, along with the drawbacks of advertisements and subscriptions. Content creators face challenges with platform restrictions and delayed payments, but web monetization offers a solution. The advantages of web monetization include instant payments, privacy-conscious transactions, and lower entry barriers for creators. The Talk concludes by encouraging involvement in the web monetization community and the development of web monetization utilities and plugins.
Web Performance: The African Case
22 min
Web Performance: The African Case
Today's Talk discussed web performance and internet penetration in Africa, highlighting the challenges of limited data plans and less powerful devices. The importance of considering internet accessibility when developing websites was emphasized, as slow-loading websites can result in negative reviews and lost customers. The concept of resumability, which delivers only necessary JavaScript for improved performance, was explored, along with the implementation of the QUIC framework to achieve this. QUIC framework was also discussed in terms of lazy execution and its ability to improve website performance and resource consumption.
Beyond the Console: Navigating JavaScript With Observability
7 min
Beyond the Console: Navigating JavaScript With Observability
Nathan Mars, tech lead at Grafana Labs, introduces observability for JavaScript applications, highlighting the effectiveness of debugging and troubleshooting with observability. Open Telemetry is presented as a standardized way to obtain system data and Grafana as a platform for monitoring metrics, logs, traces, and profiles. The talk also emphasizes the applicability of observability to the front end using GrafanaFerro to collect metrics like page load, errors, and user sessions.
Navigating a Large Scale Modernization With DDD
11 min
Navigating a Large Scale Modernization With DDD
Approximately one year ago, we started a modernization effort, but faced challenges with company politics and the reality of our tech stack. Lesson one is the importance of aligning goals and understanding current problems. Lesson two is the importance of getting everyone on board and committed to the project's success. Lesson three is repeatedly telling stakeholders why big technological changes are worth the investment.
Ethically Wired: Computer Ethics for Technologists
9 min
Ethically Wired: Computer Ethics for Technologists
Computer ethics is the set of agreed upon principles that govern the use of technology, and integrating ethical frameworks into the decision-making process reflects a commitment to fostering a compassionate technological landscape. Incorporating ethics early in the product development cycle can avoid exclusions and financial losses, and can be done through premortems and check-ins. Promoting proactive inclusivity involves validating and prioritizing goals, conducting user testing, and following the Association for Computing Machinery's Code of Ethics. Additional resources include books on computer ethics and the Design Justice Network.
Infinite Patterns in the Digital Canvas: Unleashing Creativity With JavaScript in Algorithmic Art
24 min
Infinite Patterns in the Digital Canvas: Unleashing Creativity With JavaScript in Algorithmic Art
Algorithmic art is a unique form of artistic expression where programming plays a fundamental role in creating unpredictable and complex works. P5.js is a JavaScript library that enables artists, designers, educators, and beginners to create graphic and interactive web experiences. P5.js offers various features and possibilities, such as fractals, iterate systems, and creating art with randomness. It also allows for user interactivity and provides a resource called Open Processing for inspiration and examples. The library offers a wide range of examples for exploration and learning, providing endless possibilities for creating complex and unique pieces of art.
OWASP Top Ten Security Vulnerabilities in Node.js
97 min
OWASP Top Ten Security Vulnerabilities in Node.js
Workshop
Marco Ippolito
Marco Ippolito
In this workshop, we'll cover the top 10 most common vulnerabilities and critical security risks identified by OWASP, which is a trusted authority in Web Application Security.During the workshop, you will learn how to prevent these vulnerabilities and develop the ability to recognize them in web applications.The workshop includes 10 code challenges that represent each of the OWASP's most common vulnerabilities. There will be given hints to help solve the vulnerabilities and pass the tests.The trainer will also provide detailed explanations, slides, and real-life examples in Node.js to help understand the problems better. Additionally, you'll gain insights from a Node.js Maintainer who will share how they manage security within a large project.It's suitable for Node.js Developers of all skill levels, from beginners to experts, it requires a general knowledge of web application and JavaScript.
Table of contents:- Broken Access Control- Cryptographic Failures- Injection- Insecure Design- Security Misconfiguration- Vulnerable and Outdated Components- Identification and Authentication Failures- Software and Data Integrity Failures- Security Logging and Monitoring Failures- Server-Side Request Forgery
Master JavaScript Patterns
145 min
Master JavaScript Patterns
Workshop
Adrian Hajdin
Adrian Hajdin
During this workshop, participants will review the essential JavaScript patterns that every developer should know. Through hands-on exercises, real-world examples, and interactive discussions, attendees will deepen their understanding of best practices for organizing code, solving common challenges, and designing scalable architectures. By the end of the workshop, participants will gain newfound confidence in their ability to write high-quality JavaScript code that stands the test of time.
Points Covered:
1. Introduction to JavaScript Patterns2. Foundational Patterns3. Object Creation Patterns4. Behavioral Patterns5. Architectural Patterns6. Hands-On Exercises and Case Studies
How It Will Help Developers:
- Gain a deep understanding of JavaScript patterns and their applications in real-world scenarios- Learn best practices for organizing code, solving common challenges, and designing scalable architectures- Enhance problem-solving skills and code readability- Improve collaboration and communication within development teams- Accelerate career growth and opportunities for advancement in the software industry
Frictionless Development With Unified Type System
113 min
Frictionless Development With Unified Type System
Workshop
Ejiro Asiuwhu
Ejiro Asiuwhu
Imagine developing where frontend and backend sing in harmony, types dance in perfect sync, and errors become a distant memory. That's the magic of TypeScript Nirvana!
Join me on a journey to unveil the secrets of unified type definitions, the key to unlocking frictionless development. We'll dive into:
- Shared language, shared love: Define types once, share them everywhere. Consistency becomes your BFF, errors your worst nightmare (one you'll rarely see).- Effortless coding: Ditch the manual grind of type checking. TypeScript's got your back, freeing you to focus on building awesomeness.- Maintainability magic: With crystal-clear types guiding your code, maintaining it becomes a walk in the park. More time innovating, less time debugging.- Security fortress: TypeScript's type system shields your app from common vulnerabilities, making it a fortress against security threats.
Let AI Be Your Docs
69 min
Let AI Be Your Docs
Workshop
Jesse Hall
Jesse Hall
Join our dynamic workshop to craft an AI-powered documentation portal. Learn to integrate OpenAI's ChatGPT with Next.js 14, Tailwind CSS, and cutting-edge tech to deliver instant code solutions and summaries. This hands-on session will equip you with the knowledge to revolutionize how users interact with documentation, turning tedious searches into efficient, intelligent discovery.
Key Takeaways:
- Practical experience in creating an AI-driven documentation site.- Understanding the integration of AI into user experiences.- Hands-on skills with the latest web development technologies.- Strategies for deploying and maintaining intelligent documentation resources.
Table of contents:- Introduction to AI in Documentation- Setting Up the Environment- Building the Documentation Structure- Integrating ChatGPT for Interactive Docs
Explore what's new in the 2024 editions of JSNation and React Summit!
0 min
Explore what's new in the 2024 editions of JSNation and React Summit!
Article
JSNation and React Summit are the key JavaScript and React conferences of the year, expecting over 3K attendees, featuring 110+ speakers, and offering 15+ Free and PRO workshops altogether. All this excitement will be in Amsterdam and online in June! As always, you can expect deep and interactive talks, Q&A sessions, a food truck festival, activities to explore Amsterdam, and a ferry ride to the venue. And what's fresh this year?More Connections:
Making connections is the main focus of JSNation and React Summit  in 2024! Arriving solo? Fear not! During the conference days, you'll have plenty of opportunities to network and get to know others. If you're with friends, that's also awesome – you'll have many things to enjoy together!• Remember the Treasure Hunt? Or those puzzle-collecting competitions with fellow attendees? If you've been to one of GitNation conferences in-person, you definitely should. It's all about scouring the venue for treasure and getting prizes. This year, we've crafted something simpler to participate in, yet as much fun!• There are more gaming areas where you can relax during the breaks.• Compete in arcade machines to see who is better at football or kart racing.• Join in the buddy matchmaking activity to connect with like-minded attendees for engaging conversations.More Excitement:
Fun is something we all need, especially considering how focused we are during the workdays. So adding a bit more excitement to the conference can't be overlooked!• Start your day with a smartphone orchestra performance! The details are under wraps until you arrive – just be there on time.• We're not letting the biggest JavaScript and React party end too soon – come join us for an after-afterparty at a special place, where the fun keeps rolling! And guess what? The party doesn't stop there – you'll also receive a list of cool bars to explore and keep the networking alive until the morning!• What is more, this year we're inviting you to join the C3 Dev Festival party. Get ready to dive into performances from over 18 DJs, live coders, and famous artists!More Gastronomic Delights:
We understand that good food matters, so there will be something tasty for everyone!• Rest assured, we'll have healthy, vegan, and gluten-free options available.• Are you a burger lover? No worries, we've doubled up on last year's most popular food truck with burgers.• Hungry for more? We'll hook you up with a list of good restaurants to check out before or after the conference.More Ease and Relaxation:
We're working hard to ensure your conference experience goes smoothly! So you can focus on networking, learning, and having fun without any distractions!• Take part in uninterrupted discussion rooms located in quiet zones, speed through registration with faster lines at the pre-party and badge pick-up, and easily find your way around the conference with better signage.• Stay focused with soundproofing improvements and stay connected with discounted e-SIMs with data and charging stations at the working area.• Plus, enjoy breaks every 4 talks on remote days to stay refreshed and engaged.With an array of enhancements inspired by your valuable feedback, JSNation and React Summit 2024 promise an experience like never before. Have more ideas stirring in your mind? After each conference, we send out a link to gather feedback. If you could spare a moment to share your thoughts, we'd really appreciate it! Your input is valuable to us. We're committed to continually improving for you. Can’t wait to see you at the conference!