ब्राउज़र संकेत का उपयोग करके साइट की व्यक्तिपरक गति में सुधार करना

मुझे आश्चर्य है कि इस तकनीक का उल्लेख केवल एक बार और पास करने में हैबर पर किया गया - यदि आप खोज पर विश्वास करते हैं, तो निश्चित रूप से।
मुझे लगता है कि वास्तव में सभी को इस बारे में पता है, लेकिन मैं आपको सभी को बताऊंगा।

लब्बोलुआब यह है कि ब्राउज़र आपको बता सकता है कि उपयोगकर्ता किस पृष्ठ पर अगला खुल जाएगा - और वह इसे पहले से लोड करना शुरू कर देगा।

यह मुश्किल नहीं है - बस सिर पर मेटा टैग के एक जोड़े को जोड़ें:

<link rel="prefetch" href="NEXT PAGE URI" /> <link rel="prerender" href="NEXT PAGE URI" /> 

अब सीमाओं और बारीकियों के बारे में अधिक।

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

दूसरे, केवल फ़ायरफ़ॉक्स और क्रोम वर्तमान में AFAIK कानों के साथ इस तरह के झगड़े का समर्थन करते हैं, और पहले कई वर्षों के लिए आसपास रहा है, जो दिलचस्प है। दरअसल, पहला मान रिले फ़ायरफ़ॉक्स को पहचानता है, दूसरा - क्रोम। उनके बीच एक अंतर है, और यह इस तथ्य में निहित है कि क्रोम में इसे बहुत बेहतर तरीके से लागू किया गया है, बाद में विस्तार से।

लेकिन प्रीफैच का विकल्प पहले से ही वर्तमान व्हाट्सएप संस्करण में है: www.whatwg.org/specs/web-apps/current-work/#link-type-prefetch । इसका मतलब यह नहीं है कि WHATWG ने दो विकल्पों में से सबसे खराब विकल्प को चुना - इस विशेषता के मूल्य की परिभाषा बहुत सामान्यीकृत है ("ब्राउज़र को निर्दिष्ट सामग्री को कैश करना चाहिए"), और कुछ भी विशेष ब्राउज़र को क्रोम स्तर पर या इससे बेहतर बनाने से रोकता है।

इसलिए हम आशा कर सकते हैं कि समर्थन अन्य ब्राउज़रों में दिखाई देगा, विशेष रूप से वेबकीट इंजन पर (आपको यह समझना होगा कि यह पहले से ही गेको-आधारित ब्राउज़रों में मौजूद है, लेकिन वे कहां हैं, लोकप्रिय गेको ब्राउज़र, एफएफ को छोड़कर?)

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

हम एक प्रमुख नोट पर समाप्त करेंगे - दोनों ब्राउज़रों में, डायनामिक रूप से जोड़े जाने पर ये मेटा टैग बिल्कुल सही ढंग से काम करते हैं। और कई हो सकते हैं।

अब, क्या, वास्तव में, फ़ायरफ़ॉक्स और क्रोम में प्रीरेन्डर के बीच अंतर है?
क्रोम, प्रीरेन्डर निर्देश को पूरा करता है, एक अदृश्य टैब बनाता है, और इसमें एक पेज लोड करना शुरू कर देता है, जिसमें सभी स्क्रिप्ट (जो इसे निष्पादित भी करता है), चित्र, और इसी तरह। यदि उपयोगकर्ता वास्तव में अनुमानित पते पर जाता है, तो वर्तमान टैब को इस अदृश्य के साथ बदल दिया जाता है, और यह पहले से लोड किए गए - या कम से कम लोडिंग - पेज पर दिखाई देता है।
फ़ायरफ़ॉक्स केवल निर्दिष्ट पृष्ठ के HTML को लोड करता है, सभी बाहरी संसाधन केवल संक्रमण पर लोड करना शुरू करते हैं। मुझे एमडीएन [1] पर आधिकारिक एफएक्यू में यह नहीं मिला, और यह भी नहीं पाया कि मैं मूल रूप से इसे कहां पढ़ता हूं - लेकिन 15 वें संस्करण के साथ क्षेत्र के प्रयोगों से लगता है कि यह है।

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

---

मैं इस लेख को दो केंद्रों में लिख रहा हूं - और उनमें से एक है सर्फिंगबर्ड का कॉर्पोरेट ब्लॉग।
तो अब हमने इसका उपयोग कैसे किया - यदि दिलचस्प नहीं है, तो आप इसे छोड़ सकते हैं।
साइट का उपयोग करने का मुख्य मोड सर्फिंग है, जब (बस मामले में, मैं तैयार करता हूं) उपयोगकर्ता हमारी सिफारिशों में से एक से दूसरे में जाता है। वह उन्हें एक आइफ्रेम के रूप में देखता है, जो लगभग पूरी ब्राउज़र विंडो पर है। इस प्रक्रिया में, पसंद, नापसंद, अन्य तरीकों से प्रतिक्रिया करता है - और हम मक्खी पर इसकी डिलीवरी का पुनर्निर्माण करते हैं।

इसलिए हमने अगली सिफारिश शुरू करने का अनुरोध तब शुरू किया जब उन्होंने "सर्फ" बटन पर क्लिक नहीं किया - जो वास्तव में, "अगला!" का एक प्रकार है - लेकिन अभी तैयार दस्तावेज़ के अनुसार, और पहले से ही इस पर मिलीसेकंड बचाने के लिए शुरू कर दिया। 300।
और जब से अगले पृष्ठ का पूरा url प्रतिक्रिया में लौटा है, हमने प्राप्त url के साथ मक्खी पर इन मेटा टैग्स को उत्पन्न करना शुरू कर दिया - और इससे भी अधिक बचा।

अंतिम बारीकियां बनी हुई हैं - उपयोगकर्ता सर्फिंग करते समय सेटिंग्स सेट कर सकता है - जैसे श्रेणियों, डोमेन, लिंक लेखकों को प्रतिबंधित करना - और यह महत्वपूर्ण है कि, अग्रिम में प्राप्त सिफारिशों का उपयोग करने के लिए केवल अगर सेटिंग्स नहीं बदली हैं। हालाँकि, यह अधिकांश मामलों में देखा जाता है।

क्रोम में दिखाई देने पर, यह पता चलता है कि यदि आप कुछ सेकंड के लिए वर्तमान पृष्ठ पर जाते हैं, तो अगला तुरंत खुल जाता है। प्रभाव आश्चर्यजनक है - उन्होंने बच्चों की तरह आनन्दित किया जब उन्होंने जाँच की।

---

आप यह सत्यापित कर सकते हैं कि यहाँ Chrome में IT काम करता है - chrome: // net-internals / # prerender, मैं आपको FF के बारे में नहीं बताता, दुर्भाग्य से।

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

[१] developer.mozilla.org/en-US/docs/Link_prefetching_FAQ
[२] www.chromium.org/developers/design-documents/prerender