🚓 🎚️ 🌥️ रियल वर्ल्ड में ब्रेटली दक्षता 🚵🏼 🏴 😮

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

बेशक, ये 100% संकुचित संसाधन जो ब्राउज़र में आते हैं, जब वे साइटों के अनुरोधों का उत्तर प्राप्त करते हैं, इसमें सभी संसाधन शामिल नहीं होते हैं। अभी भी कई संसाधन हैं जो संपीड़ित हो सकते हैं, या जिन्हें संपीड़ित किया जा सकता है। लेकिन ये संसाधन असम्बद्ध बने हुए हैं। संपीड़न के बारे में अधिक विस्तृत मीट्रिक वेब पंचांग संसाधन के संपीड़न अनुभाग में पाया जा सकता है ।

गज़िप संपीड़न विधि अविश्वसनीय रूप से कुशल है। सादे पाठ में शेक्सपियर के सभी काम 5.3 MB लगते हैं। और गज़िप-संपीड़न (संपीड़न स्तर 6) के बाद वे केवल 1.9 एमबी पर कब्जा कर लेते हैं। इसका मतलब है कि यह डेटा जिस फ़ाइल आकार में संग्रहीत है, उसमें 2.8 गुना की कमी आई है। उसी समय, संपीड़न के दौरान डेटा खो नहीं जाता है। महान!

इससे भी बेहतर, Gzip संपीड़न की डिग्री फ़ाइलों में डुप्लिकेट लाइनों की उपस्थिति से प्रभावित होती है। पाठ में जितनी अधिक पुनरावृत्ति होगी, उतनी ही अधिक प्रभावी संपीड़न होगा। यह वेब के लिए बहुत अच्छा है, क्योंकि HTML, CSS और JS में लिखे गए कोड में एक समान वाक्यविन्यास है और इसमें कई पुनरावृत्तियाँ हैं।

लेकिन, हालांकि गज़िप एक बहुत ही कुशल संपीड़न विधि है, यह काफी पुरानी भी है। यह 1992 में दिखाई दिया (जो निश्चित रूप से, इसके व्यापक प्रसार की व्याख्या करने में मदद करता है)। 21 वर्षों के बाद, 2013 में, Google ने ब्रेटली, एक नया एल्गोरिथ्म जारी किया, जो कि गज़िप विधि में सक्षम लोगों की तुलना में उच्च स्तर के संपीड़न का वादा करता है। शेक्सपियर 5.2 एमबी के आकार के समान कार्य ब्रोथली का उपयोग 1.7 एमबी (6 के संपीड़न स्तर के साथ) के आकार के लिए संकुचित होते हैं। और इसका मतलब पहले से ही फ़ाइल आकार में 3.1 गुना कमी है। यह Gzip का उपयोग करने से भी बेहतर है।

Gzip और Brotli का उपयोग करके डेटा संपीड़न के स्तर का मूल्यांकन करने के लिए एक उपकरण का उपयोग करके, आपको यह पता लगाने की संभावना है कि कुछ डेटा को संकुचित करते समय, Brotli Gzip से बहुत अधिक कुशल है। उदाहरण के लिए, जब एक अधिकतम संपीड़न स्तर (9) के साथ Gzip का उपयोग करके ब्रोक्ली का अधिकतम संपीड़न स्तर (11) के साथ संपीड़ित करने पर ReactDOM डेटा 27% छोटा होता है।

यहाँ ReactDOM को संसाधित करते समय Gzip संपीड़न के साथ ब्रेटली संपीड़न की तुलना की जाती है।

संपीड़न स्तर	आकार (बाइट्स में)	संपीड़न क्षमता (असम्पीडित डेटा की तुलना में)	Gzip पर% सुधार
1	43456	2.73	3%
2	39,898	2.97	ग्यारह%
3	39,416	3.08	पंद्रह%
4	38,488	3.08	पंद्रह%
5	36323	3.27	उन्नीस%
6	36048	3.29	बीस%
7	35,804	3.31	बीस%
8	35,709	33.2	21%
9	35,659	3.33	21%
10	33,590	3.53	25%
ग्यारह	33036	3.59	27%

