जीडब्ल्यूटी फ्लेक्सटेबल प्रदर्शन और अनुकूलन

मैं जीडब्ल्यूटी परियोजना पर काम कर रहा हूं जहां हम कुछ डेटा प्रदर्शित करने के लिए FlexTable का उपयोग कर रहे हैं। मुझे पता है कि हमें शायद CellTable का उपयोग करना चाहिए क्योंकि इसमें बेहतर प्रदर्शन है, लेकिन फ्लेक्सटेबल शैली (शैली विशिष्ट कोशिकाओं) के लिए आसान है और विशिष्ट सेल को अपडेट करना आसान बनाता है।जीडब्ल्यूटी फ्लेक्सटेबल प्रदर्शन और अनुकूलन

तालिका के लिए अपडेट प्राप्त करने के लिए हम WebSockets का उपयोग कर रहे हैं। वेबस्केट्स के माध्यम से प्रति सेकंड 100 से अधिक अपडेट होने पर हम जिस समस्या का सामना कर रहे हैं, वह अब उच्च CPU लोड है। वेबसॉकेट कनेक्शन से प्रत्येक संदेश में तालिका में कई सेल्स के लिए अद्यतन होते हैं। तो अभ्यास में प्रति सेकंड 100 से अधिक अपडेट हैं जिन्हें फ्लेक्सटेबल में प्रस्तुत किया जाना चाहिए। 4 जीबी रैम के साथ मेरे 3GHz i5 पर सीपीयू लोड लगभग 50% है। यदि मैं डेटा के वास्तविक प्रतिपादन को अक्षम करता हूं (setText() विधि कॉल पर टिप्पणी करें) तो CPU लोड 5-10% तक चला जाता है। तो मुझे पता है कि डीओएम अपडेट बाधाएं हैं, कोड के अन्य हिस्सों में नहीं।

यह CellTable (लेकिन कैसे तो झुलसाना सेल अपडेट करने के लिए)

उपयोग ग्रिड बजाय
स्विच करने के लिए बेहतर होगा?
उपयोग जे एस/JSNI FlexTable setText() के बजाय डोम के साथ काम करने

वहाँ तालिका को लागू करने और प्रदर्शन में सुधार करने के लिए बेहतर तरीके हैं?

मैंने Google को फ्लेक्सटेबल के साथ समान समस्याएं होने पर Google को करने का प्रयास किया है, लेकिन केवल सामान्य राय है कि यह धीमा है, कुछ विशिष्ट नहीं है। हम आवेदन प्रोटोटाइप जावास्क्रिप्ट में और प्रति सेकंड सीपीयू लोड एक ही 100 अद्यतन के साथ विशुद्ध रूप से किया है लगभग 15% है

अद्यतन
गिराने सीएसएस फीका प्रभाव है जो हम से सेल मूल्य कम सीपीयू लोड में परिवर्तन का संकेत करने के लिए इस्तेमाल ~ 10 %। तो ऐसा लगता है कि डोम एकमात्र समस्या नहीं है।

स्रोत

2011-11-09 dimchez

उपर्युक्त सभी के लिए एक विकल्प (या इसके अतिरिक्त, आपको क्या परिणाम मिलते हैं) के रूप में, मैं कुछ शेड्यूलर विधियों का उपयोग करने के लिए देखता हूं। विशेष रूप से Scheduler.get()। ScheduleIncremental() और एक समय में 10 कहने के बैचों में अपडेट करें। यह ब्राउज़र को अपडेट के बीच अन्य घटनाओं को संसाधित करने की अनुमति देगा और CPU उपयोग पर सकारात्मक प्रभाव डालना चाहिए।

सेलटेबल यहां आपकी सहायता करने वाला नहीं है क्योंकि आप अलग-अलग सेल अपडेट नहीं कर सकते हैं। तो एक विकल्प के रूप में यह आपको केवल ग्रिड छोड़ देता है और मैन्युअल रूप से टेबललेमेंट का प्रबंधन करता है।

स्रोत

2011-11-09 14:29:45 Strelok

