Sen başlamadan önce
Henüz yapmadıysanız, nasıl yapılacağını öğrenmek için Firebase'i JavaScript projenize ekleyin sayfasını ziyaret edin:
Bir Firebase projesi oluşturun
Web uygulamanızı Firebase'e kaydedin
Firebase'i uygulamanıza eklediğinizde, bu sayfada daha sonra açıklanan adımlardan bazılarını (örneğin, SDK'yı ekleme ve Firebase'i başlatma) tamamlayabileceğinizi unutmayın.
Adım 1 : Performans İzlemeyi ekleyin ve başlatın
Henüz yapmadıysanız, Firebase JS SDK'yı kurun ve Firebase'i başlatın .
Performance Monitoring JS SDK'yı ekleyin ve Performance Monitoring'i başlatın:
Web modüler API
import { initializeApp } from "firebase/app"; import { getPerformance } from "firebase/performance"; // TODO: Replace the following with your app's Firebase project configuration // See: https://firebase.google.com/docs/web/learn-more#config-object const firebaseConfig = { // ... }; // Initialize Firebase const app = initializeApp(firebaseConfig); // Initialize Performance Monitoring and get a reference to the service const perf = getPerformance(app);
Web ad alanlı API
import firebase from "firebase/compat/app"; import "firebase/compat/performance"; // TODO: Replace the following with your app's Firebase project configuration // See: https://firebase.google.com/docs/web/learn-more#config-object const firebaseConfig = { // ... }; // Initialize Firebase firebase.initializeApp(firebaseConfig); // Initialize Performance Monitoring and get a reference to the service const perf = firebase.performance();
Adım 2 : İlk giriş gecikmesi polyfill kitaplığını ekleyin
İlk giriş gecikmesi metriğini ölçmek için bu metrik için polyfill kitaplığını eklemeniz gerekir. Yükleme yönergeleri için kitaplığın belgelerine bakın.
Performance Monitoring'in diğer web uygulaması metriklerini raporlaması için bu polyfill kitaplığının eklenmesi gerekli değildir.
3. Adım : İlk veri gösterimi için performans olayları oluşturun
SDK'yı uygulamanıza başarıyla eklediğinizde Firebase olayları işlemeye başlar. Hâlâ yerel olarak geliştiriyorsanız, ilk veri toplama ve işlemeye yönelik etkinlikler oluşturmak için uygulamanızla etkileşime geçin.
Web uygulamanızı yerel bir ortamda sunun ve görüntüleyin.
Siteniz için alt sayfalar yükleyerek, uygulamanızla etkileşim kurarak ve/veya ağ isteklerini tetikleyerek etkinlikler oluşturun. Sayfa yüklendikten sonra tarayıcı sekmesini en az 10 saniye açık tuttuğunuzdan emin olun.
Firebase konsolunun Performans panosuna gidin. İlk veri ekranınızı birkaç dakika içinde görmelisiniz.
İlk verilerinizin bir görüntüsünü görmüyorsanız, sorun giderme ipuçlarını gözden geçirin.
4. Adım : (İsteğe bağlı) Performans etkinlikleri için günlük mesajlarını görüntüleyin
Tarayıcınızın geliştirici araçlarını açın (örneğin, Chrome Geliştirme Araçları için Ağ sekmesi veya Firefox için Ağ İzleyicisi'nde ).
Web uygulamanızı tarayıcıda yenileyin.
Herhangi bir hata mesajı için günlük mesajlarınızı kontrol edin.
Birkaç saniye sonra, tarayıcınızın geliştirici araçlarında
firebaselogging.googleapis.com
yönelik bir ağ araması arayın. Bu ağ aramasının varlığı, tarayıcının performans verilerini Firebase'e gönderdiğini gösterir.
Uygulamanız performans olaylarını günlüğe kaydetmiyorsa sorun giderme ipuçlarını inceleyin.
5. Adım : (İsteğe bağlı) Belirli kod için özel izleme ekleyin
Uygulamanızdaki belirli kodla ilişkili performans verilerini izlemek için özel kod izlemeleri kullanabilirsiniz.
Özel bir kod izlemeyle, uygulamanızın belirli bir görevi veya bir dizi görüntüyü yükleme veya veritabanınızı sorgulama gibi bir dizi görevi tamamlamasının ne kadar sürdüğünü ölçebilirsiniz. Özel bir kod izleme için varsayılan ölçüm süresidir, ancak önbellek isabetleri ve bellek uyarıları gibi özel ölçümler de ekleyebilirsiniz.
Kodunuzda, Performance Monitoring SDK tarafından sağlanan API'yi kullanarak özel bir kod izlemenin başlangıcını ve sonunu tanımlarsınız (ve istediğiniz özel ölçümleri eklersiniz).
Bu özellikler ve bunları uygulamanıza nasıl ekleyeceğiniz hakkında daha fazla bilgi edinmek için Belirli kod için izleme ekleme sayfasını ziyaret edin.
6. Adım : Uygulamanızı dağıtın ve ardından sonuçları inceleyin
Performance Monitoring'i doğruladıktan sonra, uygulamanızın güncellenmiş sürümünü kullanıcılarınıza dağıtabilirsiniz.
Performans verilerini, Firebase konsolunun Performans kontrol panelinde izleyebilirsiniz.
Sonraki adımlar
Firebase Performance Monitoring for Web Codelab ile uygulamalı deneyim kazanın.
Performance Monitoring tarafından otomatik olarak toplanan veriler hakkında daha fazla bilgi edinin:
- Uygulamanızda sayfa yükleme verileri
- Uygulamanız tarafından yayınlanan HTTP/S ağ istekleri için veriler
Performans verilerinizi Firebase konsolunda görüntüleyin, izleyin ve filtreleyin
Özel kod izleme araçları kullanarak uygulamanıza belirli görevler veya iş akışları için izleme ekleyin
Performans verilerini filtrelemek için öznitelikleri kullanın