2012-12-19 31 views
7

समय यहाँ दिखाया गया है (आईई के F12 डेवलपर उपकरण का उपयोग कर कब्जा कर लिया) दर्शाता है कि आईई एक पेज जहां एक <img> टैग text के एक झुंड की के बाद स्थित है संभालता है:एचटीपी अनुरोध - आईएमजी बनाम टेक्स्ट?

enter image description here

दूसरी पंक्ति से पता चलता छवि का पुनर्प्राप्ति। चूंकि छवि छोटी है, इसलिए सभी छवि डेटा को उसी पैकेट में HTTP प्रतिक्रिया शीर्षलेखों के साथ शामिल किया गया है।

हालांकि: -

हालांकि अगले समय क्या जब <img> टैग के पास फ़ाइल की शुरुआत स्थित है होता है इतना है कि यह आईई द्वारा प्राप्त डेटा की पहली पैकेट में है पता चलता , HTML के पहले पैकेट आने के तुरंत बाद छवि के लिए अनुरोध शुरू होता है।

नतीजतन, यह है कि पृष्ठ के निचले भाग पर पेज और छवि

लेकिन (IMHO) यह छवियों डाल करने के लिए बेहतर है (परिभाषित आयामों के साथ) को पुनः प्राप्त करने कम कुल समय लेता है। (ताकि पृष्ठ तेज़ी से लोड हो जाए)

हालांकि - मेरे उदाहरण से यह दिखाता है कि आईएमजी शीर्ष पर होने पर पृष्ठ तेज़ी से लोड हो रहा है।

मुझे क्या याद आ रही है?

पीएस मेरे सवाल का एक संक्षिप्त संक्षेप पाठ of this section

+1

"* ... लेकिन सर्वोत्तम प्रथा हमेशा उस पृष्ठ के नीचे छवियों (परिभाषित आयामों के साथ) डालती है ... *," कौन? संदर्भ की आवश्यकता – Alexander

+0

@Alexander (आईएमएचओ जोड़ा गया), लेकिन आयाम वहां होना चाहिए (100%)। फिर भी, समग्र समय क्यों बदल रहा है? कृपया दिए गए लिंक Ive देखें। –

+0

ब्राउज़र तब तक एक छवि डाउनलोड करना शुरू नहीं कर सकता जब तक कि उसका यूआरएल न हो, तो जितनी जल्दी आप यूआरएल प्रदान करेंगे, बेहतर होगा। ब्राउज़र डाउनलोड करने के लिए संसाधनों की पहचान करने के लिए लुकहेड नामक रणनीतियों का उपयोग करते हैं (http://blogs.msdn.com/b/ieinternals/archive/2010/04/01/ie8-lookahead-downloader-fixed.aspx)। इस पोस्ट को "फिडलर" के साथ क्यों टैग किया गया है? यदि आपके पास फिडलर चल रहा था, तो आपको यह सुनिश्चित करना होगा कि स्ट्रीमिंग सक्षम है (http: //www.fiddler2।com/Fiddler/मदद/streaming.asp)। – EricLaw

उत्तर

3

आप कई अंक याद कर रहे हैं है। सबसे पहले, सर्वोत्तम प्रथाएं न केवल डाउनलोड करने के बारे में हैं, बल्कि प्रतिपादन के बारे में भी हैं, क्योंकि यदि पूरा पृष्ठ 3s के लिए डाउनलोड किया गया है लेकिन किसी अन्य 2 को प्रस्तुत करने की आवश्यकता है, तो उपयोगकर्ता 5s, 3s नहीं चाहता है। मुझे छवियों को नीचे डालने के लिए सबसे अच्छा अभ्यास नहीं पता है (स्क्रिप्ट के लिए ऐसा है), मुझे लगता है कि सबसे अच्छा अभ्यास चौड़ाई और ऊंचाई विशेषताओं को शामिल करना है ताकि आप छवि डाउनलोड होने के दौरान प्रतिपादन को अवरुद्ध न करें।

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

+0

आपका अनुभाग अप्रासंगिक है क्योंकि वर्तमान में 6 समवर्ती कनेक्शन सीमा है और मेरा उदाहरण केवल 2 के बारे में चर्चा करता है। मुझे "सभी अनुरोधों को संभालने के लिए कनेक्शन गायब होने की कोई समस्या नहीं है "/ –

+0

मेरा मुद्दा यह है कि सर्वोत्तम अभ्यास आपके विशिष्ट मामले के लिए नहीं लिखे गए हैं, लेकिन सामान्य मामलों के लिए, जहां –

+0

लोड करने के लिए 6 से अधिक संसाधन हैं, फिर भी, दूसरा उदाहरण कम समय में क्यों लोड होता है? आईएमजी पाठ बनाम पाठ आईएमजी के बीच क्या अंतर है? –

0

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