तो मेरे पास है 300 तात्कालिकताएँ एक घटक जो वैश्विक क्लिक ईवेंट श्रोता को एक के माध्यम से परिभाषित करता है host गुण:

@Component({
selector: "value-edit",
template: ``,
host: {
"(document: click)": "onClickOff($event)",
},
changeDetection: ChangeDetectionStrategy.OnPush
)
export class ValueEditComponent {
onClickOff(globalEvent) {
// to make sure it doesn"t affect performance we keep it EMPTY!
}
}

मैंने इस पर गौर किया बेहद प्रदर्शन को प्रभावित करता है, यह एक क्लिक पर हर जगह क्लिक करने के बाद प्रसंस्करण के लगभग 2-3 सेकंड लेता है document.

यह एक अनुक्रम के लिए क्रोम में बना जेएस सीपीयू प्रोफाइल है: ~ 5 सेकंड प्रतीक्षा करें, क्लिक करें, कुछ सेकंड प्रतीक्षा करें और रिकॉर्डिंग बंद करें। स्क्रीनशॉट पर विशाल हरे रंग का कॉलम है:

मैंने इस घटक या यहां तक ​​कि एक अभिभावक पर बदलें डिटेक्टर की जांच करने की कोशिश की, लेकिन यह मदद नहीं की। बस लाइन से बाहर टिप्पणी "(document: click)": "onClickOff($event)", समस्या को ठीक करता है।

हो सकता है कि यह एक फ्रेमवर्क या खराब उपयोग का मुद्दा हो, लेकिन मुझे यकीन नहीं है कि इसे कैसे और बेहतर तरीके से लागू किया जा सकता है।

यहां प्लंकर

GitHub मुद्दा यहाँ

उत्तर:

उत्तर № 1 के लिए 1

कोणीय 2.0.0 (अंतिम) कोड के नीचे एक ही प्रदर्शन मुद्दा होगा:

ngAfterViewInit() {
document.addEventListener("click", evt => this.evtClickHandler)
}

"ज़ोन" के बाहर पंजीकरण कार्यक्रम में मदद करनी चाहिए:

constructor(zone: NgZone) {
}

ngAfterViewInit() {
this.zone.runOutsideAngular(() => {
document.addEventListener("click", evt => this.offClickHandler(evt))
})
}

व्याख्या

Sortablejs पुस्तकालय का उपयोग करते हुए प्रदर्शन का मुद्दा फिर से मेरे साथ हुआ। यह "कोणीय के अंतिम संस्करण से पहले मामला नहीं था, लेकिन देशी तत्वों पर घटनाओं को दर्ज करने के कारण कुछ बदल गया।

Sortablejs पुस्तकालय के लिए मैंने ऐसा किया:

this.sortedImages = Sortable.create(el, options)

तत्वों को खींचते समय अब ​​वास्तव में खराब प्रदर्शन हुआ:

समाधान या समाधान इस प्रकार है:

this.zone.runOutsideAngular(() => {
this.sortedImages = Sortable.create(el, options)
})

कहा पे this.zone इंजेक्शन है @angular/core/NgZone। इस तरह से लाइब्रेरी श्रोताओं को NgZone के बाहर सुनने का मौका देती है।

मैंने पोस्ट किया है गिटहब पर एक मुद्दा इस समस्या के बारे में, लेकिन इसे कोडिंग में मेरी त्रुटि के रूप में पहचाना गया, न कि कोणीय में बग। हालाँकि, नवीनतम (RC - अंतिम से पहले) संस्करणों के बीच कुछ परिवर्तन दिखाई दिए।

तो यह एक बग या (नवीनतम) डिज़ाइन हो सकता है लेकिन मुझे इस पर पुष्टि नहीं है।

---