व्यावहारिक AJAX: बुकमार्क के साथ क्या करना है

नोट: नीचे लेख "अजाक्स बेस्ट प्रैक्टिसेस: डोंट ब्रेक बुकमार्क" का अनुवाद है , जो समाधानों के लिए समर्पित है जो उपयोगकर्ताओं को AJAX विधियों का उपयोग करके बनाई गई साइट के पृष्ठों को सही ढंग से बुकमार्क करने की अनुमति देता है। मैंने श्रृंखला में पिछले लेख की चर्चा के आधार पर , इसे यथासंभव पूरक करने का प्रयास किया।



यह लेख एक श्रृंखला में दूसरा ( यहां पहला है ) आलोचना को समाप्त करने के लिए समर्पित है जिसे AJAX के साथ इतना संबोधित किया जा रहा है, और उन तरीकों की समीक्षा जो आपकी साइट को थोड़ा बेहतर बनाने में मदद कर सकते हैं।

समस्या का सार

पिछले लेख में, "ब्राउज़रों में बैक बटन के साथ क्या करना है," "क्षैतिज" और "ऊर्ध्वाधर" लिंक जैसी अवधारणाओं को पेश किया गया था। यदि आपने इसे नहीं पढ़ा है, तो कृपया आगे की खोज करने से पहले इसकी समीक्षा करें।



इसलिए, ऊर्ध्वाधर लिंक न केवल ब्राउज़रों में बैक बटन को अमान्य करते हैं, बल्कि बुकमार्क में इस पृष्ठ के लिंक को बचाने के लिए ब्राउज़र की क्षमता भी है। यह HTTP POST अनुरोधों को उसी तरह से बचाने की असंभावना की समस्या के समान है जैसे HTTP GET सिर्फ इसलिए कि वे पता बार में डेटा नहीं भेजते हैं ( ध्यान दें: निश्चित रूप से, मेरा मतलब है कि POST अनुरोध के परिणामों की "पूर्ण" बचत है, क्योंकि जब POST डेटा एक विशिष्ट (GET) लाइन पर भेजा जाता है, तो इनमें से अधिकांश अनुरोध संयुक्त होते हैं। इस मामले में, हम केवल परिणामी URL को बचा सकते हैं, लेकिन उस डेटा को नहीं जिसे हमने POST भेजा है। )



यह समस्या न केवल उन उपयोगकर्ताओं को प्रभावित करती है जो आपकी साइट पर फिर से आना चाहते हैं, यह साइट की आंतरिक पृष्ठों को खोज इंजन के साथ अनुक्रमित करने के लिए बड़ी जटिलता या पूर्ण अक्षमता की भी चिंता करता है ताकि खोज प्रश्नों के परिणामों में संसाधन के लिए सही लिंक जारी करना संभव हो ( नोट: यह समस्या कई साल पहले उठाई गई फ्रेम समस्या के समान है: खोज इंजन ने उल्लेखनीय रूप से साइट को अनुक्रमित किया, लेकिन उन्होंने मुख्य पृष्ठ को लिंक के रूप में वापस कर दिया, और यह हमेशा स्पष्ट नहीं था कि कैसे मुझे यकीन है कि यह समस्या अभी प्रासंगिक नहीं है, क्योंकि साइट पर लिंक स्थिर पंजीकृत हैं यदि उपयोगकर्ता को उस पर क्लिक करने पर कुछ नई जानकारी मिलती है, या यदि उन्हें माना जाता है तो उन्हें बिल्कुल भी निर्दिष्ट नहीं किया जाता है। "हैंग" गतिशील हैंडलर )।

समाधान एक: एक विशेष AJAX पुस्तकालय का उपयोग करें

पिछले लेख में, एक सिंहावलोकन दिया गया था जो आपको ब्राउज़र में इतिहास को सहेजने की अनुमति देता है, उनमें से कुछ आपको बुकमार्क के साथ काम करने की अनुमति देते हैं।



नोट: समाधान का सार: प्रत्येक AJAX कॉल के साथ, एक URL को एंकर के रूप में पृष्ठ URL में जोड़ा जाता है, जो वर्तमान पृष्ठ की कुंजी है। जब आप इसे अपने पसंदीदा में जोड़ते हैं, तो पृष्ठ को एंकर के साथ जोड़ा जाता है। फिर, पेज खोलते समय, एप्लिकेशन एंकर फ्लैग की जांच करता है और आवश्यक सामग्री को ओवरलोड करता है।

• माइक स्टेनहाउस दृष्टिकोण। डेमो संस्करण बेहद सरल है और लगभग सभी ब्राउज़रों में काम करता है। इस समाधान का डेमो संस्करण इस लिंक पर देखा जा सकता है और जब आप लिंक पर क्लिक करते हैं तो पृष्ठ URL पर क्या होता है, इसे ट्रैक करते हैं, फिर लिंक को बुकमार्क के रूप में सहेजते हैं। जब आप बुकमार्क खोलते हैं, तो सामग्री अतिभारित होती है।
• ब्रैड न्युबर्ज दृष्टिकोण। डेमो संस्करण । यह लाइब्रेरी कोड को अनावश्यक रूप से जटिल किए बिना यथासंभव क्रॉस-ब्राउज़र होने की कोशिश करती है।
• JQuery लाइब्रेरी का उपयोग कर मिकेज का दृष्टिकोण यहाँ देखा जा सकता है ।

