पेज रेंडरिंग में सुधार करें

बी योर्स प्रारंभिक पृष्ठ को अधिक तेजी से लोड करने की क्षमता के साथ आता है।

इस पृष्ठ पर

यांत्रिकी

आमतौर पर, ब्राउज़र एक पृष्ठ पर लगभग सभी तत्वों को प्रस्तुत करता है। यहां तक ​​कि जब आप शीर्ष पर होते हैं, तब भी पृष्ठ के निचले हिस्से के हिस्से शामिल होते हैं।

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

हमारे डेमो में, होम पेज के अनुभागों में content-visibility लागू करने से प्रारंभिक लोड पर रेंडरिंग प्रदर्शन में 5 गुना वृद्धि होती है।

पक्ष - विपक्ष

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

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

यह भी ध्यान रखना महत्वपूर्ण है कि यह तकनीक पूर्ण-संगत नहीं है। यह वर्तमान में फ़ायरफ़ॉक्स और इंटर्न एक्सप्लोरर पर समर्थित नहीं है: