Supported environments for the Firebase JavaScript SDK

Supported environments

The Firebase JavaScript SDK is officially supported in the following environments.

Browsers

Firebase product Edge Firefox Chrome iOS Safari Safari
App Check
Analytics
Authentication
Cloud Firestore
(except
persistence)

(except
persistence
if iOS < 10)
Cloud Functions
Firebase installations
Cloud Messaging
(Edge 17+, except mobile)
Cloud Storage
Performance Monitoring
Realtime Database
Remote Config

Other environments

Firebase product React Native Node.js Chrome
Extensions
Cordova
App Check
(using a custom provider to do native device attestation)

(using a custom provider)
Analytics
Authentication
(see Note)

(see Note)

(see Note)

(see Note)
Cloud Firestore
(except
persistence)

(except
persistence)
Cloud Functions
Firebase installations
Cloud Messaging
Cloud Storage
(except
uploads)
Performance Monitoring
Realtime Database
Remote Config

Polyfills

The Firebase JavaScript SDK is built on the latest standards of the web platform. Some older browsers and JavaScript environments do not support all the features required by Firebase. If you must support these browsers/environments, then you need to load polyfills accordingly.

The sections below identify most of the polyfills you might need.

Required polyfills

Environments Polyfills
Safari 7 & 8 & 9 ES Stable
Node < 6.5 ES Stable

Optional polyfills

Environments Polyfills Firebase products
  • Node
  • Safari < 10.1
  • iOS < 10.3
fetch
  • Cloud Functions
  • Performance Monitoring
  • React Native and Expo
base-64
  • Cloud Storage

Suggested polyfills

Polyfills License
ES Stable MIT
fetch MIT
base-64 MIT

Required Polyfill Setup for React Native and Expo

For React Native and Expo if you are uploading a base-64 encoded string, you need to do the following:

Install base-64 from npm:

npm install base-64

Import decode from base-64 and attach it to the global scope as atob so Cloud Storage can access it.

import { decode } from 'base-64';

if(typeof atob === 'undefined') {
  global.atob = decode;
}

Add polyfills in your application

Option 1: (Recommended) Use bundler integrated with Babel

If you're using a bundler, integrate with Babel and @babel/preset-env to get polyfills.

Use Babel's interactive setup guide to learn how to integrate Babel with your bundler.

With Babel, you don't need to worry about the exact polyfills to include. Instead, you specify the minimal browser environments that you need to support. Babel then adds the necessary polyfills for you. Babel ensures that your requirements for browser support are always met, even if Firebase or your own code starts using new ES features.

@babel/preset-env has detailed information about the available configuration options for specifying environment targets (option targets) and adding polyfills (option useBuiltIns).

Option 2: (Not Recommended) Add polyfills manually

You can add polyfills manually using your favorite polyfill libraries (for example, core-js).

import 'core-js/stable'
import 'cross-fetch/polyfill';

core-js also provides an all-in-one polyfill file that you can directly include in the HTML page.

This option can be a convenient way for managing polyfills if you don't use Babel. However, we don't recommend this all-in-one option for production apps as it will likely include unnecessary polyfills, which increases the page weight and hence the page load time.