सेल का वास्तविक अपडेट शेड्यूलर Impl.get() के अंदर किया जाता है। शेड्यूल डिफरर्ड() लेकिन इससे ज्यादा मदद नहीं मिलती है। हालांकि यह ब्राउज़र को अधिक उत्तरदायी रखता है। SchedulerImpl.get() का उपयोग करना। ScheduleIncremental() काम नहीं करेगा क्योंकि हमारे द्वारा प्राप्त डेटा की मात्रा भिन्न हो सकती है। अब तक ऐसा लगता है कि हमें ग्रिड को आज़माकर खुद को लागू करना चाहिए। – dimchez

वृद्धि, इस मामले में स्थगित से कहीं ज्यादा बेहतर है। डिफरर्ड प्रति ऑपरेशन के लिए एक नया जेएस टाइमर का उपयोग करेगा, जबकि वृद्धिशील एकल जेएस निष्पादन स्टैक में एकाधिक अपडेट बैच करेगा, जिसके परिणामस्वरूप एक पृष्ठ रीड्रॉ होगा, जिससे प्रतिपादन थ्रेड बैच में संचालन भी कर सकता है। – Ajax

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

मेरे पास एक सेलटेबल वाला ऐप है जो 30x100 जितना बड़ा हो सकता है। इसमें मनमानी कोशिकाओं पर मनमाने ढंग से शैलियों हैं, प्रत्येक कोशिका में जटिल सामग्री होती है (<img>, कुछ <div> एस, और कुछ पाठ) और कभी-कभी मुझे एक एकल सेल को अपडेट करने की आवश्यकता होती है। विकास मोड में मेरी मैकबुक समर्थक पर पूरी चीज को दोबारा खोलना (मेरी मानवीय धारणाओं के लिए) अनजान है।

यदि आप लाइव अपडेट चाहते हैं (उदाहरण के लिए प्रति सेकंड 100 अपडेट, जैसे वे होते हैं) तो मुझे लगता है कि आप एक अलग मंच चाहते हैं। यहां तक कि आपका मॉनीटर भी प्रति सेकंड 100 बार ताज़ा नहीं कर रहा है।

स्रोत

2011-11-09 15:34:43

कुछ मामलों में हमारे पास 8 कॉलम वाले तालिका में 100 पंक्तियां हो सकती हैं। कॉलम के 6 वेबस्केट फ़ीड से डेटा के साथ अद्यतन किए जाते हैं। हमारे सिमुलेशन में हम प्रत्येक 10 एमएस में 1 संदेश उत्पन्न करते हैं और कुल मिलाकर हमें प्रति सेकंड 100 संदेश, 600 डोम अपडेट देता है। फ्लेक्सटेबल को संभालने के लिए यह बहुत अधिक है। लेकिन यह ध्यान में रखना आसान है कि डेटा तेजी से अपडेट किया गया है क्योंकि यह विभिन्न स्थानों (कोशिकाओं) में अद्यतन किया जाता है। इसे कम करने का एक तरीका जेएसएनआई का उपयोग करना होगा और पूरी पंक्ति को एक डोम अपडेट के साथ बदलना होगा। लेकिन मुझे यकीन नहीं है कि जीडब्ल्यूटी उस के बाद कुछ और नहीं करेगा जब कोड जावा से जावास्क्रिप्ट में संकलित किया जाता है। – dimchez

क्या आप कह रहे हैं कि आप विभिन्न स्थानों पर विभिन्न स्थानों पर होने वाले अपडेट के साथ 100hz पर स्पार्कलिंग प्रभाव का एक प्रकार चाहते हैं? उस स्थिति में, मुझे लगता है कि कोई भी '

'संरचना अनुचित है - यह बहुत अधिक अद्यतन है। कैनवास तत्व, या फ्लैश के बारे में क्या? –

यदि आपको स्पार्कलिंग की आवश्यकता नहीं है, और प्रति सेकंड एक बार में सभी 100 पंक्तियां अपडेट करना चाहते हैं, तो आपको पूरी तरह से 'सेलटेबल' का उपयोग करना चाहिए। –

आप cellTable.redrawRow(index); का उपयोग कर सकते हैं जो बड़ी तालिकाओं में तेज़ी से है।
अच्छी बात यह है कि पंक्ति सूचकांक FieldUpdater द्वारा दिया गया है।

स्रोत

2012-10-30 14:49:12 qwertzguy

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