जैसा कि आप देख सकते हैं, सभी संपीड़न स्तरों पर ब्रेटली गज़िप को बायपास करता है। Brotli के साथ उपलब्ध अधिकतम संपीड़न स्तर पर, यह Gzip की तुलना में 27% अधिक कुशल है।

और, व्यक्तिगत अवलोकन के आधार पर, मैं ध्यान देता हूं कि Gzip से Brotli में मेरे एक ग्राहक के संक्रमण के कारण फ़ाइल आकार में 31% की कमी आई।

नतीजतन, पिछले कुछ वर्षों में, मैं, अन्य प्रदर्शन विशेषज्ञों के साथ, ग्राहकों को Gzip से ब्रोकली में स्विच करने के लिए प्रोत्साहित कर रहा हूं।

मैं Gzip और Brotli के लिए ब्राउज़र समर्थन के बारे में कुछ शब्द कहूंगा। Gzip इतना व्यापक है कि CanIUse समर्थन सूचना के साथ एक तालिका भी प्रदर्शित नहीं करता है। यह ऐसा कहता है: "यह HTTP हेडर लगभग सभी ब्राउज़रों (IE6 +, फ़ायरफ़ॉक्स 2+, क्रोम 1+ और इसी के साथ शुरू) में समर्थित है।" और ब्रॉटलि, इस सामग्री को लिखते समय, समर्थन का एक बहुत ही सुखद स्तर प्राप्त करता है।93.17% पर। और यह बहुत, बहुत है! इस प्रकार, यदि आपकी साइट में कम से कम कुछ महत्वपूर्ण आकार हैं, तो आप विशेष रूप से अपने 6% से अधिक उपयोगकर्ताओं को असम्पीडित संसाधनों की वापसी पसंद नहीं कर सकते हैं। लेकिन ब्रतली का उपयोग करके, आप कुछ भी नहीं खो सकते हैं। ग्राहक नए एल्गोरिदम के लिए समर्थन के एक प्रगतिशील मॉडल का उपयोग करते हैं, इसलिए जो उपयोगकर्ता ब्रेटली संसाधनों को स्वीकार नहीं कर सकते हैं वे केवल Gzip के रूप में फ़ॉलबैक विकल्प का उपयोग करेंगे। हम इसके बारे में नीचे बात करेंगे।

सामान्य तौर पर, खासकर यदि आप सीडीएन का उपयोग करते हैं, तो ब्रैटली को चालू करना सेकंड का मामला है। क्लाउडफेयर के साथ कम से कम यही स्थिति है, मैं जिस सेवा का उपयोग सीएसएस विज़ार्ड साइट के लिए करता हूं। हालांकि, मेरे कई क्लाइंट, अगर हम पिछले कुछ सालों की बात करें, तो वे इतने सफल नहीं हैं। उनमें से कुछ अपने स्वयं के बुनियादी ढांचे का समर्थन करते हैं, और अभ्यास से पता चलता है कि ब्रेटली को स्थापित करना और तैनात करना इतना आसान नहीं है। कुछ सीडीएन सेवाओं का उपयोग करते हैं जो नए एल्गोरिथ्म का समर्थन करने के लिए आसानी से सुलभ क्षमताओं में भिन्न नहीं होते हैं।

उन मामलों में जब हम ब्रेटली पर स्विच नहीं कर सकते थे, तो हमारे पास हमेशा एक अनुत्तरित प्रश्न था: "क्या अगर ..."। नतीजतन, मैंने अंत में खुद को संख्याओं के साथ बांटने का फैसला किया और इस सवाल का जवाब दिया कि साइट को ब्रेटली में संक्रमण क्या देता है।

जरूरी नहीं कि तेजी से कम हो।

