Firebase JS SDK'nın modüler tasarımı, uygulamanızın nasıl oluşturulduğu konusunda size çok daha fazla kontrol imkanı sunar. Bu esneklik, bağımlılıklarınızı platformunuza göre uyarlamanıza ve ihtiyacınız olmayan özellikleri kaldırarak paket boyutunuzu optimize etmenize olanak tanır.
Auth kitaplığını başlatmanın iki yolu vardır: getAuth() işlevi ve initializeAuth() işlevi. Birincisi olan getAuth(), uygulamanızın Auth kitaplığının sunduğu tüm özelliklerden yararlanması için gereken her şeyi sağlar. Bunun dezavantajı, uygulamanız tarafından kullanılmayan çok sayıda kodu çekmesidir. Ayrıca, hedeflediğiniz platformda desteklenmeyen kodları da çekebilir ve bu da hatalara yol açar. Bu sorunları önlemek için bağımlılık haritası alan initializeAuth() işlevini kullanabilirsiniz. getAuth() işlevi, belirtilen tüm bağımlılıklarla birlikte initializeAuth() işlevini çağırır.
Örnek olarak, tarayıcı ortamlarında getAuth()'ya eşdeğer olanı aşağıda verilmiştir:
import {initializeAuth, browserLocalPersistence, browserPopupRedirectResolver, browserSessionPersistence, indexedDBLocalPersistence} from "firebase/auth";
import {initializeApp} from "firebase/app";
const app = initializeApp({/** Your app config */});
const auth = initializeAuth(app, {
persistence: [indexedDBLocalPersistence, browserLocalPersistence, browserSessionPersistence],
popupRedirectResolver: browserPopupRedirectResolver,
});
Bağımlılıklarınızı özelleştirme
Tüm uygulamalar signInWithPopup veya signInWithRedirect işlev ailesini kullanmaz. Birçok uygulamanın indexedDB'nın sunduğu esnekliğe veya indexedDB kullanılamadığında localStorage'ı destekleme özelliğine ihtiyacı yoktur. Bu durumlarda, varsayılan getAuth(), paket boyutlarını gereksiz yere artıran çok sayıda kullanılmayan kod içerir. Bunun yerine, bu uygulamalar bağımlılıklarını uyarlayabilir. Örneğin, uygulamanızda yalnızca e-posta bağlantısı kimlik doğrulaması kullanılıyorsa ve localStorage yeterliyse (çünkü web veya hizmet çalışanı komut dosyaları kullanmıyorsunuzdur) Auth'u aşağıdaki gibi başlatarak çok fazla kod şişkinliğini kaldırabilirsiniz:
import {initializeAuth, browserLocalPersistence} from "firebase/auth";
import {initializeApp} from "firebase/app";
const app = initializeApp({/** Your app config */});
const auth = initializeAuth(app, {
persistence: browserLocalPersistence,
// No popupRedirectResolver defined
});
Bu kodla, uygulamanızın ihtiyaç duymadığı üç büyük bağımlılığı kaldırdınız. Böylece, kullanıcılarınız sitenizi her ziyaret ettiğinde kullandıkları bant genişliği miktarı önemli ölçüde azaltıldı.
Platforma özgü dikkat edilmesi gereken noktalar
Çoğu durumda, başlatma sırasında hataları önlemek için kimlik doğrulama bağımlılıklarını manuel olarak tanımlamanız gerekir. getAuth() işlevi belirli bir platformu varsayar. Varsayılan giriş noktası için bu bir tarayıcı ortamı, Cordova giriş noktası için ise bir Cordova ortamıdır. Ancak bazen belirli uygulamanızın ihtiyaçları bu varsayımlarla çakışır. Örneğin, web ve service worker komut dosyaları için varsayılan getAuth() uygulaması, window nesnesinden okuyan kodu çeker ve bu durum hatalara neden olur. Bu gibi durumlarda bağımlılıklarınızı uyarlamanız gerekir. Aşağıdaki kod, Auth kitaplığını bir hizmet çalışanı bağlamında başlatmak için uygundur:
import {initializeAuth, indexedDBLocalPersistence} from "firebase/auth";
import {initializeApp} from "firebase/app";
const app = initializeApp({/** Your app config */});
const auth = initializeAuth(app, {
persistence: indexedDBLocalPersistence,
// No popupRedirectResolver defined
});
Bu kod, Auth'un indexedDB kalıcılığıyla (işçi bağlamlarında kullanılabilir) başlatılmasını sağlar ve DOM bağlamının kullanılabilir olduğunu varsayan popupRedirectResolver bağımlılığını atlar.
Belirli platformlarda bağımlılıkları manuel olarak tanımlamanızın başka nedenleri de olabilir. Yetkilendirme başlatma işleminde popupRedirectResolver alanı tanımlandığında, bazı durumlarda kitaplık başlatma işleminde ek çalışmalar yapar. Mobil tarayıcılarda kitaplık, kimlik doğrulama alanınız için önceden otomatik olarak bir iFrame açar. Bu işlem, çoğu kullanıcı için deneyimi sorunsuz hale getirmek amacıyla yapılır ancak uygulama başladığında ek kod yükleyerek performansı etkileyebilir. Bu davranış, initializeAuth() kullanılarak ve browserPopupRedirectResolver bağımlılığı, ihtiyaç duyan işlevlere manuel olarak aktarılarak önlenebilir:
import {initializeAuth, browserLocalPersistence, browserPopupRedirectResolver, indexedDBLocalPersistence, signInWithRedirect, GoogleAuthProvider} from "firebase/auth";
import {initializeApp} from "firebase/app";
const app = initializeApp({/** Your app config */});
const auth = initializeAuth(app, {
persistence: [indexedDBLocalPersistence, browserLocalPersistence],
});
// Later
signInWithRedirect(auth, new GoogleAuthProvider(), browserPopupRedirectResolver);
browserPopupRedirectResolver bağımlılıklarında initializeAuth() sağlansaydı signInWithRedirect() çağrısındaki üçüncü parametreye gerek kalmazdı. Ancak bu bağımlılığı doğrudan signInWithRedirect() çağrısına taşıyarak başlatma sırasındaki ilk performans düşüşü ortadan kaldırılır. Bağımlılığı taşımanın getirdiği dezavantajlar vardır ancak önemli olan, kitaplığı manuel olarak başlatarak bu dezavantajlar hakkında karar verebilmenizdir.
Özel başlatma ne zaman kullanılır?
Özetlemek gerekirse özel başlatma, uygulamanızın Auth SDK kullanımında çok daha fazla kontrol sahibi olmanızı sağlar. Standart getAuth() işlevi, kullanmaya başlamak için uygundur ve çoğu kullanım alanına hizmet eder. Çoğu uygulama için getAuth() yeterli olabilir. Ancak manuel bağımlılık yönetimine geçmek istemenizin (veya geçmeniz gerekmesinin) birçok nedeni vardır:
- Paket boyutu ve yükleme sürelerinin son derece önemli olduğu uygulamalarda, özel kimlik doğrulama başlatma işlemi, potansiyel olarak birçok kilobaytlık veriyi azaltabilir. Ayrıca, bağımlılıkları başlatma zamanı yerine kullanım zamanına taşıyarak ilk yükleme sürelerini de kısaltabilir.
- DOM olmayan bağlamlarda (ör. web ve hizmet çalışanları) çalışan kodlarda hataları önlemek için
initializeAuth()kullanılmalıdır.