অনেক অ্যাপ্লিকেশন প্রথম পৃষ্ঠা লোডের সময় সকল ব্যবহারকারীকে একই বিষয়বস্তু পরিবেশন করে। উদাহরণস্বরূপ, একটি সংবাদ সাইট সাম্প্রতিক খবর দেখাতে পারে, অথবা একটি ই-কমার্স সাইট সর্বাধিক বিক্রিত জিনিসগুলি দেখাতে পারে।
যদি এই কন্টেন্টটি Cloud Firestore থেকে পরিবেশিত হয়, তাহলে প্রতিটি ব্যবহারকারী অ্যাপ্লিকেশনটি লোড করার সময় একই ফলাফলের জন্য একটি নতুন কোয়েরি ইস্যু করবে। যেহেতু এই ফলাফলগুলি ব্যবহারকারীদের মধ্যে ক্যাশে করা হয় না, তাই অ্যাপ্লিকেশনটি প্রয়োজনের তুলনায় ধীর এবং ব্যয়বহুল।
সমাধান: বান্ডিল
Cloud Firestore বান্ডেলগুলি আপনাকে ফায়ারবেস অ্যাডমিন SDK ব্যবহার করে ব্যাকএন্ডে সাধারণ কোয়েরি ফলাফল থেকে ডেটা বান্ডেলগুলি একত্রিত করতে এবং CDN-তে ক্যাশে করা এই প্রাক-গণিত ব্লবগুলি পরিবেশন করতে দেয়। এটি আপনার ব্যবহারকারীদের অনেক দ্রুত প্রথম লোড অভিজ্ঞতা দেয় এবং আপনার Cloud Firestore কোয়েরি খরচ কমায়।
এই নির্দেশিকায় আমরা বান্ডেল তৈরি করতে Cloud Functions এবং বান্ডেল কন্টেন্ট গতিশীলভাবে ক্যাশে এবং পরিবেশন করতে Firebase Hosting ব্যবহার করব। বান্ডেল সম্পর্কে আরও তথ্য নির্দেশিকাগুলিতে পাওয়া যাবে।
প্রথমে একটি সাধারণ পাবলিক HTTP ফাংশন তৈরি করুন যা ৫০টি সর্বশেষ "গল্প" অনুসন্ধান করবে এবং ফলাফলটিকে একটি বান্ডেল হিসেবে পরিবেশন করবে।
নোড.জেএস
exports.createBundle = functions.https.onRequest(async (request, response) => { // Query the 50 latest stories const latestStories = await db.collection('stories') .orderBy('timestamp', 'desc') .limit(50) .get(); // Build the bundle from the query results const bundleBuffer = db.bundle('latest-stories') .add('latest-stories-query', latestStories) .build(); // Cache the response for up to 5 minutes; // see https://firebase.google.com/docs/hosting/manage-cache response.set('Cache-Control', 'public, max-age=300, s-maxage=600'); response.end(bundleBuffer); });
জাভা
package com.example; import com.google.auth.oauth2.GoogleCredentials; import com.google.cloud.firestore.Firestore; import com.google.cloud.firestore.FirestoreBundle; import com.google.cloud.firestore.Query.Direction; import com.google.cloud.firestore.QuerySnapshot; import com.google.cloud.functions.HttpFunction; import com.google.cloud.functions.HttpRequest; import com.google.cloud.functions.HttpResponse; import com.google.firebase.FirebaseApp; import com.google.firebase.FirebaseOptions; import com.google.firebase.cloud.FirestoreClient; import java.io.BufferedWriter; import java.io.IOException; public class ExampleFunction implements HttpFunction { public static FirebaseApp initializeFirebase() throws IOException { if (FirebaseApp.getApps().isEmpty()) { FirebaseOptions options = FirebaseOptions.builder() .setCredentials(GoogleCredentials.getApplicationDefault()) .setProjectId("YOUR-PROJECT-ID") .build(); FirebaseApp.initializeApp(options); } return FirebaseApp.getInstance(); } @Override public void service(HttpRequest request, HttpResponse response) throws Exception { // Get a Firestore instance FirebaseApp app = initializeFirebase(); Firestore db = FirestoreClient.getFirestore(app); // Query the 50 latest stories QuerySnapshot latestStories = db.collection("stories") .orderBy("timestamp", Direction.DESCENDING) .limit(50) .get() .get(); // Build the bundle from the query results FirestoreBundle bundle = db.bundleBuilder("latest-stores") .add("latest-stories-query", latestStories) .build(); // Cache the response for up to 5 minutes // see https://firebase.google.com/docs/hosting/manage-cache response.appendHeader("Cache-Control", "public, max-age=300, s-maxage=600"); // Write the bundle to the HTTP response BufferedWriter writer = response.getWriter(); writer.write(new String(bundle.toByteBuffer().array())); } }
এরপর firebase.json পরিবর্তন করে এই ক্লাউড ফাংশনটি পরিবেশন এবং ক্যাশে করার জন্য Firebase Hosting কনফিগার করুন। এই কনফিগারেশনের মাধ্যমে Firebase Hosting CDN ক্লাউড ফাংশন দ্বারা সেট করা ক্যাশে সেটিংস অনুসারে বান্ডেল কন্টেন্ট পরিবেশন করবে। ক্যাশের মেয়াদ শেষ হয়ে গেলে এটি ফাংশনটি আবার ট্রিগার করে কন্টেন্ট রিফ্রেশ করবে।
firebase.json
{
"hosting": {
// ...
"rewrites": [{
"source": "/createBundle",
"function": "createBundle"
}]
},
// ...
}
অবশেষে আপনার ওয়েব অ্যাপ্লিকেশনে, CDN থেকে বান্ডিল করা কন্টেন্টটি আনুন এবং এটি Firestore SDK-তে লোড করুন।
// If you are using module bundlers.
import firebase from "firebase/app";
import "firebase/firestore";
import "firebase/firestore/bundle" // This line enables bundle loading as a side effect.
async function fetchFromBundle() {
// Fetch the bundle from Firebase Hosting, if the CDN cache is hit the 'X-Cache'
// response header will be set to 'HIT'
const resp = await fetch('/createBundle');
// Load the bundle contents into the Firestore SDK
await db.loadBundle(resp.body);
// Query the results from the cache
// Note: omitting "source: cache" will query the Firestore backend.
const query = await db.namedQuery('latest-stories-query');
const storiesSnap = await query.get({ source: 'cache' });
// Use the results
// ...
}
আনুমানিক সঞ্চয়
এমন একটি সংবাদ ওয়েবসাইটের কথা বিবেচনা করুন যেখানে প্রতিদিন ১০০,০০০ ব্যবহারকারী আসে এবং প্রতিটি ব্যবহারকারী প্রাথমিক লোডে একই ৫০টি শীর্ষ খবর লোড করে। কোনও ক্যাশিং ছাড়াই, এর ফলে Cloud Firestore থেকে প্রতিদিন ৫০ x ১০০,০০০ = ৫০,০০,০০০ ডকুমেন্ট পঠিত হবে।
এখন ধরে নিন সাইটটি উপরের কৌশলটি গ্রহণ করে এবং ৫০টি ফলাফল ৫ মিনিট পর্যন্ত ক্যাশে করে। সুতরাং প্রতিটি ব্যবহারকারীর জন্য কোয়েরি ফলাফল লোড করার পরিবর্তে, ফলাফলগুলি প্রতি ঘন্টায় ঠিক ১২ বার লোড করা হয়। সাইটে যত ব্যবহারকারীই আসুক না কেন, ক্লাউড ফায়ারস্টোরে কোয়েরির সংখ্যা একই থাকে। ৫০,০০,০০০ ডকুমেন্ট রিডের পরিবর্তে, এই পৃষ্ঠাটি প্রতিদিন ১২ x ২৪ x ৫০ = ১৪,৪০০ ডকুমেন্ট রিড ব্যবহার করবে। ফায়ারবেস হোস্টিং এবং Cloud Functions জন্য সামান্য অতিরিক্ত খরচ সহজেই Cloud Firestore খরচ সাশ্রয়ের মাধ্যমে পূরণ করা যায়।
যদিও ডেভেলপাররা খরচ সাশ্রয়ের সুবিধা ভোগ করেন, তবুও ব্যবহারকারীরা সবচেয়ে বেশি লাভবান হন। Cloud Firestore পরিবর্তে ফায়ারবেস হোস্টিং সিডিএন থেকে এই ৫০টি ডকুমেন্ট লোড করলে পৃষ্ঠার কন্টেন্ট লোডের সময় ১০০-২০০ মিলিসেকেন্ড বা তার বেশি কমে যায়। গবেষণায় বারবার দেখা গেছে যে দ্রুত পৃষ্ঠা মানেই সুখী ব্যবহারকারী।