The implicit page call at the end of the snippet (present in the previous JavaScript SDK versions) is removed in the latest SDK v3. If required, you need to make a page call explicitly, as shown:
rudderanalytics.page();
Depending on the browser, the SDK loads either the legacy or modern JavaScript SDK bundle. The legacy bundle is built for ES5 while the modern bundle (with Module Federation) is built for ES6.
You can also pass your loadOptions as a third argument in the rudderanalytics.load method. See Load JavaScript SDK for more information.
Installation workflow
The installation code snippets listed above perform the following actions:
Based on browser capabilities, load either the legacy or modern bundle.
Load the necessary polyfills for the SDK to load.
Create an array to store the events until the SDK is ready.
Store the method invocations in the below table to replay them when the SDK is ready.
While using the above snippets to integrate the JavaScript SDK with your website is recommended, you can alternatively use the NPM module for packaging RudderStack directly into your project.
To install the JavaScript SDK via NPM, run the following command:
npm install @rudderstack/analytics-js --save
Use this NPM module only for browser installation.
Since the NPM module exports the related APIs on an already-defined object combined with the Node.js module caching, run the following code snippet once and use the exported object throughout your project:
SDK imports for bundling tools that process dynamic imports
If you are using a tool to bundle your application and it is attempting to process the dynamic runtime imports of the dependencies, update your SDK imports from @rudderstack/analytics-js to @rudderstack/analytics-js/bundled to avoid any issues with dynamic imports failing to find plugin modules.
Most common toolchains like the ones based on webpack, rollup, and vite should not face any issues. If your particular setup/toolchain is affected, contact RudderStack Support.
Usage in Chrome extension
To use the JavaScript SDK within a Chrome extension, import the content-script as shown:
If you are using a single-page application (SPA) or frameworks that load the JavaScript SDK in an async manner (lazy loading), you will need an array buffer to store the events before the SDK is loaded.
You can use this sample snippet to achieve this use case.
Supported browsers
The JavaScript SDK supports the following browsers and their corresponding versions:
Browser
Supported Versions
Safari
v10 and above
IE
v11 and above
Edge
v80 and above
Mozilla Firefox
v47 and above
Chrome
v54 and above
Opera
v43 and above
For unsupported browser versions, try adding browser polyfills to your application for the SDK to work correctly.
Integration with Chromecast
RudderStack supports integrating the JavaScript SDK with Google Chromecast. You can build the web sender app by following these instructions and adding the JavaScript SDK.
This site uses cookies to improve your experience while you navigate through the website. Out of
these
cookies, the cookies that are categorized as necessary are stored on your browser as they are as
essential
for the working of basic functionalities of the website. We also use third-party cookies that
help
us
analyze and understand how you use this website. These cookies will be stored in your browser
only
with
your
consent. You also have the option to opt-out of these cookies. But opting out of some of these
cookies
may
have an effect on your browsing experience.
Necessary
Always Enabled
Necessary cookies are absolutely essential for the website to function properly. This
category only includes cookies that ensures basic functionalities and security
features of the website. These cookies do not store any personal information.
This site uses cookies to improve your experience. If you want to
learn more about cookies and why we use them, visit our cookie
policy. We'll assume you're ok with this, but you can opt-out if you wish Cookie Settings.