ইতিহাস API - স্ক্রোল পুনরুদ্ধার

আপনার URL গুলি পরিচালনা করতে ইতিহাস API ব্যবহার করা দুর্দান্ত এবং এটি যেমন ঘটে, ভাল ওয়েব অ্যাপগুলির একটি গুরুত্বপূর্ণ বৈশিষ্ট্য৷ তবে এর একটি খারাপ দিক হল যে স্ক্রোল পজিশনগুলি সংরক্ষণ করা হয় এবং তারপরে, আরও গুরুত্বপূর্ণভাবে, আপনি যখনই ইতিহাস অতিক্রম করেন তখন পুনরুদ্ধার করা হয় । এর অর্থ প্রায়শই কুৎসিত লাফানো হয় কারণ স্ক্রোল অবস্থান স্বয়ংক্রিয়ভাবে পরিবর্তিত হয়, এবং বিশেষ করে যদি আপনার অ্যাপ ট্রানজিশন করে, বা পৃষ্ঠার বিষয়বস্তু যেকোন উপায়ে পরিবর্তন করে। শেষ পর্যন্ত এটি একটি ভয়ঙ্কর ব্যবহারকারীর অভিজ্ঞতার দিকে নিয়ে যায়।

বিষয়টিকে আরও খারাপ করার জন্য আপনি এটি সম্পর্কে খুব কমই করতে পারেন: scroll ইভেন্টের আগে ক্রোম একটি popState ইভেন্টকে ট্রিগার করে, যার অর্থ আপনি popState বর্তমান স্ক্রোল অবস্থানটি পড়তে পারেন এবং তারপর window.scrollTo (Ewww) দিয়ে scroll ইভেন্ট হ্যান্ডলারে এটিকে বিপরীত করতে পারেন , কিন্তু অন্তত এটা কাজ করে!) Firefox, যাইহোক, popState এর আগে scroll ইভেন্টটি ট্রিগার করে, তাই এটিকে পুনরুদ্ধার করার জন্য পুরানো স্ক্রোল মানটি কী ছিল তা আপনার কোন ধারণা নেই। বাহ!

তবে ভালো খবর হল একটি সম্ভাব্য সমাধান আছে: history.scrollRestoration । এটির দুটি স্ট্রিং মান লাগে: auto , যা আজকের মতো সবকিছু রাখে (এবং এটির ডিফল্ট মান), এবং manual , যার অর্থ আপনি বিকাশকারী হিসাবে যে কোনও স্ক্রোল পরিবর্তনের মালিকানা নেবেন যা কোনও ব্যবহারকারী যখন অ্যাপটি অতিক্রম করে তখন প্রয়োজন হতে পারে ইতিহাস আপনার যদি প্রয়োজন হয়, আপনি history.pushState() দিয়ে ইতিহাস এন্ট্রি পুশ করার সাথে সাথে আপনি স্ক্রোল অবস্থানের উপর নজর রাখতে পারেন।

বৈশিষ্ট্যটি নতুন এবং পরীক্ষামূলক (যদিও সম্পূর্ণ দুর্দান্ত), তাই এটি ব্যবহার করার আগে এটি উপলব্ধ কিনা তা নিশ্চিত করুন:

if ('scrollRestoration' in history) {
    // Back off, browser, I got this...
    history.scrollRestoration = 'manual';
}

আপনি Chrome 46 এর পর থেকে history.scrollRestoration পাবেন এবং আপনি এটির বিশেষত্ব এখানে খুঁজে পেতে পারেন।

আমাদের প্রতিক্রিয়া জানাতে ভুলবেন না, এবং অন্যান্য বিক্রেতাদেরও জানান যদি আপনি চান যে তারা scrollRestoration সমর্থন করুক।