Support for Async Scripts

Learn how to load external scripts and other script variations declaratively in React 19—directly within JSX.

Modern web apps frequently include third-party JavaScript for analytics, widgets, chat tools, or external libraries. If loaded incorrectly, these scripts can block rendering and slow down page performance. That’s why browsers support attributes like async and defer to load scripts without blocking page load.

Before React 19, developers could not include <script> tags directly in JSX as in regular HTML. We had to use useEffect or manually manipulate the DOM, breaking React’s declarative model. React 19 allows you to include <script> tags declaratively in JSX, supporting attributes like async, defer, and more.

Manual script injection

Before React 19, to include a script like Google Analytics or a third-party widget, we’d have to do this inside a useEffect:

Get hands-on with 1400+ tech skills courses.