Firebase Performance Monitoring is a service that helps you to gain insight into the performance characteristics of your Apple, Android, and web apps.
As a prerequisite, ensure that AngularFire
has been added to your project via
ng add @angular/fire
Provide a Performance instance in the application's app.config.ts
:
import { provideFirebaseApp, initializeApp } from '@angular/fire/app';
import { providePerformance, getPerformance } from '@angular/fire/performance';
export const appConfig: ApplicationConfig = {
providers: [
provideFirebaseApp(() => initializeApp({ ... })),
providePerformance(() => getPerformance()),
...
],
...
})
Next inject Performance
into your component:
import { Component, inject} from '@angular/core';
import { Performance } from '@angular/fire/performance';
@Component({ ... })
export class PerformanceComponent {
private performance = inject(Performance);
...
}
AngularFire wraps the Firebase JS SDK to ensure proper functionality in Angular, while providing the same API.
Update the imports from import { ... } from 'firebase/performance'
to import { ... } from '@angular/fire/performance'
and follow the official documentation.