Chrome 49 में स्मूद स्क्रोलिंग

अगर लोगों को स्क्रीन पर स्क्रोल करने के दौरान किसी चीज़ की ज़रूरत है, तो वह है स्मूद स्क्रोलिंग. Chrome में पहले से ही कुछ जगहों पर आसानी से स्क्रोल करने की सुविधा है. जैसे, जब उपयोगकर्ता अपने ट्रैकपैड से स्क्रोल करते हैं या मोबाइल पर पेज को फ़्लिंग करते हैं. हालांकि, अगर उपयोगकर्ता ने माउस प्लग इन किया हुआ है, तो उसे स्क्रोल करने के दौरान ज़्यादा झटके महसूस होंगे. यह स्क्रोल करने का तरीका, देखने में अच्छा नहीं लगता. Chrome 49 में यह सुविधा बदलने वाली है.

कई डेवलपर ने लाइब्रेरी का इस्तेमाल करके, इनपुट से चलने वाले नेटिव और चरणों वाले स्क्रोल व्यवहार की समस्या को हल किया है. इसका मकसद, इसे रीमैप करके, ज़्यादा बेहतर और आकर्षक बनाना है. उपयोगकर्ता, एक्सटेंशन की मदद से भी ऐसा कर सकते हैं. हालांकि, स्क्रोलिंग में बदलाव करने वाली लाइब्रेरी और एक्सटेंशन, दोनों के कुछ नुकसान हैं:

  • अनजान घाटी का एहसास. यह दो तरीकों से दिखता है: पहला, हो सकता है कि एक साइट पर स्क्रॉल करने की सुविधा आसानी से काम करे, लेकिन दूसरी साइट पर ऐसा न हो. इससे उपयोगकर्ता को साइट पर नेविगेट करने में परेशानी हो सकती है. दूसरी बात, लाइब्रेरी में मौजूद आइटम के फ़िज़िक्स, प्लैटफ़ॉर्म के फ़िज़िक्स से मेल नहीं खाते. इसलिए, हो सकता है कि मोशन स्मूद हो, लेकिन वह गलत या अजीब लगे.
  • मुख्य थ्रेड में रुकावट और रुक-रुककर चलने की समस्या बढ़ जाती है. पेज में जोड़े गए किसी भी JavaScript की तरह, सीपीयू पर ज़्यादा लोड पड़ेगा. हालांकि, यह ज़रूरी नहीं है कि पेज पर कोई समस्या हो. यह इस बात पर निर्भर करता है कि पेज पर क्या-क्या हो रहा है. अगर मुख्य थ्रेड पर कोई ऐसा काम चल रहा है जो लंबे समय तक चलेगा और स्क्रोलिंग को मुख्य थ्रेड से जोड़ा गया है, तो पेज पर स्क्रोल करने में रुकावट आ सकती है और पेज का फ़्रेम रुक-रुककर चल सकता है.
  • डेवलपर के लिए ज़्यादा रखरखाव, उपयोगकर्ताओं के लिए ज़्यादा कोड डाउनलोड करने की सुविधा. स्मूद स्क्रोलिंग के लिए लाइब्रेरी का इस्तेमाल करने पर, उसे अप-टू-डेट रखना और उसे मैनेज करना ज़रूरी होगा. साथ ही, इससे साइट के पेज का साइज़ भी बढ़ेगा.

ये समस्याएं, स्क्रोल करने के व्यवहार से जुड़ी कई लाइब्रेरी में भी होती हैं. भले ही, वे पैरलॅक्स इफ़ेक्ट या स्क्रोल के साथ काम करने वाले अन्य ऐनिमेशन हों. ये अक्सर ऐप्लिकेशन के रुकने की समस्या को ट्रिगर करते हैं. साथ ही, इनकी वजह से ऐप्लिकेशन को ऐक्सेस करने में भी समस्या आती है. आम तौर पर, इनसे उपयोगकर्ता अनुभव खराब होता है. स्क्रोलिंग, वेब का मुख्य इंटरैक्शन है. इसलिए, लाइब्रेरी की मदद से इसमें बदलाव करने से पहले, सावधानी बरतें.

Chrome 49 में, Windows, Linux, और ChromeOS पर स्क्रोल करने का डिफ़ॉल्ट तरीका बदल जाएगा. स्क्रोल करने का पुराना तरीका बंद हो रहा है. अब स्क्रोल करने पर, पेज में मौजूद कॉन्टेंट एक ही बार में दिखेगा! आपके कोड में कोई बदलाव करने की ज़रूरत नहीं है. हालांकि, अगर आपने स्मूद स्क्रोलिंग लाइब्रेरी का इस्तेमाल किया है, तो उन्हें हटा दें.