इस मामले में छिपे हुए आइफ्रेम का उपयोग, मेरी राय में, बिल्कुल भी उचित नहीं है, क्योंकि बुकमार्क में एक ही मुख्य पृष्ठ होता है, और इफ्रेम में लोड नहीं किया गया। हाँ, और जैसा कि बर्सज़ बर्सज़ ने सही नोट किया था , कुछ iframes विज्ञापन वाले वाले के रूप में "कट" कर सकते हैं।



यह थोड़ा आगे बताया गया है कि पहला समाधान हमेशा उपयुक्त क्यों नहीं होता है।

समाधान दो: कस्टम लिंक का उपयोग करें

यद्यपि कोई आदर्श समाधान नहीं है जो उपयोगकर्ता को सभी GET मापदंडों के साथ वर्तमान पृष्ठ के लिंक के साथ प्रदान करेगा, पृष्ठ को बुकमार्क में जोड़ने की बहुत क्षमता के लिए समर्थन की गिरावट के कारण इस समस्या को आंशिक रूप से दूर किया जा सकता है। उदाहरण के लिए, यह दृष्टिकोण Google मानचित्र में उपयोग किया जाता है। यदि उपयोगकर्ता किसी पते की खोज करता है, तो पृष्ठ का URL समान रहता है ( http://maps.google.com ), हालांकि, जब आप "इस पृष्ठ से लिंक" लिंक पर क्लिक करते हैं, तो अनुरोधित URL वर्तमान स्थान को पहले से ही ध्यान में रखते हुए प्रदर्शित करने के लिए परिवर्तित हो जाता है। GET पैरामीटर (जैसे http://maps.google.com/maps?f=q&hl=en&geocode=&q=Moscow&ie=UTF8&z=17&om=1 )।



यह दृष्टिकोण आपको वास्तव में ऊर्ध्वाधर लिंक की एक क्षैतिज व्याख्या बनाने की अनुमति देता है जो वर्तमान पृष्ठ पर ले जाएगा। इस समाधान का उपयोग करते समय, कुछ पहलुओं को ध्यान में रखा जाना चाहिए:

• प्रारंभिक बुकमार्किंग - यदि कोई विशेष लिंक पर क्लिक करने से पहले उपयोगकर्ता इस पृष्ठ को बुकमार्क करता है तो यह दृष्टिकोण काम नहीं करेगा ( नोट: संभवतः इसका अर्थ है कि पृष्ठ के एंकर को बदलते समय ब्राउज़र इसे सहेज नहीं सकता है बुकमार्क में नया, यह IE के लिए सच है, यह एंकर द्वारा बुकमार्क में अंतर को ध्यान में नहीं रखता है, हालांकि, फ़ायरफ़ॉक्स 2 और ओपेरा 9 में, एक अलग एंकर वाला प्रत्येक पृष्ठ एक नए बुकमार्क के रूप में सहेजा जाता है );
• URL एन्कोडिंग - यदि वर्तमान स्थिति का वर्णन करने वाले डेटा में विशेष वर्ण होते हैं (उदाहरण के लिए, टैब, प्रतिशत, एम्परसेंड), तो उन्हें बुकमार्क के लिए एक लिंक बनाते समय एन्कोडेड किया जाना चाहिए ( URL एनकोडेड );
• निजी डेटा - यदि वर्तमान स्थिति के डेटा में कोई निजी जानकारी (उदाहरण के लिए, उपयोगकर्ता पासवर्ड) है, तो उन्हें क्वेरी स्ट्रिंग के GET पैरामीटर के रूप में शामिल नहीं किया जाना चाहिए। (हालांकि, यदि वर्तमान पृष्ठ के डेटा में निजी जानकारी है, तो, सबसे पहले, आपको ऐसे पृष्ठ को बुकमार्क में सहेजना भी संभव नहीं बनाना चाहिए।)

निकट भविष्य में मैं इन लेखों में वर्णित समस्याओं को खत्म करने के साथ-साथ कुछ अन्य पहलुओं पर एक छोटा निर्देश देना चाहता हूं। यदि आपके पास ऑनलाइन उदाहरणों के लिंक हैं, तो कृपया उन्हें साझा करें। मैं इन सभी दृष्टिकोणों की समीक्षा करने का प्रयास करूंगा। मेरी सामग्री की चर्चा में सक्रिय भाग लेने वाले सभी को बहुत-बहुत धन्यवाद। मैं बताई गई समस्या पर आपकी राय और आपके विचार की सराहना करता हूं।



वेब ऑप्टिमाइज़र: लोडिंग साइटों की गति की जाँच करना