क्या लेन-देन में कई डीओएम मैनिप्लेटिंग कमांड को समाहित करने का कोई तरीका है ताकि सामग्री "झिलमिलाहट" न हो? कुछ इस तरह:जावास्क्रिप्ट में एचटीएमएल डोम ड्राइंग लेनदेन?
window.stopDrawing(); // start transaction
$("#news").append("<div>a new news item</div>");
// ... do something more
$("#news").css("top", "-150px");
window.startDrawing(); // stop transaction
हर आप बस सभी कार्यों सहित एक समारोह की स्थापना तत्वों के एक बड़े सेट को अपडेट करना होगा, फोन mozRequestAnimationFrame (या webkitRequestAnimationFrame), केवल अपने कार्य को क्रियान्वित करने के लिए पूरी तरह यह अपने परिवर्तनों को आकर्षित करेगा समाप्त हो गया है के बाद स्क्रीन पर।
अधिक पर: https://developer.mozilla.org/en/DOM/window.mozRequestAnimationFrame
वास्तव में, इस अनुरोध का एक मानकीकृत संस्करण है [requestAnimationFrame] (http://ie.microsoft.com/testdrive/Graphics/RequestAnimationFrame/Default.html) – sternr
यह फ़ंक्शन फ़ायरफ़ॉक्स या क्रोम (I don 'में मौजूद नहीं है टी आईई 9 के बारे में पता नहीं है) क्योंकि यह प्रयोगात्मक है, इसलिए मैंने प्रीफिक्स्ड संस्करण का उपयोग करने की सिफारिश की है – Shedokan
मेरा मानना है कि ब्राउज़रों दस्तावेज़ redrawing कर रहे हैं केवल जब स्क्रिप्ट भी पाश में लौटता है, तो यह अपनी स्क्रिप्ट के अंत तक कुछ भी नहीं renders होगा।
वैसे भी कुछ ऑपरेशन ब्राउज़र को कुछ महंगे संचालन करने के लिए बाध्य कर सकते हैं जैसे दस्तावेज पर तत्वों के आयामों को दोबारा जोड़ना (उदाहरण के लिए कुछ डीओएम मैनिप्लेशंस के बाद तत्व के आयामों को पुनर्प्राप्त करते समय)। तो आपको जितना संभव हो उतना दस्तावेज डीओएम मैनिपुलेशन करना चाहिए।
यदि आपके पास कुछ तत्वों पर करने के लिए कई कुशलताएं हैं, तो दस्तावेज़ पेड़ से इसे हटाने के लिए सस्ता हो, अपनी कुशलताएं करें और इसे फिर से पेड़ में जोड़ें।
ब्राउज़र्स (नए) पहले से ही आंतरिक रूप से ऐसा करते हैं कि वे कर सकते हैं। हालांकि कोई स्पष्ट नियंत्रण नहीं है। यदि आप किसी विशेष स्थिति के बारे में अधिक पोस्ट करते हैं, तो आप किसी ऑप्टिमाइज़ेशन का सुझाव दे सकते हैं। – Pointy