आमतौर पर, "कम", का अर्थ "तेज" है। एक नियम के रूप में, यदि आप फ़ाइल का आकार कम करते हैं, तो इसे सर्वर से क्लाइंट में तेज़ी से स्थानांतरित किया जाएगा। लेकिन अगर आप कोई फ़ाइल बनाते हैं, तो कहिए कि 20% छोटी है, इसका मतलब यह नहीं है कि यह 20% तेजी से आ जाएगी। यहाँ मुद्दा यह है कि फ़ाइल का आकार वेब प्रदर्शन का सिर्फ एक पहलू है। और फ़ाइल का आकार जो भी हो, ब्राउज़र को दिया गया संसाधन कई अन्य कारकों और कई सिस्टम सीमाओं के साथ जुड़ा हुआ है - नेटवर्क की देरी, पैकेट की हानि, और जैसे। दूसरे शब्दों में, फ़ाइल आकार को बचाने से पहले के डेटा को कम पैकेट भेजने में मदद मिलती है, लेकिन सर्वर और क्लाइंट के बीच डेटा ट्रांसफर नेटवर्क देरी से सीमित होता है, परिणामस्वरूप, जिस गति के साथ ग्राहक के पैकेट आते हैं वह छोटा नहीं होगा।

टीसीपी, पैकेट, राउंड-ट्रिप देरी

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

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

इस पहेली को हल करने के लिए, टीसीपी धीमी शुरुआत नामक एक तंत्र का उपयोग करता है। यह ओवरलोड विंडो प्रबंधन रणनीति का हिस्सा है। प्रत्येक नया टीसीपी कनेक्शन पैकेट के पहले अनुक्रम में केवल 10 डेटा पैकेट भेजने की क्षमता तक सीमित है (10 पैकेट - प्रारंभिक भीड़ खिड़की का आकार)। दस टीसीपी सेगमेंट लगभग 14 KB डेटा हैं। यदि ये पैकेज क्लाइंट को सफलतापूर्वक प्राप्त हो जाते हैं, तो दूसरी श्रृंखला में पहले से ही 20 पैकेज होंगे, फिर 40, 80, 160 और इतने पर होंगे। अनुक्रम में पैकेटों की घातीय वृद्धि तब तक जारी रहेगी जब तक कि निम्नलिखित में से एक घटना नहीं होती है:

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

यह सरल और सुरुचिपूर्ण रणनीति आपको सावधानी और आशावाद के कगार पर संतुलित करने की अनुमति देती है। यह वेब एप्लिकेशन द्वारा स्थापित हर नए टीसीपी कनेक्शन पर लागू होता है।

सरल शब्दों में, नए टीसीपी कनेक्शन के भीड़भाड़ खिड़की का प्रारंभिक आकार केवल लगभग 14 Kb है। या लगभग 11.8% असंपीड़ित ReactDOM डेटा। या तो Gzip का उपयोग करके 36.94% संपीड़ित डेटा, या Brotli (अधिकतम संपीड़न स्तर पर) का उपयोग करके संपीड़ित 42.38% डेटा।

और फिर हम धीमा हो जाएगा। 11.8% से 36.94% तक संक्रमण पहले से ही एक बहुत ही ध्यान देने योग्य सुधार है! लेकिन 36.94% से 42.38% तक संक्रमण - यह बहुत प्रभावशाली है। क्या हो रहा है?

डेटा सत्र संख्या	एक सत्र में स्थानांतरित किए गए डेटा की मात्रा, Kb	हस्तांतरित डेटा की संचयी राशि, Kb	वह क्रम जिसमें ReactDOM डेटा स्थानांतरित किया जाता है
1	14	14
2	28	42	Gzip (37.904 Kb), ब्रटली (33.036 Kb)
3	56	98
4	112	210	असम्पीडित विकल्प (118.656 Kb)
5	224	434

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

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

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

यह ध्यान देने योग्य है कि उपरोक्त मॉडल काफी सरल है। विचार करने के लिए कई अन्य कारक हैं। उदाहरण के लिए - क्या यह एक नया या पहले से खुला टीसीपी कनेक्शन है? क्या कनेक्शन का इस्तेमाल किसी और चीज के लिए किया जा रहा है? क्या सर्वर ट्रैफ़िक प्राथमिकताकरण तंत्र डेटा ट्रांसफर को रोकना और शुरू करना है? क्या H / 2 स्ट्रीम में बैंडविड्थ की अनन्य पहुँच है? यह खंड एक अधिक गंभीर अध्ययन है। इसे अपने स्वयं के अनुसंधान के लिए एक अच्छा प्रारंभिक बिंदु माना जाना चाहिए। लेकिन Wireshark की तरह कुछ का उपयोग करके डेटा का पूरी तरह से विश्लेषण करने पर विचार करें, और इस सामग्री को पढ़ें , जो "जादू" का पहला 14 Kb का गहरा वर्णन प्रदान करता है।

