2009-07-07 20 views
20

मेरे पास आपके लिए थोड़ा सा सवाल है - लेकिन आशा है कि उत्तर बहुत आसान होगा :)iframes इतनी धीमी क्यों हैं?

मान लें कि मेरे पास लिंक और आईफ्रेम (बस सरल उदाहरण के लिए) के साथ बहुत सरल पृष्ठ है।

<body> 
    <a href="test.html" target="mframe">open link></a> 
    <iframe name="mframe" [params] /> 
</body> 

तो जब आप लिंक पर क्लिक करेंगे तो यह फ्रेम में test.html लोड करेगा।

अब मैं div और AJAX कॉल के साथ iframe बदल दूंगा।

<body> 
    <a href="doAjaxCall('test.html')">open link</a> 
    <div id="main-content"></div> 
</body> 

doAjaxCall बस पूरे प्रतिक्रिया प्राप्त करने के लिए प्राप्त ajax requset उपयोग करें, यह (जावास्क्रिप्ट का उपयोग) और में < शरीर > टैग हड़पने सामग्री पार्स और यह मुख्य-content.innerHTML में डाल दिया जाएगा।

test.html में बहुत सी एचटीएमएल, सीएसएस शैलियों (लेकिन मूल पृष्ठ पर समान हैं) - इसलिए जब मैं AJAX समाधान का उपयोग कर रहा हूं तो मुझे उनकी आवश्यकता नहीं है)।

प्रश्न:

क्यों इस ajax समाधान अतः तेज है? मैं अभी भी उसी डेटा को डाउनलोड कर रहा हूं (पूरे test.html डाउनलोड कर रहा हूं)।

आईफ़्रेम समाधान इतना धीमा क्यों है? क्या ब्राउज़र के कारण यह सभी संभावित शैलियों को दोबारा पार्स करना है? या iffames का कोई अन्य उपरि है?

+0

क्या आप एक से अधिक ब्राउज़र में एक ही व्यवहार देखते हैं? – ChristianLinnell

+0

असल में मेरा उदाहरण बहुत आसान था। :) वास्तव में मैं इस समाधान को एक बड़ी साइट पर आजमा रहा था जहां हम अब iframes का उपयोग कर रहे हैं। मैंने उन्हें हटा दिया है और उन्हें अजाक्स समाधान के साथ बदल दिया है। जैसा कि मैंने लिखा है, मैंने सिर्फ AJAX कॉल के साथ लिंक बदल दिए हैं, लेकिन यातायात अभी भी वही है। और हां, यह हर ब्राउज़र (आईई/एफएफ/सीएच/एसएएफ) में निश्चित रूप से तेज़ है। केवल यही कारण है कि मैं अब देख सकता हूं कि ब्राउज़र को बार-बार शैलियों को लोड करने की आवश्यकता नहीं है, केवल 'मुख्य-सामग्री' div के आंतरिक HTML को प्रतिस्थापित करें। धन्यवाद! पावल। – palig

+0

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

उत्तर

22

आप सही रास्ते पर बहुत अधिक हैं। iframes धीमे होने जा रहे हैं क्योंकि ब्राउज़र के लिए एक अतिरिक्त ओवरहेड है (इसे प्रस्तुत करना, इसके उदाहरण को बनाए रखना और इसके संदर्भ)।

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

+1

वाह, सुपर-सोनिक-तेज़ उत्तर के लिए धन्यवाद :) एसओ प्यार करो! अगर कोई अन्य उत्तर/राय है तो मैं इंतजार करूंगा। – palig

+4

6 साल बाद, क्या यह अभी भी एक सटीक मूल्यांकन है? – donohoe

+1

@donohoe हां, यह अभी भी एक ही स्थिति है 7 साल बाद – kuzzmi

14

स्टीव सॉउडर के पास उनके उच्च प्रदर्शन वेब साइट्स ब्लॉग पर Using Iframes Sparingly पोस्ट है जो कुछ और अंतर्दृष्टि प्रदान कर सकता है।

+0

मैंने ऊपर से एक को 'उत्तर' के रूप में चिह्नित किया लेकिन यह भी बहुत उपयोगी है! धन्यवाद। – palig

0

हालांकि ब्राउजर 200 9 से बेहतर हुए हैं, लेकिन तथ्य यह है कि ब्राउजर को अतिरिक्त सर्वरों को मारने की आवश्यकता है (मानते हैं कि आईफ्रेम त्रि-पार्टी सामग्री के लिए हैं), या फिर स्थानीय सर्वर को दबाएं (मान लें कि iframes स्थानीय सामग्री के लिए हैं) यह अभी भी पेज प्रदर्शन को प्रभावित करेगा। सामान्य रूप से, अतिरिक्त HTTP अनुरोधों का हमेशा पृष्ठ के प्रदर्शन पर असर पड़ेगा। यदि पेज लोड होने के बाद आईफ्रेम बनाना संभव है और आईफ्रेम की सामग्री प्रस्तुत करने से पहले, यह प्रारंभिक पृष्ठ लोड में सुधार करेगा। हालांकि, मुझे लगता है कि यह पृष्ठ प्रदर्शन को प्रभावित करेगा जबकि iframe अतिरिक्त सामग्री लोड करता है।

संबंधित मुद्दे