समाचार वेबसाइटें एग फोर्ब्स / जेडनेट सहजता से एक वेबपेज को दूसरे में कैसे मर्ज करती हैं?


14

यदि आप ईजी पर जाते हैं:

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


1
Endकुंजी दबाकर रखें और आपको लोडिंग प्रक्रिया में देरी होगी।
मंकीज़ियस

5
अधिक महत्वपूर्ण सवाल यह है कि वे ऐसा क्यों करते हैं।

जवाबों:


25

संक्षिप्त उत्तर यह है कि पृष्ठ का क्लाइंट-साइड जावास्क्रिप्ट कोड यह पता लगाता है कि जब आप पृष्ठ के निचले हिस्से में "बहुत करीब" हो जाते हैं, और ऐसा होने पर अधिक डेटा के लिए सर्वर से पूछता है।

बहुत अधिक तकनीकी प्राप्त किए बिना, वे पूरे वेब पेज को फिर से लोड नहीं कर रहे हैं। उस पृष्ठ पर जावास्क्रिप्ट कोड के बजाय सर्वर से अधिक डेटा का अनुरोध किया जाता है, फिर जब वह नया डेटा प्राप्त करता है, तो वह उस डेटा को वर्तमान पृष्ठ में जोड़ता है। पृष्ठ के जिन हिस्सों को बदलने की आवश्यकता नहीं है, वे पूरी तरह से अपरिवर्तित रहते हैं।

ऐसा करने का सबसे आधुनिक तरीका HTML5 इतिहास-संशोधन सुविधाओं का उपयोग करना है , जो प्रतीत होता है कि उन साइटों का उपयोग कर रहे हैं।


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

तो URL में परिवर्तन के बारे में क्या है, कि कैसे एक पुनः लोड किए बिना मजबूर किया जाता है? क्योंकि आपके लिंक पर, यदि आप एक 'संशोधित पृष्ठ' (जैसे /second) को पुनः लोड करते हैं, तो यह त्रुटि है। यह ओपी की समाचार साइट के साथ नहीं होता है - वे URL को ठीक से बदलते हैं ताकि आप इसे साझा कर सकें।
OJFord

@OllieFord यही है कि इतिहास एपीआई सामान किस लिए है। history.pushStateऔर history.replaceStateआपको वर्तमान पृष्ठ से दूर नेविगेट किए बिना पता बार में URL को बदलने दें। URL टुकड़ा ( #something) को बदलने की पुरानी चाल का यह अधिक आधुनिक प्रतिस्थापन है , एक बड़ा फायदा यह है कि इतिहास एपीआई आपको "वास्तविक" URL को धक्का देता है जिससे सर्वर निर्माण में भाग ले सकता है, जबकि टुकड़े का पूरी तरह से समर्थन करना होगा। क्लाइंट की तरफ से।
हॉब्स

आह ठीक है। लेकिन जैसा कि मैंने कहा, डेमो टूट गया है, जो भ्रामक है।
OJFord

किसी कारण से मैं जिस इतिहास डेमो से परिचित था, वह पूरी तरह से टूट गया था जब यह प्रश्न सामने आया, तो यह लिंक पहला था जिसे मैं पा सकता था जो बिल्कुल काम करता दिखाई दिया। बेहतर लिंक का सुझाव देने के लिए स्वतंत्र महसूस करें।
Ixrec

20

यह समझने के लिए एक बड़ी कुंजी कि क्या हो रहा है: यह जावास्क्रिप्ट के माध्यम से संभव है, उपयोगकर्ता को वास्तव में पुनर्निर्देशित किए बिना एड्रेसबार में URL सेट करने के लिए। इस क्रिया को देखने के लिए, नीचे दिए गए कोड को एक समर्थित ब्राउज़र के कंसोल में पेस्ट करें। ध्यान दें कि यह आपके एड्रेस बार को बदल देता है http://programmers.stackexchange.com/yay.html

history.pushState(null,null,'/yay.html')

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


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

@KRyan यह केवल उस परिम को संशोधित करता है जो offsetएक निश्चित दूरी को परिणाम में छोड़ता है। चूंकि डिफ़ॉल्ट क्रम क्रम "सभी समय" लोकप्रिय लगता है, इसलिए परिणाम शायद कुछ स्थिर हैं, लेकिन निश्चित रूप से नहीं अगर आप क्रम को "नवीनतम" पर स्विच करते हैं और कुछ लोकप्रिय खोजते हैं।
हॉब्स
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.