उपरोक्त केवल नए TCP कनेक्शन के लिए लागू होता है। मौजूदा कनेक्शन पर स्थानांतरित की गई फाइलें धीमी शुरुआत प्रक्रिया से नहीं गुजरेंगी। यह हमें दो महत्वपूर्ण निष्कर्षों की ओर ले जाता है:

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

	, ,	,
1	14	14
2	28	42
3	56	98
4	112	210
5	224	434
6	448	882
7	896	1778
8	1792	3570
9	3584	7154
10	7168	14322
…	…	…
20	7340032	14680050

10 वें डेटा हस्तांतरण सत्र के अंत में, एक सत्र में स्थानांतरित किए गए डेटा की मात्रा 7168 Kb है, जबकि कुल मिलाकर, 14322 Kb डेटा पहले ही स्थानांतरित हो चुके हैं। यह इंटरनेट पर साधारण काम के लिए पर्याप्त से अधिक है (जो कि गेम ऑफ थ्रोन्स को देखने के लिए नहीं है)। वास्तव में, यह आमतौर पर ऐसा होता है कि हम पूरे वेब पेज और उसके सभी संसाधनों को अपने बैंडविड्थ की सीमा तक पहुंचने के बिना लोड करते हैं। दूसरे शब्दों में, 1 Gbit / s फाइबर ऑप्टिक संचार चैनल (जो कि, 0.125 GB / s) का उपयोग करके सामान्य ब्राउज़िंग को धीमी कनेक्शन का उपयोग करने की तुलना में बहुत तेज़ नहीं लगेगा, क्योंकि इस चैनल में से अधिकांश भी नहीं इस्तेमाल किया जाएगा।

और 20 वें डेटा ट्रांसफर सत्र द्वारा, हम सैद्धांतिक रूप से पैकेट के एक क्रम में 7.34 जीबी डेटा ट्रांसफर करते हैं।

असली दुनिया के बारे में क्या?

अब तक, हम सैद्धांतिक विचारों में लगे हुए हैं। और मैंने इस सामग्री पर इस तथ्य के कारण काम करना शुरू कर दिया कि मैं उस प्रभाव के बारे में जानना चाहूंगा जो ब्रेटली की वास्तविक साइटों पर हो सकता है।

अब तक, यहां दी गई संख्याओं ने संपीड़न की कमी और Gzip के उपयोग के बीच भारी अंतर को इंगित किया है, और तथ्य यह है कि Gzip की तुलना में Brotli का उपयोग करने से लाभ काफी मामूली है। यह हमें बताता है कि Gzip के उपयोग के लिए संपीड़न की कमी से संक्रमण एक ध्यान देने योग्य सुधार देगा, जबकि Gzip से Brotli में संक्रमण संभवतः बहुत कम प्रभावशाली लग सकता है।

मैंने उदाहरण के रूप में, कई साइटों का चयन किया, जो निम्नलिखित विचारों द्वारा निर्देशित हैं:

साइट अपेक्षाकृत अच्छी तरह से जानी जानी चाहिए (यह उन साइटों का उपयोग करना बेहतर है जिनकी तुलना किसी चीज से की जा सकती है)।
साइट परीक्षण के लिए उपयुक्त होनी चाहिए। वह है - यह एक उपयुक्त आकार का होना चाहिए (इसलिए संपीड़न के लिए इसकी सामग्रियों का विश्लेषण करना अधिक दिलचस्प होगा), और साथ ही इसमें मुख्य रूप से ऐसी सामग्री नहीं होनी चाहिए जो कि Gzip / Brotli - जैसे, उदाहरण के लिए, YouTube का उपयोग करके संकुचित न हों।
संग्रह से सभी साइटें बड़े निगमों से संबंधित नहीं होनी चाहिए (यह कुछ का विश्लेषण करने के लायक है, मान लें कि "नियमित" साइटें)।

इन आवश्यकताओं को देखते हुए, मैंने नीचे सूचीबद्ध साइटों को चुना और परीक्षण शुरू किया। यहां वे साइट हैं जिन्हें मैंने चुना है:

