अस्थायी समाधान के तौर पर डाइनैमिक रेंडरिंग का इस्तेमाल करना

कुछ वेबसाइटों पर, जब JavaScript को ब्राउज़र पर लागू किया जाता है, तो पेज पर अतिरिक्त कॉन्टेंट जनरेट होता है. इसे क्लाइंट-साइड रेंडरिंग कहा जाता है. जब Google Search, JavaScript को लागू करता है, तो उसमें कुछ सीमाओं के साथ JavaScript की सुविधाएं उपलब्ध रहती हैं. साथ ही, हो सकता है कि कुछ पेजों पर समस्याएं आ जाएं, जिससे रेंडर किए गए एचटीएमएल में कॉन्टेंट न दिखे. दूसरे सर्च इंजन, JavaScript को अनदेखा करने का विकल्प चुन सकते हैं. इससे उन पर JavaScript से जनरेट किया गया कॉन्टेंट नहीं दिखेगा.

डाइनैमिक रेंडरिंग, उन वेबसाइटों के लिए एक अस्थायी समाधान है जिन पर JavaScript से जनरेट किया गया कॉन्टेंट, सर्च इंजन के लिए उपलब्ध नहीं हो. डाइनैमिक रेंडरिंग करने वाला सर्वर, ऐसे बॉट की पहचान करता है जिन्हें JavaScript से जनरेट किए गए कॉन्टेंट को लेकर समस्याएं आ सकती हैं. साथ ही, यह बॉट को सर्वर से रेंडर किया गया ऐसा वर्शन उपलब्ध कराता है जिसमें JavaScript का इस्तेमाल न किया गया हो. वहीं, कॉन्टेंट का क्लाइंट-साइड पर रेंडर किया गया वर्शन लोगों को दिखता है.

डाइनैमिक रेंडरिंग एक अस्थायी समाधान है और इसका सुझाव नहीं दिया जाता. ऐसा इसलिए, क्योंकि इससे अतिरिक्त समस्याएं बढ़ सकती हैं और इसके लिए ज़्यादा संसाधनों की ज़रूरत होती है.

ऐसी साइटें जिन्हें डाइनैमिक रेंडरिंग का इस्तेमाल करना चाहिए

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

डाइनैमिक रेंडरिंग के काम करने के तरीके को समझना

डाइनैमिक रेंडरिंग के लिए आपके वेब सर्वर को क्रॉलर का पता लगाने की ज़रूरत होती है. उदाहरण के लिए, उपयोगकर्ता एजेंट की जांच करना. क्रॉलर के अनुरोध रेंडरर को भेजे जाते हैं, जबकि उपयोगकर्ताओं के अनुरोध सामान्य तौर पर पूरे किए जाते हैं. डाइनैमिक रेंडरर, क्रॉलर को उसकी ज़रूरत के हिसाब से वर्शन दिखाता है. उदाहरण के लिए, यह कॉन्टेंट का स्टैटिक एचटीएमएल वर्शन दिखा सकता है. सभी पेजों के लिए या हर पेज के हिसाब से डाइनैमिक रेंडरिंग को चालू किया जा सकता है.

डाइनैमिक रेंडरिंग के काम करने का तरीका दिखाने वाला डायग्राम. डायग्राम में सर्वर को शुरुआती एचटीएमएल और JavaScript कॉन्टेंट को सीधे ब्राउज़र पर उपलब्ध कराते हुए दिखाया गया है. वहीं, इस डायग्राम में सर्वर शुरुआती एचटीएमएल और JavaScript कॉन्टेंट को रेंडरर के लिए उपलब्ध करा रहा है. यह रेंडरर, शुरुआती एचटीएमएल और JavaScript को स्टैटिक एचटीएमएल में बदलता है. कॉन्टेंट में बदलाव होने के बाद रेंडरर, क्रॉलर को स्टैटिक एचटीएमएल उपलब्ध कराता है.

डाइनैमिक रेंडरिंग, क्लोकिंग नहीं है

