2012-04-17 13 views
11

मैं अनंत स्क्रॉलिंग के साथ एक वेबसाइट बना रहा हूँ। यही है, क्योंकि उपयोगकर्ता पृष्ठ के निचले भाग तक स्क्रॉल करता है, सामग्री का एक नया ब्लॉक नीचे में जोड़ा जाता है। यह फेसबुक के समान ही है। यहाँ भरी हुई 3 पृष्ठ का एक उदाहरण है:जब कोई उपयोगकर्ता पृष्ठ छोड़ देता है तो मैं AJAX सामग्री का अनंत ढेर कैसे सहेज सकता हूं?

_________ 
|   | 
| 0 | 
|_________| 
|   | 
| 1 | 
|_________| 
|   | 
| 2 | 
|_________| 

उपयोगकर्ता अंतिम पृष्ठ पर कुछ क्लिक करता है, मैं उन्हें एक अलग विवरण पृष्ठ पर ले। लेकिन यदि उपयोगकर्ता खोज परिणाम पृष्ठ पर वापस क्लिक करता है, तो मेरे पास उनके पिछले स्थान की कोई स्मृति नहीं है और उसे पृष्ठ 0 को फिर से लोड करना होगा।

_________ 
|   | 
| 0 | 
|_________| 

मैं कुछ पुराने स्कूल तरीकों इस हल करने के लिए के बारे में पता है, लेकिन वे एक कुछ गंभीर समस्या है:

हैश यूआरएल

मैं यूआरएल हर बार एक नया पृष्ठ लोड होने को अपडेट कर सकते हैं। उदाहरण के लिए: www.website.com/page#2। उपयोगकर्ता वापस विवरण पृष्ठ पर चला जाता है और समय, उस URL मुझे पिछले लोड पेज बताता है, तो मैं उसके लिए इसे लोड:

_________ 
|   | 
| 2 | 
|_________| 

लेकिन इस खराब उपयोगकर्ता अनुभव है। केवल पृष्ठ 2 लोड किया गया है। पुरानी सामग्री देखने के लिए उपयोगकर्ता स्क्रॉल नहीं कर सकता है। मैं केवल पृष्ठ 0, 1, और 2 लोड नहीं कर सकता क्योंकि यह सर्वर पर अधिभारित करेगा, क्योंकि बैक बटन 50% वेब ट्रैफ़िक (जैकब नीलसन अध्ययन) के लिए खाता है।

स्थानीय संग्रह

कुकीज़ डेटा के कई पृष्ठों को स्टोर करने के लिए भंडारण क्षमता नहीं है। Local Storage में पर्याप्त जगह होनी चाहिए। एक विचार है कि सभी लोड किए गए पृष्ठों को स्थानीय संग्रहण में स्टोर करना है। जब उपयोगकर्ता खोज परिणामों पर वापस जाता है, तो मैं सर्वर को मारने के बजाय स्थानीय संग्रहण से लोड करता हूं। इस दृष्टिकोण के साथ समस्या यह है कि मेरे उपयोगकर्ताओं का एक बड़ा हिस्सा उन ब्राउज़रों पर है जो support local storage (आईई 7) नहीं हैं।

+0

एक बार में उनसे अनुरोध करते समय सर्वर को ओवरलोड करने वाले सभी पृष्ठों को लोड क्यों नहीं किया जाएगा? – Tejs

+2

... स्मृति की एक अनंत राशि के साथ। – Phrogz

+1

@Tejs: मैंने अपना विचार गलत तरीके से कहा। मेरा मतलब है कि उपयोगकर्ता के लिए एक बार में सौ पृष्ठ लोड करना धीमा है और सर्वर पर अनावश्यक बोझ डालता है। – JoJo

उत्तर

1

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

1

उपयोगकर्ता को एक अलग विवरण पृष्ठ पर पूरी तरह से लेने के बजाय, मुख्य स्क्रॉलिंग सामग्री को न छुपाएं, अजाक्स/XMLHttpRequest() के माध्यम से विस्तार सामग्री लोड करें और फिर उस सामग्री को दृश्यमान बनाएं? दूसरे शब्दों में, जैसे फेसबुक यह करता है। मुझे लगता है कि आप यह कर सकते हैं कि सामग्री क्या है और क्या यह कुछ है जिसे आप डिज़ाइन और नियंत्रित कर रहे हैं, या यदि यह कुछ बाहरी है।

+1

आप यूआरएल को भी बदल सकते हैं और 'history.pushState' और' window.onpopstate' का उपयोग कर बैक बटन को संभाल सकते हैं :-) –

+0

@ रॉकेट: यह बहुत दिलचस्प है और मुझे इसके बारे में कोई जानकारी नहीं थी। यह ऐसा कुछ है जो मेरी खुद की एक परियोजना है, जो पूरी तरह से एक पृष्ठ के भीतर बहुत सारी सामग्री में हेरफेर करने के लिए अजाक्स का उपयोग करता है, वास्तव में इसका लाभ उठाएगा। साझा करने के लिए बहुत धन्यवाद। – Trevor

+0

विवरण पृष्ठ मेरे नियंत्रण से बाहर है। मुझे एक नए भौतिक पृष्ठ पर जाना होगा। – JoJo

संबंधित मुद्दे

 संबंधित मुद्दे