स्क्रोल करने से जुड़ी ज़्यादा सुविधाएं

स्क्रोल करने से जुड़ी कुछ और सुविधाएं भी काम में हैं, जिनके बारे में बताना ज़रूरी है. हम में से कई लोग, स्क्रोल करने पर दिखने वाले इफ़ेक्ट चाहते हैं. जैसे, पैरलॅक्स, दस्तावेज़ के किसी फ़्रैगमेंट (जैसे, example.com/#somesection) पर आसानी से स्क्रोल करना. जैसा कि मैंने पहले बताया था, आज इस्तेमाल किए जा रहे तरीकों से, डेवलपर और उपयोगकर्ता, दोनों को नुकसान पहुंच सकता है. प्लैटफ़ॉर्म के दो स्टैंडर्ड पर काम किया जा रहा है, जिनसे आपको मदद मिल सकती है: कंपोजिटर वर्कलेट और scroll-behavior सीएसएस प्रॉपर्टी.

Houdini

कंपोजिटर वर्कलेट, Houdini का हिस्सा हैं. हालांकि, इनकी पूरी जानकारी अभी तक नहीं दी गई है और इन्हें लागू नहीं किया गया है. हालांकि, पैच लागू होने के बाद, आपको कंपोजिटर की पाइपलाइन के हिस्से के तौर पर चलने वाला JavaScript लिखने की सुविधा मिलेगी. इसका मतलब है कि पैरललक्स जैसे स्क्रोल-कप्ल किए गए इफ़ेक्ट, स्क्रोल की मौजूदा स्थिति के साथ पूरी तरह सिंक रहेंगे. फ़िलहाल, स्क्रोल करने की सुविधा को मैनेज करने का तरीका ऐसा है कि स्क्रोल इवेंट सिर्फ़ समय-समय पर मुख्य थ्रेड पर भेजे जाते हैं. साथ ही, मुख्य थ्रेड में चल रहे दूसरे कामों की वजह से इन्हें ब्लॉक किया जा सकता है. ऐसे में, यह सुविधा एक बड़ी छलांग साबित होगी. अगर आपको कंपोजिटर वर्कलेट या Houdini की अन्य दिलचस्प नई सुविधाओं में दिलचस्पी है, तो Surma की Houdini पोस्ट के बारे में जानकारी और Houdini के स्पेसिफ़िकेशन देखें. साथ ही, Houdini की मेलिंग सूची में अपने विचार शेयर करें!

scroll-behavior

फ़्रैगमेंट-आधारित स्क्रोलिंग के लिए, scroll-behavior सीएसएस प्रॉपर्टी से भी मदद मिल सकती है. अगर आपको इसे आज़माना है, तो आपको यह जानकर खुशी होगी कि यह सुविधा पहले से ही Firefox में उपलब्ध है. साथ ही, “वेब प्लैटफ़ॉर्म की एक्सपेरिमेंटल सुविधाएं चालू करें” फ़्लैग का इस्तेमाल करके, इसे Chrome Canary में भी चालू किया जा सकता है. अगर आपने <body> एलिमेंट को scroll-behavior: smooth पर सेट किया है, तो फ़्रैगमेंट में हुए बदलावों या window.scrollTo की वजह से ट्रिगर होने वाले सभी स्क्रोल, आसानी से ऐनिमेट हो जाएंगे! यह किसी ऐसी लाइब्रेरी के कोड का इस्तेमाल करने और उसे मैनेज करने से काफ़ी बेहतर है जो यही काम करने की कोशिश करती है. स्क्रोल करने जैसी बुनियादी सुविधाओं के मामले में, उपयोगकर्ता की उम्मीदों को पूरा करना बहुत ज़रूरी है. इसलिए, जब तक इन सुविधाओं में बदलाव हो रहा है, तब तक बेहतर बनाने के लिए धीरे-धीरे बदलाव करने का तरीका अपनाना और उन सभी लाइब्रेरी को हटाना ज़रूरी है जो इन व्यवहारों को पॉलीफ़िल करने की कोशिश करती हैं.

आगे बढ़ें और स्क्रोल करें

Chrome 49 से, स्क्रोल करने की सुविधा ज़्यादा बेहतर हो गई है. हालांकि, यह सिर्फ़ एक उदाहरण है: Houdini और smooth-scroll जैसी सीएसएस प्रॉपर्टी की मदद से, और भी सुधार किए जा सकते हैं. Chrome 49 को आज़माएं और हमें बताएं कि आपको यह कैसा लगा. सबसे ज़्यादा, जहां भी हो सके, ब्राउज़र को स्क्रोल करने दें!