2010-12-06 10 views
7

मैं वर्तमान में एक AJAX चैट डीबग कर रहा हूं जो कि अंतहीन रूप से पृष्ठ को डोम-तत्वों से भरता है। यदि आपके पास 3 घंटे की तरह चैट चल रही है तो आप भगवान के साथ खत्म हो जाएंगे कि कितने हजार डोम-नोड्स हैं।जावास्क्रिप्ट प्रदर्शन समस्याओं को बहुत सारे डोम नोड्स के साथ?

चरम डीओएम उपयोग से संबंधित समस्याएं क्या हैं?

क्या यह संभव है कि यूआई पूरी तरह उत्तरदायी हो (विशेष रूप से इंटरनेट एक्सप्लोरर में)?

(और इस प्रश्न से संबंधित कोर्स बंद समाधान, अगर कोई अन्य मैनुअल कचरा संग्रहण और डोम नोड्स को हटाने के अलावा अन्य समाधान कर रहे हैं है।)

+1

क्या आप समस्याएं अनुभव कर रहे हैं या सैद्धांतिक रूप से बोल रहे हैं? यदि हां, तो क्या आप एक यूआरएल या कम से कम कुछ और विवरण दे सकते हैं कि आप किस तरह के मंदी देखते हैं (जब नए नोड्स को जोड़ते हैं, स्क्रॉल करते समय, AJAX ईवेंट इत्यादि)। आपको http://www.dynatrace.com/en/ – galambalazs

उत्तर

11

अधिकांश आधुनिक ब्राउज़र विशाल के साथ बहुत अच्छी तरह से निपटने के लिए सक्षम होना चाहिए डोम पेड़ और "अधिकांश" आमतौर पर आईई शामिल नहीं है।

तो हाँ, आपका ब्राउज़र उत्तरदायी नहीं हो सकता है (क्योंकि इसे बहुत अधिक RAM -> स्वैपिंग की आवश्यकता है) या क्योंकि यह रेंडरर केवल अभिभूत है।

मानक समाधान तत्वों को छोड़ना है, कहें कि पृष्ठ के 10'000 लाइनों के चैट के बाद कहें। यहां तक ​​कि 100'000 लाइनें भी बड़ी समस्या नहीं होनी चाहिए। लेकिन मैं उससे अधिक संख्या के लिए असहज महसूस करना शुरू कर दूंगा (लाखों लाइनों कहें)।

[संपादित करें] एक और समस्या मेमोरी लीक है। हालांकि जेएस कचरा संग्रह का उपयोग करता है, भले ही आप अपने कोड में गलती करते हैं और वैश्विक चर (या वैश्विक चर से ऑब्जेक्ट संदर्भ) में हटाए गए डीओएम तत्वों के संदर्भ रखते हैं, फिर भी आप स्मृति से बाहर हो सकते हैं भले ही पृष्ठ में केवल कुछ ही शामिल हों हजार तत्व

+0

धन्यवाद का प्रयास करना चाहिए। यह जानना हमेशा कठिन होता है कि ब्राउजर कितने डोम-तत्वों को संभाल सकता है, लेकिन मैं मानता हूं कि चैट सत्र में प्रदर्शित चैट लाइनों की संख्या पर सीमा न रखने का कोई अच्छा विचार नहीं है। एक बेहतर समाधान है कि किसी प्रकार का इतिहास देखें। क्योंकि मैं पूरी चीज का पुनर्निर्माण नहीं कर सकता क्योंकि कुछ लीक "पोस्ट-फिक्स" करना मुश्किल है, लेकिन मैंने कुछ मैनुअल कचरा संग्रह जोड़ा है। – Jens

0

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

उदाहरण के लिए, document.getElementsByTagName('div') जैसे HTML संग्रह पर विचार करें। यह दस्तावेज़ के खिलाफ एक प्रश्न है और संग्रह की लंबाई जैसे हर समय अद्यतित जानकारी की आवश्यकता होती है। इससे अक्षमता हो सकती है। लूप के अंदर संग्रहों को एक्सेस करने और छेड़छाड़ करते समय सबसे खराब मामले होंगे।

कई विचार और उदाहरण हैं, लेकिन किसी भी चीज़ की तरह यह एप्लिकेशन पर निर्भर करता है।

8

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

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

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