আপনি এবং আপনার ব্যবহারকারীরা এমন মোবাইল ওয়েব অ্যাপ চান যা স্পর্শে মসৃণভাবে প্রতিক্রিয়া জানায় এবং স্ক্রোল করে। তাদের বিকাশ করা সহজ হওয়া উচিত কিন্তু দুর্ভাগ্যবশত, মোবাইল ওয়েব ব্রাউজারগুলি স্ক্রোলিং করার সময় স্পর্শ ইভেন্টগুলিতে কীভাবে প্রতিক্রিয়া দেখায় তা টাচইভেন্ট স্পেসিফিকেশনে একটি বাস্তবায়নের বিশদ হিসাবে রেখে দেওয়া হয়েছে। ফলস্বরূপ, পদ্ধতিগুলিকে মোটামুটিভাবে 4টি বিভাগে বিভক্ত করা যেতে পারে। এই পরিস্থিতি স্ক্রোল মসৃণতা প্রদান এবং বিকাশকারী নিয়ন্ত্রণ বজায় রাখার মধ্যে একটি মৌলিক উত্তেজনা প্রকাশ করে।
টাচ ইভেন্ট প্রক্রিয়াকরণের চারটি ভিন্ন মডেল?
ব্রাউজারগুলির মধ্যে আচরণের পার্থক্যগুলি চারটি মডেলে বিভক্ত।
সাধারণ সিঙ্ক্রোনাস ইভেন্ট প্রক্রিয়াকরণ
টাচমুভ ইভেন্টগুলি স্ক্রোল করার সময় পাঠানো হয় এবং টাচমুভ হ্যান্ডলিং সম্পূর্ণ না হওয়া পর্যন্ত প্রতিটি স্ক্রোল আপডেট ব্লক করে। এটি বোঝা সহজ এবং সবচেয়ে শক্তিশালী হিসাবে ভাল কিন্তু স্ক্রোল কর্মক্ষমতার জন্য খারাপ কারণ এর অর্থ হল স্ক্রোল চলাকালীন প্রতিটি ফ্রেম অবশ্যই মূল থ্রেডে ব্লক করতে হবে।
ব্রাউজার: অ্যান্ড্রয়েড ব্রাউজার (অ্যান্ড্রয়েড 4.0.4, 4.3), মোবাইল সাফারি (ডিভ স্ক্রোল করার সময়)
অ্যাসিঙ্ক্রোনাস টাচমুভ প্রক্রিয়াকরণ
টাচমুভ ইভেন্টগুলি স্ক্রল করার সময় পাঠানো হয়, তবে স্ক্রলিং অ্যাসিঙ্ক্রোনাসভাবে এগিয়ে যেতে পারে (স্ক্রলিং শুরু হওয়ার পরে টাচমুভ ইভেন্ট উপেক্ষা করা হয়)। এর ফলে ইভেন্টগুলির "ডাবল হ্যান্ডলিং" হতে পারে, উদাহরণস্বরূপ, ওয়েবসাইট টাচমুভের সাথে কিছু করার পরে স্ক্রোল করা চালিয়ে যাওয়া এবং ইভেন্টে ডিফল্ট প্রতিরোধ করে , ব্রাউজারকে এটি পরিচালনা না করতে বলে।
ব্রাউজার: মোবাইল সাফারি (ডকুমেন্ট স্ক্রোল করার সময়), ফায়ারফক্স
স্ক্রল করার সময় টাচ মুভ চাপা
স্ক্রোলিং শুরু হওয়ার পরে টাচমুভ ইভেন্টগুলি পাঠানো হয় না এবং টাচএন্ড ইভেন্ট না হওয়া পর্যন্ত পুনরায় শুরু করবেন না। এই মডেলে, একটি স্থির স্পর্শ এবং একটি স্ক্রলের মধ্যে পার্থক্য বলা কঠিন।
ব্রাউজার: স্যামসাং ব্রাউজার (মাউসমুভ ইভেন্ট পাঠানো হয়েছে)
স্ক্রোল শুরুতে বাতিল স্পর্শ করুন
আপনি উভয় উপায়ে এটি করতে পারবেন না -- স্ক্রোল মসৃণতা এবং বিকাশকারী নিয়ন্ত্রণ -- এবং এই মডেলটি পয়েন্টার ইভেন্ট স্পেসিফিকেশনের শব্দার্থবিদ্যার মতো মসৃণ স্ক্রলিং এবং ইভেন্ট পরিচালনার মধ্যে ট্রেড-অফ পরিষ্কার করে। আঙুল ট্র্যাক করার প্রয়োজন হতে পারে এমন কিছু অভিজ্ঞতা, যেমন টান-টু-রিফ্রেশ, সম্ভব নয়।
ব্রাউজার: Chrome Desktop M32+, Chrome Android
কেন পরিবর্তন?
অ্যান্ড্রয়েডের জন্য ক্রোম বর্তমানে ক্রোমের পুরানো মডেল ব্যবহার করে: স্ক্রোল শুরুতে টাচ ক্যানসেল, যা স্ক্রলিং কর্মক্ষমতা বাড়ায়, কিন্তু বিকাশকারীকে বিভ্রান্তির দিকে নিয়ে যায়। বিশেষ করে, কিছু ডেভেলপার টাচ ক্যান্সেল ইভেন্ট বা কীভাবে এটি মোকাবেলা করতে হয় সে সম্পর্কে সচেতন নন এবং এর ফলে কিছু ওয়েবসাইট ভেঙে গেছে। আরও গুরুত্বপূর্ণ, UI স্ক্রোলিং প্রভাব এবং আচরণের একটি সম্পূর্ণ শ্রেণি, যেমন পুল-টু-রিফ্রেশ , হাইডে বার এবং স্ন্যাপ পয়েন্টগুলি ভালভাবে বাস্তবায়ন করা কঠিন বা অসম্ভব৷
এই প্রভাবগুলিকে সমর্থন করার জন্য বিশেষভাবে হার্ডকোডযুক্ত বৈশিষ্ট্যগুলি যোগ করার পরিবর্তে, ক্রোমের লক্ষ্য প্ল্যাটফর্মের আদিম যোগ করার উপর মনোনিবেশ করা যা বিকাশকারীদের সরাসরি এই প্রভাবগুলি প্রয়োগ করতে দেয়৷ এই দর্শনের একটি সাধারণ প্রকাশের জন্য একটি যুক্তিবাদী ওয়েব প্ল্যাটফর্ম দেখুন।
Chrome এর নতুন মডেল: The Throttled Async Touchmove মডেল
Chrome একটি নতুন আচরণ প্রবর্তন করছে যা স্ক্রোল করার সময় অন্যান্য ব্রাউজারগুলির জন্য লিখিত কোডের সাথে সামঞ্জস্য উন্নত করার জন্য ডিজাইন করা হয়েছে, সেইসাথে স্ক্রল করার সময় টাচমুভ ইভেন্ট পাওয়ার উপর নির্ভর করে এমন অন্যান্য পরিস্থিতিতে সক্ষম করে। এই বৈশিষ্ট্যটি ডিফল্টরূপে সক্রিয় থাকে এবং আপনি নিম্নলিখিত পতাকা, chrome://flags\#touch-scrolling-mode দিয়ে এটি বন্ধ করতে পারেন।
নতুন আচরণ হল:
- স্ক্রোল বাতিল করার জন্য প্রথম টাচমুভ সিঙ্ক্রোনাসভাবে পাঠানো হয়
- সক্রিয় স্ক্রোলিং সময়
- টাচমুভ ইভেন্টগুলি অ্যাসিঙ্ক্রোনাসভাবে পাঠানো হয়
- প্রতি 200ms 1 ইভেন্টে থ্রোটল করা হয় , অথবা যদি একটি CSS 15px স্লপ অঞ্চল অতিক্রম করা হয়
- Event.cancelable মিথ্যা
- অন্যথায়, টাচমুভ ইভেন্টগুলি সিঙ্ক্রোনাসভাবে সচল হয় যখন সক্রিয় স্ক্রলিং বন্ধ হয়ে যায় বা সম্ভব হয় না কারণ স্ক্রোল সীমা আঘাত করা হয়েছে
- একটি টাচএন্ড ইভেন্ট সর্বদা ঘটে যখন ব্যবহারকারী তাদের আঙুল তোলে
আপনি Android এর জন্য Chrome-এ এই ডেমোটি ব্যবহার করে দেখতে পারেন এবং পার্থক্য দেখতে chrome://flags\#touch-scrolling-mode পতাকা টগল করতে পারেন।
আপনি কি ভাবছেন আমাদের জানান
Async Touchmove মডেলটিতে ক্রস-ব্রাউজার সামঞ্জস্য উন্নত করার এবং স্পর্শ অঙ্গভঙ্গির প্রভাবগুলির একটি নতুন শ্রেণি সক্ষম করার সম্ভাবনা রয়েছে৷ আমরা ডেভেলপাররা কী ভাবছে তা শুনতে এবং আপনি এটির সাথে যে সৃজনশীল জিনিসগুলি করতে পারেন তা দেখতে আগ্রহী।