Log in
Upcoming Tech Conferences
React Summit US 2025React Summit US 2025
EN

A JavaScript Less Future - New Browser APIs and Their Impact on the Future of React Development

Ameer Sami
Ameer Sami
S&C Electric
This talk is scheduled for Nov 21, 18:45
The recording will be published after editing. Multipass and Full ticket holders have early access.
Get Multipass
Bookmark
Rate this content

In recent years we've seen browsers deliver powerful APIs such as popover, anchor, Navigation, View Transition, interpolate-size, :has(), and many more. Each addresses a problem that was previously only solve-able with JavaScript. What does this mean for the future of React development? A future with less JavaScript for interaction logic. In this talk we'll discuss how you can leverage these new APIs and the impacts they will have on, application performance, developer experience, user experience, and the future of React app development.

This talk has been presented at React Summit US 2025, check out the latest edition of this React Conference.

FAQ

Amir Sami's talk, 'A JavaScript Less Future,' discusses new browser APIs and their impact on the future of front-end development, specifically focusing on reducing the amount of JavaScript needed.

Some of the new browser APIs mentioned include the popover API, anchor API, has API, highlight API, and relative color API.

The popover API simplifies the logic for toggling the date picker panel by removing the need for conditional rendering and document event listeners, thus reducing the complexity and amount of JavaScript code.

The anchor API allows elements to be anchored to a specific position relative to another element, reducing the complexity of positioning logic and ensuring elements are not cut off by the viewport.

The highlight API allows for styling specific text ranges within a content editable element, eliminating the need for duplicate layers and reducing the amount of JavaScript needed to handle text highlighting.

The new browser APIs enhance front-end development by reducing JavaScript code, simplifying logic, improving user experience, and providing native solutions for tasks that previously required complex JavaScript.

Amir Sami emphasizes 'a future with less JavaScript' because new browser APIs enable developers to achieve more with native browser capabilities, reducing the need for additional JavaScript code and improving performance.

14 years ago, developers faced challenges such as centering elements, modifying URLs without reloading, and styling placeholders, which were difficult due to the limitations of browser capabilities at the time.

The view transition API facilitates smooth animations between state changes in web applications, enhancing user experience without requiring complex JavaScript animations.

Interested individuals can stay in touch with Amir Sami by adding him on LinkedIn, visiting his website for blog posts, slides, and code, or emailing him with any questions.

browser api
Ameer Sami
Ameer Sami
21 Nov, 2025
Video transcription, chapters and summary will be available after the recording is published.
Available in other languages:

Check out more articles and videos

We constantly think of articles and videos that might spark Git people interest / skill us up or help building a stellar career

Install Nothing: App UIs With Native Browser APIs
JSNation 2024JSNation 2024
31 min
Install Nothing: App UIs With Native Browser APIs
Top Content
Scott Tolinski
Scott Tolinski
Co-host of Syntax.fm
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.
browser api
Pushing the Limits of Video Encoding in Browsers With WebCodecs
JSNation 2023JSNation 2023
25 min
Pushing the Limits of Video Encoding in Browsers With WebCodecs
Top Content
Watch video: Pushing the Limits of Video Encoding in Browsers With WebCodecs
Akash Hamirwasia
Akash Hamirwasia
ElevenLabs
This Talk explores the challenges and solutions in video encoding with web codecs. It discusses drawing and recording video on the web, capturing and encoding video frames, and introduces the WebCodecs API. The Talk also covers configuring the video encoder, understanding codecs and containers, and the video encoding process with muxing using ffmpeg. The speaker shares their experience in building a video editing tool on the browser and showcases Slantit, a tool for making product videos.
videojavascriptbrowser apiwebassembly
WebHID API: Control Everything via USB
JSNation 2022JSNation 2022
23 min
WebHID API: Control Everything via USB
Nikita Dubko
Nikita Dubko
Lead Frontend Developer and CSS Evangelist
Today's Talk introduces the webHID API, which allows developers to control real devices from the browser via USB. The HID interface, including keyboards, mice, and gamepads, is explored. The Talk covers device enumeration, input reports, feature reports, and output reports. The use of HID in the browser, especially in Chrome, is highlighted. Various demos showcase working with different devices, including a DualShock controller, microphone, gamepad, and Stream Deck drum pad. The Talk concludes with recommendations and resources for further exploration.
browser apiinnovation
Automate the Browser With Workers Browser Rendering API
JSNation 2024JSNation 2024
20 min
Automate the Browser With Workers Browser Rendering API
Gift Egwuenu
Gift Egwuenu
Developer Advocate at Cloudflare.
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!
toolingbrowser apicloudflare
Visualising Front-End Performance Bottlenecks
React Summit 2020React Summit 2020
34 min
Visualising Front-End Performance Bottlenecks
Richie McColl
Richie McColl
DAZN
React's web-based tools allow for independent learning. Dazzone, a sports streaming service, faces challenges with low memory and CPU targets. Measuring, analyzing, and fixing performance issues is crucial. Virtualization improves rendering efficiency and performance. The application is now much faster with significantly less jank.
devtoolsperformancebrowser api
MIDI in the Browser... Let's Rock the Web!
JSNation 2022JSNation 2022
28 min
MIDI in the Browser... Let's Rock the Web!
Jean-Philippe Côté
Jean-Philippe Côté
Professor @ Collège Édouard-Montpetit
MIDI is a versatile communication protocol that extends beyond music and opens up exciting possibilities. The Web MIDI API allows remote access to synths and sound modules from web browsers, enabling various projects like music education systems and web audio-based instruments. Developers can connect and use MIDI devices easily, and the Web MIDI API provides raw MIDI messages without semantics. The WebMidi.js library simplifies working with the Web MIDI API and offers a user-friendly interface for musicians and web developers. MIDI on the web has generated significant interest, with potential for commercial growth and endless possibilities for web developers.
audiobrowser apiweb apps

Workshops on related topic

Writing Universal Modules for Deno, Node and the Browser
Node Congress 2022Node Congress 2022
57 min
Writing Universal Modules for Deno, Node and the Browser
Workshop
Luca Casonato
Luca Casonato
This workshop will walk you through writing a module in TypeScript that can be consumed users of Deno, Node and the browsers. I will explain how to set up formatting, linting and testing in Deno, and then how to publish your module to deno.land/x and npm. We’ll start out with a quick introduction to what Deno is.
typescriptbrowser apinode.jsdeno