आम तौर पर, Googlebot डाइनैमिक रेंडरिंग को क्लोकिंग नहीं मानता. जब तक डाइनैमिक रेंडरिंग मिलता-जुलता कॉन्टेंट बनाती है, तब तक Googlebot डाइनैमिक रेंडरिंग को क्लोकिंग के तौर पर नहीं देखता.

डाइनैमिक रेंडरिंग सेट अप करने पर, आपकी साइट गड़बड़ी वाले पेज दिखा सकती है. Googlebot गड़बड़ी वाले इन पेजों को क्लोकिंग के तौर पर नहीं देखता, बल्कि गड़बड़ी वाले दूसरे पेजों की तरह ही इन पर कार्रवाई करता है.

उपयोगकर्ताओं और क्रॉलर को अलग-अलग कॉन्टेंट दिखाने के लिए डाइनैमिक रेंडरिंग का इस्तेमाल करना क्लोकिंग माना जा सकता है. उदाहरण के लिए, एक वेबसाइट जो उपयोगकर्ताओं को बिल्लियों के बारे में एक पेज दिखाती है और क्रॉलर को कुत्तों के बारे में एक पेज दिखाती है, तो उसे क्लोकिंग माना जा सकता है.

डाइनैमिक रेंडरिंग को लागू करना

अपने कॉन्टेंट के लिए डाइनैमिक रेंडरिंग सेटअप करने के लिए, हमारे सामान्य दिशा-निर्देशों का पालन करें. आपको अपनी खास कॉन्फ़िगरेशन की जानकारी देखनी होगी. अलग-अलग कॉन्फ़िगरेशन के हिसाब से डाइनैमिक रेंडरिंग लागू करने के तरीकों में काफ़ी अंतर होता है.

  1. डाइनैमिक रेंडरर को इंस्टॉल और कॉन्फ़िगर करें (उदाहरण के लिए, Puppeteer, Rendertron, या prerender.io), ताकि आपके कॉन्टेंट को स्टैटिक एचटीएमएल में बदला जा सके. कॉन्टेंट का यह वर्शन, क्रॉलर के इस्तेमाल के लिए आसान होता है.
  2. अपने हिसाब से ऐसे उपयोगकर्ता एजेंट चुनें जिन्हें कॉन्टेंट का स्टैटिक एचटीएमएल वर्शन दिखना चाहिए. साथ ही, उपयोगकर्ता एजेंट अपडेट करने या जोड़ने का तरीका जानने के लिए, अपनी कॉन्फ़िगरेशन की खास जानकारी देखें. यहां 'Rendertron मिडलवेयर' में सामान्य उपयोगकर्ता एजेंट की सूची का एक उदाहरण दिया गया है:
    export const botUserAgents = [
      'googlebot',
      'bingbot',
      'linkedinbot',
      'mediapartners-google',
    ];
  3. अगर प्री-रेंडरिंग यानी पहले रेंडर करने की सुविधा आपके सर्वर की रफ़्तार कम करती है या आपको प्री-रेंडरिंग की वजह से काफ़ी ज़्यादा अनुरोध दिखते हैं, तो आपके पास पहले से रेंडर किए गए कॉन्टेंट के लिए कैश लागू करने का विकल्प मौजूद होता है. इसके अलावा, आप चाहें, तो इस बात की पुष्टि कर लें कि अनुरोध सही क्रॉलर ने किए हैं.
  4. तय करें कि उपयोगकर्ता एजेंट को डेस्कटॉप या मोबाइल कॉन्टेंट की ज़रूरत है. कॉन्टेंट का डेस्कटॉप या मोबाइल वर्शन दिखाने के लिए, डाइनैमिक तरीके से दिखाने की सुविधा का इस्तेमाल करें. नीचे दिए गए उदाहरण में बताया गया है कि कॉन्फ़िगरेशन से यह कैसे तय हो सकता है कि उपयोगकर्ता एजेंट को डेस्कटॉप या मोबाइल कॉन्टेंट की ज़रूरत है:
    isPrerenderedUA = userAgent.matches(botUserAgents)
    isMobileUA = userAgent.matches(['mobile', 'android'])
    
    if (!isPrerenderedUA) { } else { servePreRendered(isMobileUA) }
  5. चुने गए क्रॉलर को स्टैटिक एचटीएमएल कॉन्टेंट उपलब्ध कराने के लिए अपना सर्वर कॉन्फ़िगर करें. आपके पास मौजूद टेक्नोलॉजी के हिसाब से, कई तरीकों से ऐसा किया जा सकता है. यहां कुछ उदाहरण दिए गए हैं:
    • क्रॉलर से डायनैमिक रेंडरर को मिलने वाले प्रॉक्सी अनुरोध की मदद से.
    • सर्वर को कॉन्फ़िगर करने के दौरान, प्री-रेंडरिंग करके और अपने सर्वर से क्रॉलर को स्टैटिक एचटीएमएल भेजकर.
    • अपने कस्टम सर्वर कोड में डाइनैमिक रेंडरिंग बनाकर.
    • प्री-रेंडरिंग सुविधा का इस्तेमाल करके, क्रॉलर को स्टैटिक कॉन्टेंट भेजकर.
    • अपने सर्वर के लिए मिडलवेयर का इस्तेमाल करके (जैसे, रेंडरट्रॉन मिडलवेयर).

अपने कॉन्फ़िगरेशन की पुष्टि करना

डाइनैमिक रेंडरिंग लागू करने के बाद, पक्का करें कि सब कुछ आपकी उम्मीद के मुताबिक काम कर रहा है. इसके लिए, इन टेस्ट की मदद से यूआरएल की जांच की जा सकती है:

  1. यह पक्का करें कि कॉन्टेंट का मोबाइल और डेस्कटॉप वर्शन, रेंडर किए गए पेज पर भी दिखे. इसके लिए, यूआरएल जांचने वाले टूल की मदद से कॉन्टेंट के मोबाइल और डेस्कटॉप वर्शन की जांच करें. ऐसा करना इसलिए ज़रूरी है, क्योंकि Google आपके पेज के कॉन्टेंट को उसी तरह देखता है जैसा वह रेंडर किए गए पेज पर दिखता है.

    पूरा हुआ: आपके डेस्कटॉप और मोबाइल में कॉन्टेंट वैसा ही दिख रहा है जैसा आपको उपयोगकर्ता को दिखाना है.

    फिर से कोशिश करें: अगर आपकी साइट पर ऐसा कॉन्टेंट दिख रहा है जो आपकी उम्मीद के मुताबिक नहीं है, तो 'समस्या का हल' सेक्शन देखें.

  2. स्ट्रक्चर्ड डेटा इस्तेमाल करने पर, ज़्यादा बेहतर नतीजों (रिच रिज़ल्ट) वाले टेस्ट की मदद से जांचें कि आपका स्ट्रक्चर्ड डेटा ठीक से रेंडर हो रहा है या नहीं.

    पूरा हुआ: स्ट्रक्चर्ड डेटा आपकी उम्मीद के मुताबिक दिख रहा है.

    फिर से कोशिश करें: अगर स्ट्रक्चर्ड डेटा आपकी उम्मीद के मुताबिक नहीं दिखता, तो 'समस्या का हल' सेक्शन देखें.

समस्या हल करना

अगर यूआरएल जांचने वाले टूल में आपके कॉन्टेंट में गड़बड़ियां दिख रही हैं या Google Search के नतीजों में कॉन्टेंट नहीं दिख रहा है, तो सबसे सामान्य समस्याएं हल करने की कोशिश करें. अगर आपको अब भी समस्याएं आ रही हैं, तो Google Search Central के सहायता समुदाय में नया विषय पोस्ट करें.

कॉन्टेंट पूरा नहीं है या अलग दिख रहा है