मैं परीक्षणों को जटिल नहीं करना चाहता था, इसलिए मैं निम्नलिखित संकेतकों पर बस गया:

डेटा की राशि हस्तांतरित।
पहला विवादास्पद पेंट (FCP) समय।

निम्नलिखित स्थितियों में उनका विश्लेषण किया गया:

संपीड़न की कमी।
Gzip का उपयोग करना।
ब्रतली का उपयोग करना।

FCP मैट्रिक वास्तविक दुनिया के करीब दिखता है और किसी भी साइट के लिए इसके आवेदन के लिए सार्वभौमिक है, क्योंकि यह आपको यह मूल्यांकन करने की अनुमति देता है कि लोगों को वेबसाइटों से क्या चाहिए - अर्थात, इन साइटों की सामग्री। इसके अलावा, मैंने इस मीट्रिक को चुना क्योंकि एक बुद्धिमान व्यक्ति पॉल कैल्वानो ने कहा: "अनुभव मुझे बताता है कि ब्रेटली का उपयोग करने से एफसीआर में सुधार होता है, खासकर जब गंभीर सीएसएस / जेएस संसाधन बड़े होते हैं" ।

परिक्षण

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

इसे देखते हुए, मैंने पहले उन साइटों को डाउनलोड करने की कोशिश नहीं की, जो Gzip का उपयोग करती हैं, और फिर, ऑफ़लाइन, किसी तरह से Brotli का उपयोग करके अपनी सामग्री को संपीड़ित करती हैं। इसके बजाय, मुझे ऐसी साइटें मिलीं जो ब्रेटली का उपयोग करती हैं, और फिर संपीड़न बंद कर दिया। मैं ब्रेटली से गज़िप में गया, और फिर गज़िप से गैर-संपीड़न के लिए, यह मापने के लिए कि यह साइट पर कैसे काम करता है।

हालांकि, मैं नहीं कह सकता, लिंक्डइन सर्वर से कनेक्ट और ब्रॉटलि को डिस्कनेक्ट कर सकता हूं, मैं बस इस साइट को उस ब्राउज़र से एक्सेस कर सकता हूं जो ब्रेटली का समर्थन नहीं करता है। हालाँकि मैं क्रोम में ब्रतली समर्थन को अक्षम करने में सक्षम नहीं हूं, लेकिन मैं सर्वर से इस तथ्य को छिपाने में सक्षम हूं कि मेरा ब्राउज़र ब्रेटली का समर्थन करता है। ब्राउजर सर्वरों को बताता है कि वे अनुरोध हेडर का उपयोग करके किस संपीड़न एल्गोरिदम का समर्थन करते हैंcontent-encoding। Webpagetest का उपयोग करते हुए, मैं हेडर को स्वयं अनुकूलित कर सकता हूं। तो, सब कुछ बहुत सरल है!

WebPageTest की उन्नत विशेषताएं हमें कस्टम अनुरोध हेडर सेट करने की अनुमति देती हैं।

यहां बताया गया है कि मैं कस्टम हेडर फ़ील्ड कैसे सेट करता हूं:

संपीड़न का पूरा बंद होना accept-encoding: randomstring:।
ब्रतली को अक्षम करना, लेकिन गज़िप समर्थन accept-encoding: gzip:।
यदि इस संपीड़न विधि को साइट द्वारा समर्थित किया गया है (और बशर्ते कि वह ब्राउज़र द्वारा समर्थित है) तो ब्रॉली का उपयोग करने के लिए: फ़ील्ड खाली रहती है।

आप यह पता लगा सकते हैं कि क्या यह content-encodingसर्वर प्रतिक्रिया में हेडर की उपस्थिति (या अनुपस्थिति) की जांच के अनुसार काम करता है ।

परिणाम

जैसा कि अपेक्षित था, Gzip में संपीड़न की कमी से संक्रमण का एक महत्वपूर्ण सुधार था, लेकिन Gzip से Brotli में संक्रमण इतना प्रभावशाली नहीं दिखता है। मेरे प्रयोगों का कच्चा डेटा यहाँ पाया जा सकता है । निम्नलिखित निष्कर्ष हैं जो मुझे सबसे अधिक रुचि देते हैं:

