বিলম্বিত নেভিগেশন হ্রাস
একটি ব্যবহারকারী যখন এটি বন্ধ করে তখন একটি পৃষ্ঠা বা অ্যাপে জমা না দেওয়া বিশ্লেষণ বা অন্যান্য ডেটা থাকা সাধারণ। ডেটা ক্ষতি রোধ করার জন্য, কিছু সাইট XMLHttpRequest() এ একটি সিঙ্ক্রোনাস কল ব্যবহার করে পৃষ্ঠা বা অ্যাপটি যতক্ষণ না সার্ভারে পাঠানো হয় ততক্ষণ খোলা রাখতে। শুধুমাত্র ডেটা সংরক্ষণের আরও ভাল উপায়ই নয়, এই কৌশলটি কয়েক সেকেন্ড পর্যন্ত পৃষ্ঠা বন্ধ করতে বিলম্ব করে একটি খারাপ ব্যবহারকারীর অভিজ্ঞতা তৈরি করে।
এই অনুশীলন পরিবর্তন করা প্রয়োজন, এবং ব্রাউজারগুলি সাড়া দিচ্ছে। XMLHttpRequest() স্পেসিফিকেশন ইতিমধ্যেই অবচয় এবং অপসারণের জন্য নির্ধারিত হয়েছে। Chrome 80 প্রথম পদক্ষেপ নেয় বেশ কয়েকটি ইভেন্ট হ্যান্ডলারের মধ্যে সিঙ্ক্রোনাস কলগুলিকে অনুমোদন না করে, বিশেষত beforeunload , unload , pagehide , এবং visibilitychange যখন তারা বরখাস্ত করা হয়। WebKit এছাড়াও সম্প্রতি একই আচরণ পরিবর্তন বাস্তবায়ন একটি প্রতিশ্রুতি অবতরণ করেছে।
এই নিবন্ধে আমি সংক্ষেপে তাদের জন্য বিকল্পগুলি বর্ণনা করব যাদের তাদের সাইট আপডেট করার জন্য সময় প্রয়োজন এবং XMLHttpRequest() এর বিকল্পগুলির রূপরেখা।
অস্থায়ী অপ্ট-আউট
ক্রোম কেবল XMLHttpRequest() এ প্লাগ টানতে চায় না, যে কারণে কিছু অস্থায়ী অপ্ট-আউট বিকল্প উপলব্ধ রয়েছে৷ ইন্টারনেটে সাইটগুলির জন্য, একটি অরিজিন ট্রায়াল উপলব্ধ । এটির সাথে, আপনি আপনার পৃষ্ঠার শিরোনামগুলিতে একটি মূল-নির্দিষ্ট টোকেন যুক্ত করুন যা সিঙ্ক্রোনাস XMLHttpRequest() কলগুলিকে সক্ষম করে৷ এই বিকল্পটি Chrome 89 পাঠানোর কিছুক্ষণ আগে, মার্চ 2021-এর কোনো এক সময়ে শেষ হবে। এন্টারপ্রাইজ ক্রোম গ্রাহকরা AllowSyncXHRInPageDismissal নীতি পতাকাও ব্যবহার করতে পারেন, যেটি একই সময়ে শেষ হয়।
বিকল্প
আপনি যেভাবে সার্ভারে ডেটা ফেরত পাঠান না কেন, একবারে সমস্ত ডেটা পাঠানোর জন্য পৃষ্ঠা আনলোড না হওয়া পর্যন্ত অপেক্ষা করা এড়াতে ভাল। একটি খারাপ ব্যবহারকারীর অভিজ্ঞতা তৈরি করা ছাড়াও, আনলোড আধুনিক ব্রাউজারগুলিতে অবিশ্বস্ত এবং কিছু ভুল হলে ডেটা ক্ষতির ঝুঁকি থাকে। বিশেষত, আনলোড ইভেন্টগুলি প্রায়শই মোবাইল ব্রাউজারগুলিতে ফায়ার হয় না কারণ unload ইভেন্ট ফায়ারিং ছাড়াই মোবাইল অপারেটিং সিস্টেমে একটি ট্যাব বা ব্রাউজার বন্ধ করার অনেক উপায় রয়েছে৷ XMLHttpRequest() এর সাথে, ছোট পেলোড ব্যবহার করা একটি পছন্দ ছিল। এখন এটি একটি প্রয়োজনীয়তা. স্পেসিফিকেশন অনুসারে এর উভয় বিকল্পের আপলোড সীমা প্রতি প্রসঙ্গে 64 KB রয়েছে।
কিপলাইভ আনুন
ফেচ এপিআই সার্ভার ইন্টারঅ্যাকশনের সাথে মোকাবিলা করার একটি শক্তিশালী উপায় এবং বিভিন্ন প্ল্যাটফর্ম এপিআই জুড়ে ব্যবহারের জন্য একটি সামঞ্জস্যপূর্ণ ইন্টারফেস প্রদান করে। এর বিকল্পগুলির মধ্যে রয়েছে keepalive , যা নিশ্চিত করে যে একটি অনুরোধ অব্যাহত থাকে কিনা যে পৃষ্ঠাটি এটি খোলা থাকে:
window.addEventListener('unload', {
fetch('/siteAnalytics', {
method: 'POST',
body: getStatistics(),
keepalive: true
});
}
fetch() পদ্ধতিতে সার্ভারে যা পাঠানো হয়েছে তার উপর অধিক নিয়ন্ত্রণের সুবিধা রয়েছে। আমি উদাহরণে যা দেখাই না তা হল fetch() একটি প্রতিশ্রুতি প্রদান করে যা একটি Response বস্তুর সাথে সমাধান করে। যেহেতু আমি পৃষ্ঠাটি আনলোড করার পথ থেকে বেরিয়ে আসার চেষ্টা করছি, তাই আমি এটির সাথে কিছু না করা বেছে নিয়েছি।
SendBeacon()
SendBeacon() আসলে হুডের অধীনে ফেচ API ব্যবহার করে, যার কারণে এটির একই 64 KB পেলোড সীমাবদ্ধতা রয়েছে এবং কেন এটি একটি পৃষ্ঠা আনলোড করার পরে একটি অনুরোধ অব্যাহত থাকে তা নিশ্চিত করে। এর প্রাথমিক সুবিধা হল এর সরলতা। এটি আপনাকে কোডের একক লাইনের সাথে আপনার ডেটা জমা দিতে দেয়:
window.addEventListener('unload', {
navigator.sendBeacon('/siteAnalytics', getStatistics());
}
উপসংহার
ব্রাউজার জুড়ে fetch() এর বর্ধিত প্রাপ্যতার সাথে, XMLHttpRequest() আশা করা যায় যে কোনও সময়ে ওয়েব প্ল্যাটফর্ম থেকে সরানো হবে। ব্রাউজার বিক্রেতারা সম্মত হন যে এটি সরানো উচিত, তবে এটি সময় নেবে। এটির সবচেয়ে খারাপ ব্যবহারের ক্ষেত্রে একটি অবমূল্যায়ন করা একটি প্রথম পদক্ষেপ যা প্রত্যেকের জন্য ব্যবহারকারীর অভিজ্ঞতা উন্নত করে৷