समस्या किस वजह से हुई: ऐसा हो सकता है कि आपका रेंडरर सही तरीके से कॉन्फ़िगर न हुआ हो या फिर आपका वेब ऐप्लिकेशन आपके रेंडरिंग समाधान के साथ काम न करता हो. कभी-कभी टाइम आउट होने की वजह से भी कॉन्टेंट ठीक से रेंडर नहीं हो पाता.

समस्या ठीक करें: डाइनैमिक रेंडरिंग सेट अप को डीबग करने के लिए, अपने रेंडरिंग समाधान से जुड़े दस्तावेज़ देखें.

जवाब देने में ज़्यादा समय लगना

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

समस्या को ठीक करना

  1. पहले से रेंडर किए गए एचटीएमएल के लिए कैश मेमोरी सेट अप करें या अपनी बिल्ड प्रोसेस के हिस्से के तौर पर कॉन्टेंट का स्टैटिक एचटीएमएल वर्शन बनाएं.
  2. देख लें कि आपके कॉन्फ़िगरेशन में कैश चालू हो. उदाहरण के लिए, क्रॉलर को कैश किए गए वर्शन पर भेजकर ऐसा किया जा सकता है.
  3. ज़्यादा बेहतर नतीजे (रिच रिज़ल्ट) की जांच या webpagetest जैसा टूल इस्तेमाल करके जांच लें कि क्रॉलर आपके कॉन्टेंट को जल्दी से देख पा रहा है या नहीं. इसके लिए, Google क्रॉलर उपयोगकर्ता एजेंट की लिस्ट में शामिल कस्टम उपयोगकर्ता एजेंट स्ट्रिंग की मदद लें. आपके अनुरोध समयसीमा खत्म होने से पहले पूरे हो जाने चाहिए.

वेब कॉम्पोनेंट का उम्मीद के मुताबिक रेंडर न होना

समस्या किस वजह से हुई: शैडो डीओएम पेज के बाकी हिस्से से अलग है. रेंडर करने से जुड़े बॉट (जैसे Rendertron) अलग किए गए शैडो डीओएम में कॉन्टेंट को नहीं देख सकते. ज़्यादा जानकारी के लिए, वेब कॉम्पोनेंट के लिए सबसे सही तरीके देखें.

समस्या को ठीक करना

  1. पसंद के मुताबिक बनाए गए एलिमेंट और शैडो डीओएम के लिए webcomponents.js पॉलीफ़िल लोड करें.
  2. रेंडर करने वाले सॉफ़्टवेयर के रेंडर किए गए एचटीएमएल में, आपका कॉन्टेंट दिखता है या नहीं, यह जांचने के लिए, ज़्यादा बेहतर नतीजे (रिच रिज़ल्ट) की जांच या यूआरएल जांचने वाला टूल इस्तेमाल करें.

स्ट्रक्चर्ड डेटा मौजूद नहीं है

समस्या किस वजह से हुई: स्ट्रक्चर्ड डेटा उपयोगकर्ता एजेंट के मौजूद न होने या आउटपुट में JSON-LD स्क्रिप्ट के टैग शामिल न करने की वजह से स्ट्रक्चर्ड डेटा की गड़बड़ियां हो सकती हैं.

समस्या को ठीक करना

  1. ज़्यादा बेहतर नतीजों (रिच रिज़ल्ट) वाले टेस्ट का इस्तेमाल करके, यह पक्का कर लें कि पेज पर स्ट्रक्चर्ड डेटा मौजूद है. इसके बाद, डेस्कटॉप या मोबाइल Googlebot की मदद से, पहले से रेंडर किए गए कॉन्टेंट की जांच करने के लिए, उपयोगकर्ता एजेंट को कॉन्फ़िगर करें.
  2. यह पक्का कर लें कि आपके कॉन्टेंट के डाइनैमिक तरीके से रेंडर किए गए एचटीएमएल में JSON-LD स्क्रिप्ट के टैग शामिल किए गए हैं. ज़्यादा जानकारी के लिए अपने रेंडरिंग की समस्या ठीक करने से जुड़े दस्तावेज़ देखें.