Gzip : 73%.
FCP Gzip : 23.305%.
Brotli Gzip: 5.767%.
FCP Brotli Gzip: 3.462%.

ये सभी मध्ययुगीन मूल्य हैं। "भौतिक आकारों" की बात करें, तो मेरा मतलब केवल HTML, CSS और जावास्क्रिप्ट है।

Gzip के उपयोग के लिए धन्यवाद, फ़ाइल के आकार को उनके असम्पीडित संस्करणों की तुलना में 73% कम किया गया था। और ब्रेटली के उपयोग ने फ़ाइल के आकार को केवल अतिरिक्त 5.7% तक कम करने की अनुमति दी। अगर हम FCP के बारे में बात करते हैं, तो Gzip के लिए धन्यवाद इस सूचक में संपीड़न की कमी की तुलना में 23% सुधार हुआ है, और Brotli ने इसमें केवल 3.5% अतिरिक्त जोड़ा है।

हालांकि ऐसा लगता है कि इस तरह के परिणाम सिद्धांत को मजबूत करते हैं, इन परिणामों को बेहतर बनाने के कई तरीके हैं। पहले साइटों की एक बड़ी संख्या का परीक्षण करना है, मैं और अधिक विस्तार से दो और चर्चा करना चाहूंगा।

स्वयं के संसाधन डेटा और बाहरी स्रोतों से डेटा

अपने परीक्षणों में, मैंने ब्रेटली को हर जगह बंद कर दिया, और न केवल उन सर्वरों के लिए जो साइट डेटा संग्रहीत करते हैं। इसका मतलब है कि मैंने न केवल ब्रोथली के उपयोग से मिलने वाले लाभों को मापा, बल्कि, संभावित रूप से, ब्रेटली को उन स्रोतों से मिलने वाले लाभों का उपयोग करता है, जो इन साइटों का उपयोग करते हैं। यह केवल हमारे हितों के दायरे में आता है यदि अध्ययन के तहत साइटों के महत्वपूर्ण तरीकों में तीसरे पक्ष के संसाधनों का उपयोग किया जाता है, लेकिन यह याद रखने योग्य है।

संपीड़न का स्तर

संपीड़न की बात करें तो, हम अक्सर सर्वोत्तम संपीड़न अनुप्रयोग परिदृश्य के साथ प्राप्त परिणामों पर चर्चा करते हैं। अर्थात् - Gzip का उपयोग करते समय हम संपीड़न के 9 वें स्तर को ध्यान में रखते हैं, और जब Brotli का उपयोग करते हैं - 11 वां स्तर। हालांकि, यह संभावना नहीं है कि जांच के तहत सर्वर सबसे इष्टतम तरीके से कॉन्फ़िगर किया जाएगा। उदाहरण के लिए, अपाचे स्तर 6 gzip संपीड़न का उपयोग करता है, जबकि NGINX केवल पहले का उपयोग करता है।

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

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

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

सारांश

किसी को यह आभास हो जाता है कि, समझदारी से तर्क करने से, कोई व्यक्ति Gzip पर ब्रेटली के लाभों की तुच्छता को पहचान सकता है।

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

यदि संभव हो, तो सर्वर पर अधिकतम संपीड़न स्तर पर पूर्व-संपीड़ित स्थिर संसाधन अपलोड करें। और गतिशील संपीड़न के लिए, उच्चतम नहीं, बल्कि न्यूनतम संपीड़न स्तरों का उपयोग करें। यदि आप NGINX का उपयोग करते हैं, तो सुनिश्चित करें कि आप NGINX के लिए पहले स्तर के संपीड़न का उपयोग नहीं कर रहे हैं।

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

मुझे लगता है कि इस लेख का एक छोटा संस्करण इस तरह दिख सकता है: यदि आपको ब्रेटली को सक्षम करना चाहिए या नहीं करना चाहिए, तो आप इतना नहीं खो रहे हैं।

प्रिय पाठकों! क्या आप ब्रेटली का उपयोग करने की योजना बना रहे हैं?

रियल वर्ल्ड में ब्रेटली दक्षता