সার্ভিস ওয়ার্কার ব্যবহার করে নেটওয়ার্কের জন্য অপেক্ষা না করেই নেভিগেশন অনুরোধের উত্তর দিন।
নেভিগেশন বার থেকে নতুন URL-এ প্রবেশ করলে অথবা কোনও পৃষ্ঠার লিঙ্কে ক্লিক করে নতুন URL-এ গেলে, আপনার ব্রাউজার HTML ডকুমেন্টের জন্য যে অনুরোধ করে তাকে নেভিগেশন অনুরোধ বলা হয়। এখানেই সার্ভিস ওয়ার্কার পারফর্ম্যান্সের উপর সবচেয়ে বেশি প্রভাব ফেলে: আপনি যদি নেটওয়ার্কের জন্য অপেক্ষা না করে নেভিগেশন অনুরোধের উত্তর দেওয়ার জন্য সার্ভিস ওয়ার্কার ব্যবহার করেন, তাহলে আপনি নিশ্চিত করতে পারবেন যে নেভিগেশন নির্ভরযোগ্যভাবে দ্রুত হবে, এর পাশাপাশি নেটওয়ার্ক উপলভ্য না থাকলেও তা স্থিতিস্থাপক হবে। HTTP ক্যাশিং-এর মাধ্যমে যা সম্ভব তার তুলনায় এটি হল সার্ভিস ওয়ার্কারের মাধ্যমে পারফর্ম্যান্সের ক্ষেত্রে পাওয়া সবচেয়ে বড় সুবিধা।
নেটওয়ার্ক থেকে লোড করা রিসোর্স শনাক্ত করুন গাইড থেকে বিস্তারিতভাবে জানা যায় যে, "ওয়াটারফল" নেটওয়ার্ক ট্রাফিকের মধ্যে সম্ভাব্য অনেক অনুরোধের মধ্যে নেভিগেশন অনুরোধ হল প্রথম অনুরোধ। নেভিগেশন অনুরোধের মাধ্যমে আপনি যে HTML লোড করেন তা ছবি, স্ক্রিপ্ট এবং স্টাইলের মতো সাবরিসোর্সের জন্য অন্যান্য সমস্ত অনুরোধের ফ্লো শুরু করে।
সার্ভিস ওয়ার্কারের fetch ইভেন্ট হ্যান্ডলারের মধ্যে, FetchEvent-এ request.mode প্রপার্টি চেক করে আপনি নির্ধারণ করতে পারবেন যে কোনও অনুরোধ নেভিগেশন কিনা। এটি 'navigate'-এ সেট করা থাকলে,
তাহলে এটি একটি নেভিগেশন অনুরোধ।
সাধারণ নিয়ম হিসেবে, নেভিগেশন অনুরোধের জন্য HTML রেসপন্স ক্যাশে করতে
দীর্ঘস্থায়ী Cache-Control headers ব্যবহার করবেন না। এগুলি সাধারণত নেটওয়ার্কের মাধ্যমে পূরণ করা উচিত,
Cache-Control: no-cache-এর সাথে, যাতে নিশ্চিত করা যায় যে HTML, পরবর্তী নেটওয়ার্ক অনুরোধের
চেনের সাথে, (যুক্তিযুক্তভাবে) নতুন। ব্যবহারকারী যখনই কোনও নতুন পৃষ্ঠায় নেভিগেট করেন, তখনই নেটওয়ার্কের বিরুদ্ধে যাওয়ার অর্থ হল,
প্রতিটি নেভিগেশন হয়ত স্লো হবে। এর অর্থ হল, এটি নির্ভরযোগ্যভাবে দ্রুত হবে না।
আর্কিটেকচারের জন্য বিভিন্ন পদ্ধতি
নেটওয়ার্ক এড়িয়ে গিয়ে নেভিগেশন অনুরোধের উত্তর কীভাবে দিতে হবে তা বোঝা কঠিন হতে পারে। সঠিক পদ্ধতিটি আপনার ওয়েবসাইটের আর্কিটেকচার এবং ব্যবহারকারীরা নেভিগেট করতে পারেন এমন অনন্য URL-এর সংখ্যার উপর অনেকটা নির্ভর করে।
যদিও সব সমস্যার জন্য একটিই সমাধান নেই, তবে নিম্নলিখিত সাধারণ নির্দেশিকা আপনাকে সিদ্ধান্ত নিতে সাহায্য করবে কোন পদ্ধতিটি সবচেয়ে কার্যকর।
ছোট স্ট্যাটিক সাইট
আপনার ওয়েব অ্যাপে যদি তুলনামূলকভাবে কম সংখ্যক (যেমন: কয়েক ডজন) অনন্য URL থাকে এবং প্রতিটি URL যদি আলাদা আলাদা স্ট্যাটিক HTML ফাইলের সাথে সম্পর্কিত হয়, তাহলে একটি কার্যকর পদ্ধতি হল এইসব HTML ফাইল ক্যাশে করা এবং উপযুক্ত ক্যাশে করা HTML-এর মাধ্যমে নেভিগেশন অনুরোধের উত্তর দেওয়া।
প্রি-ক্যাশিং ব্যবহার করে, আপনি আগে থেকেই HTML ক্যাশ করতে পারবেন, সার্ভিস ওয়ার্কার ইনস্টল হওয়ার সাথে সাথেই এবং প্রতিবার আপনার সাইট আবার তৈরি করার সময় ক্যাশ করা HTML আপডেট করতে পারবেন এবং আপনার সার্ভিস ওয়ার্কার আবার ডিপ্লয় করতে পারবেন।
বিকল্প হিসেবে, আপনি যদি আপনার সব HTML প্রিক্যাশে করা এড়াতে চান—সম্ভবত কারণ ব্যবহারকারীরা আপনার সাইটের URL-এর শুধুমাত্র একটি সাবসেটে নেভিগেট করতে চান—আপনি একটি stale-while-revalidate রানটাইম ক্যাশিং কৌশল ব্যবহার করতে পারেন। তবে, এই পদ্ধতি ব্যবহার করার সময় সতর্ক থাকুন, কারণ প্রতিটি HTML ডকুমেন্ট আলাদাভাবে ক্যাশে ও আপডেট করা হয়। HTML-এর জন্য রানটাইম ক্যাশিং ব্যবহার করা সবচেয়ে উপযুক্ত যদি আপনার কাছে অল্প সংখ্যক URL থাকে যা একই সেট ব্যবহারকারী ঘন ঘন আবার দেখেন এবং আপনি যদি সেই URLগুলি একে অপরের থেকে স্বাধীনভাবে আবার যাচাই করার ব্যাপারে স্বাচ্ছন্দ্য বোধ করেন।
সিঙ্গেল-পেজ অ্যাপ
আধুনিক ওয়েব অ্যাপ্লিকেশন প্রায়শই সিঙ্গল-পেজ আর্কিটেকচার ব্যবহার করে। এতে, ক্লায়েন্ট-সাইড জাভাস্ক্রিপ্ট ব্যবহারকারীর অ্যাকশনের উত্তরে HTML পরিবর্তন করে। এই মডেল ইতিহাস API ব্যবহার করে বর্তমান URL পরিবর্তন করে, কারণ ব্যবহারকারী ওয়েব অ্যাপের সাথে ইন্টার্যাক্ট করে, যার ফলে কার্যকরভাবে "সিমুলেটেড" নেভিগেশন হয়। পরবর্তী নেভিগেশনগুলি "জাল" হতে পারে, তবে প্রাথমিক নেভিগেশনটি আসল এবং এটি নেটওয়ার্কে ব্লক করা নেই তা নিশ্চিত করা এখনও গুরুত্বপূর্ণ।
আপনি যদি সিঙ্গল-পেজ আর্কিটেকচার ব্যবহার করেন, তাহলে ক্যাশে থেকে প্রাথমিক নেভিগেশন পরিবেশন করার জন্য একটি সহজ প্যাটার্ন রয়েছে: অ্যাপ্লিকেশন শেল। এই মডেলে, আপনার সার্ভিস ওয়ার্কার নেভিগেশন অনুরোধের উত্তরে একই, একটি HTML ফাইল ফেরত দেয় যা আগে থেকেই প্রি-ক্যাশ করা আছে—অনুরোধ করা URL যাই হোক না কেন। এই HTML-এ শুধু মূল কাঠামোটিই থাকা উচিত, যার মধ্যে সম্ভবত একটি সাধারণ লোডিং ইন্ডিকেটর বা স্কেলিটন কন্টেন্ট থাকবে। ব্রাউজার ক্যাশে থেকে এই HTML লোড করার পরে, আপনার বর্তমান ক্লায়েন্ট-সাইড জাভাস্ক্রিপ্ট কাজ শুরু করে এবং আসল নেভিগেশন অনুরোধ থেকে URL-এর জন্য সঠিক HTML কন্টেন্ট রেন্ডার করে।
এই পদ্ধতি প্রয়োগ করার জন্য প্রয়োজনীয় টুল Workbox প্রদান করে; navigateFallback
option
আপনাকে নির্দিষ্ট করতে দেয় যে কোন HTML ডকুমেন্ট আপনার অ্যাপ শেল হিসেবে ব্যবহার করবেন, এর সাথে ঐচ্ছিক অনুমতি ও
অস্বীকারের তালিকা থাকে যা আপনার URL-এর সাবসেটে এই আচরণ সীমিত করে।
মাল্টি-পেজ অ্যাপ
আপনার ওয়েব সার্ভার যদি সাইটের HTML ডায়নামিকালি তৈরি করে অথবা আপনার কাছে কয়েক ডজনের বেশি অনন্য পৃষ্ঠা থাকে, তাহলে নেভিগেশন অনুরোধ ম্যানেজ করার সময় নেটওয়ার্ক এড়িয়ে যাওয়া অনেক কঠিন। অন্যান্য সব কিছু বিভাগে দেওয়া পরামর্শ আপনার ক্ষেত্রে প্রযোজ্য হতে পারে।
তবে, মাল্টি-পেজ অ্যাপের নির্দিষ্ট সাবসেটের জন্য, আপনি এমন কোনও পরিষেবা কর্মী প্রয়োগ করতে পারেন যা HTML তৈরি করার জন্য আপনার ওয়েব সার্ভারে ব্যবহৃত লজিক সম্পূর্ণভাবে রেপ্লিকেট করে। সার্ভার ও সার্ভিস ওয়ার্কার এনভায়রনমেন্টের মধ্যে রাউটিং ও টেমপ্লেটিং সংক্রান্ত তথ্য শেয়ার করতে পারলে এবং বিশেষ করে, আপনার ওয়েব সার্ভার জাভাস্ক্রিপ্ট ব্যবহার করলে (Node.js-নির্দিষ্ট ফিচার, যেমন ফাইল সিস্টেম অ্যাক্সেসের উপর নির্ভর না করে) এটি সবচেয়ে ভাল কাজ করে।
আপনার ওয়েব সার্ভার যদি সেই বিভাগে পড়ে এবং আপনি নেটওয়ার্ক থেকে HTML জেনারেশন সরিয়ে আপনার সার্ভিস ওয়ার্কারে নিয়ে যাওয়ার একটি পদ্ধতি এক্সপ্লোর করতে চান, তাহলে SPA-এর বাইরে: আপনার PWA-এর জন্য বিকল্প আর্কিটেকচার-এ দেওয়া নির্দেশিকা আপনাকে শুরু করতে সাহায্য করতে পারে।
এছাড়া সব কিছু
আপনি যদি ক্যাশে করা HTML-এর মাধ্যমে নেভিগেশন অনুরোধের উত্তর দিতে না পারেন, তাহলে আপনাকে অবশ্যই পদক্ষেপ নিতে হবে যাতে
আপনার সাইটে কোনও সার্ভিস ওয়ার্কার যোগ করলে (অন্যান্য, নন-HTML অনুরোধগুলি পরিচালনা করার জন্য) আপনার নেভিগেশন
ধীরগতির না হয়ে যায়। নেভিগেশন অনুরোধের উত্তর দেওয়ার জন্য সার্ভিস ওয়ার্কার ব্যবহার না করে সেটি চালু করলে, সামান্য লেটেন্সি (সার্ভিস ওয়ার্কারের সাহায্যে আরও দ্রুত, আরও স্থিতিস্থাপক
অ্যাপ তৈরি করা-তে যেমন ব্যাখ্যা করা হয়েছে) দেখা যাবে। আপনি নেভিগেশন
প্রিলোড নামক ফিচার চালু করে
এবং তারপরে আপনার fetch ইভেন্ট হ্যান্ডলারের মধ্যে প্রিলোড করা
নেটওয়ার্ক
রেসপন্স ব্যবহার করে
এই ওভারহেড কমাতে পারবেন।
Workbox একটি সাহায্যকারী লাইব্রেরি প্রদান করে যা নেভিগেশন প্রিলোড সমর্থিত কিনা তা ফিচার-শনাক্ত করে এবং যদি তাই হয়, তাহলে আপনার পরিষেবা কর্মীকে নেটওয়ার্ক প্রতিক্রিয়া ব্যবহার করতে বলার প্রক্রিয়াটিকে সহজ করে।