Troika: "बड़ी संख्या में खुले कार्यकर्ता मॉड्यूल अनुरोध, कुछ वापस नहीं आ रहे हैं" चेतावनी

हम्म, वह चेतावनी तब तक ट्रिगर नहीं होती जब तक कि > 1000 खुले कार्यकर्ता अनुरोध न हों। क्या आपके पास बहुत बड़ी संख्या में टेक्स्ट इंस्टेंस हैं?

मैं करता हूं, लेकिन 1000 से अधिक नहीं (कम से कम जानबूझकर नहीं)

कुछ सौ की तरह अधिक

यहाँ मैं क्या प्रस्तुत कर रहा हूँ

लेकिन तो आप क्या कह रहे हैं कि शायद मेरी तरफ एक बग है जहां मैं वास्तव में जरूरत से ज्यादा उदाहरण बनाता हूं और एक बार जब मैं 1000 की गिनती पार कर लेता हूं तो यह एक त्रुटि फेंकना शुरू कर देता है?

मैं ऐसे उदाहरण स्थापित कर रहा हूं जिनमें कोई सामग्री नहीं है .visible = false

लेकिन मुझे लगता है कि अभी भी इसका मतलब है कि उदाहरण मौजूद है

क्या आप अप्रयुक्त उदाहरणों को पूरी तरह से हटाने के लिए .visible प्रोप का उपयोग करने के बजाय अनुशंसा करेंगे?

आह, यह समझा सकता है। .sync() पर कोई भी कॉल अभी भी पृष्ठभूमि में कार्यकर्ता को जारी की जाएगी, भले ही दृश्यमान: गलत हो, और वे ढेर हो जाएंगे।

मुझे लगता है कि मैं व्यक्तिगत रूप से मांग पर लेबल बनाने/निपटान करने का विकल्प चुनूंगा, या कम से कम .sync() छिपे हुए लोगों के लिए कॉल को रोकूंगा। वे कार्यकर्ता अनुरोध करते हैं कि सभी एक ही कार्यकर्ता का उपयोग करें, इसलिए यदि यह छिपे हुए लेबल को संसाधित करने में व्यस्त है तो इससे आपके दृश्यमान लोगों के प्रसंस्करण में देरी हो सकती है।

मैं कुछ धारणाएँ बना रहा हूँ, हालाँकि, आपका सटीक लेबल व्यू कोड नहीं देखा है। यह अभी भी संभव है कि मेरे अंत में एक बग है, इसलिए एलएमके जो आपको मिल जाए।

केवल .sync() को कॉल करने का प्रयास किया जब .visible === true

लेकिन फिर भी चेतावनियां मिल रही हैं

अगर इसके बजाय मैं केवल दृश्यमान वस्तुओं के लिए उदाहरण बनाता हूं और अप्रयुक्त को नष्ट कर देता हूं तो चेतावनियां दूर हो जाती हैं

हम्म, Text ही केवल सिंक() को onBeforeRender में कॉल करता है, जो दृश्यमान = गलत होने पर ट्रिगर नहीं होना चाहिए।

क्या आपका लेबल व्यू रैपर कोड कहीं भी उपलब्ध है जिसे मैं देख सकता हूं?

यह एक बंद स्रोत परियोजना का हिस्सा है

लेकिन यहां प्रासंगिक वर्ग है, जो पर्याप्त हो सकता है

import {Mesh, MeshBasicMaterial} from "three";
import R from "../../../../../../../../../../resources/Namespace";
import BaseView, {ViewType} from "./BaseView";
import {Text} from "troika-three-text";
import {GeometryInstances} from "../instances/GeometryInstances";
import {MaterialInstances} from "../instances/MaterialInstances";

export enum TextAlign {
    left = "left",
    right = "right",
    center = "center",
    justify = "justify",
}

export enum HorizontalAlign {
    left = "left",
    right = "right",
    center = "center",
}

export enum VerticalAlign {
    top = "top",
    topBaseline = "top-baseline",
    middle = "middle",
    bottomBaseline = "bottom-baseline",
    bottom = "bottom",
}

export interface ILabelData {
    content: string;
    fontFace?: string;
    fontSize?: number;
    alignment?: TextAlign;
    horizontalAlign?: HorizontalAlign;
    verticalAlign?: VerticalAlign;
    color?: string;
    opacity?: number;
    backgroundColor?: string;
    highlightable: boolean;
}

export default class LabelView extends BaseView {
    get viewObject() {
        return this._viewObject as any;
    }

    get content() {
        return this.textMesh.text;
    }

    set content(content: string) {
        if (content !== this.textMesh.text) {
            this.textMesh.text = content;
            this.textMesh.visible = !!content;

            this.syncIfVisible();
        }
    }

    private syncIfVisible() {
        // Better for perf: https://github.com/protectwise/troika/issues/112
        if (this.textMesh?.text && this.textMesh?.visible && this._isVisible) {
            this.textMesh.sync();
        }
    }

    set textAlign(alignment: TextAlign) {
        this.textMesh.textAlign = alignment;
        this.syncIfVisible();
    }

    set horizontalAlign(alignment: HorizontalAlign) {
        this.textMesh.anchorX = alignment;
        this.syncIfVisible();
    }

    set verticalAlign(alignment: VerticalAlign) {
        this.textMesh.anchorY = alignment;
        this.syncIfVisible();
    }

    private backgroundMesh: Mesh | undefined;
    private readonly textMesh: any;
    private readonly foregroundColor: string;
    private highlightable: boolean;

    constructor(labelData: ILabelData) {
        super(ViewType.Label);

        this.foregroundColor = labelData.color || R.colors.elements.labels.foreground;

        this.highlightable = labelData.highlightable;

        if (labelData.backgroundColor) {
            this.textMesh = this.createTextMesh(
                labelData.content,
                labelData.fontFace,
                labelData.fontSize,
                labelData.alignment,
                labelData.horizontalAlign,
                labelData.verticalAlign,
                this.foregroundColor,
                labelData.opacity,
                1);

            this.textMesh.addEventListener("synccomplete", () => {
                if (this.backgroundMesh) {
                    this._viewObject.remove(this.backgroundMesh);
                }

                if (this.textMesh.text) {
                    const bounds = this.textMesh.textRenderInfo.blockBounds;
                    this.backgroundMesh =
                        this.createBackgroundBox(bounds[0], bounds[1], bounds[2], bounds[3], 0);
                    this._viewObject.add(this.backgroundMesh);
                }
            });

        } else {
            this.textMesh = this.createTextMesh(
                labelData.content,
                labelData.fontFace,
                labelData.fontSize,
                labelData.alignment,
                labelData.horizontalAlign,
                labelData.verticalAlign,
                this.foregroundColor,
                labelData.opacity,
                0);
        }

        this.syncIfVisible();

        this._viewObject.add(this.textMesh);
    }

    public onFrameRendered(elapsedTime: number) {
        if (this.highlightable) {
            this.setLabelHighlightState();
        }
    }

    private setLabelHighlightState() {
        const labelMaterial = this.textMesh.material as MeshBasicMaterial;
        if (this._isHighlighted) {
            labelMaterial.color.set(R.colors.elements.labels.highlighted);
        } else {
            labelMaterial.color.set(this.foregroundColor);
        }
    }

    private createTextMesh(content: string,
                           fontFace = R.layout.labels.font_face.regular,
                           fontSize = R.layout.labels.font_size,
                           textAlign = TextAlign.center,
                           horizontalAlign = HorizontalAlign.center,
                           verticalAlign = VerticalAlign.middle,
                           color: string,
                           opacity = 1,
                           zLevel: number) {
        const labelMesh = new Text();

        labelMesh.font = fontFace;
        labelMesh.text = content || "";
        labelMesh.fontSize = fontSize;
        labelMesh.position.z = zLevel;
        labelMesh.color = color;
        labelMesh.textAlign = textAlign;
        labelMesh.anchorX = horizontalAlign;
        labelMesh.anchorY = verticalAlign;

        labelMesh.material.opacity = opacity;
        labelMesh.name = "LabelView";

        return labelMesh;
    }

    private createBackgroundBox(startX: number, startY: number, endX: number, endY: number, zLevel: number) {
        const paddingLeft = 1;
        const paddingRight = 2;
        const paddingTop = 1;
        const paddingBottom = 0;

        const width = Math.abs(startX) + Math.abs(endX) + paddingLeft + paddingRight;
        const height = Math.abs(startY) + Math.abs(endY) + (paddingTop + paddingBottom);

        const geometry = GeometryInstances.getInstance().getPlaneGeometryInstance(width, height);
        const material = MaterialInstances.getInstance().backgroundColorMaterial;
        const mesh = new Mesh(geometry, material);

        const posX = ((startX + endX) / 2) + (paddingLeft / 4);
        const posY = ((startY + endY) / 2) - (paddingBottom);

        // The z level of element in accordance with standards defined in resources
        mesh.position.set(posX, posY, zLevel);
        mesh.name = "LabelBackgroundBox";

        return mesh;
    }
}

हम्म, मेरा कूबड़ होगा सिंकइफविजिबल () को .visible को गलत पर सेट करने से पहले कॉल किया जा रहा है, लेकिन यह निश्चित रूप से कहना मुश्किल है कि बिना यह जाने कि आपका व्यू सिस्टम कैसे काम करता है।

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

आपने जो वर्णन किया है, उससे मुझे लगता है कि यह चेतावनी अपेक्षित व्यवहार कर रही है; इसने एक प्रदर्शन समस्या को सही ढंग से हाइलाइट किया। मैं इस मुद्दे को बंद कर रहा हूँ; यदि आप अलग तरह से विश्वास करते हैं तो इसे फिर से खोलने के लिए स्वतंत्र महसूस करें। धन्यवाद!

बस इस पर वापस आ रहा हूँ

तो यह पता चला है कि मेरे दृश्य में आसानी से 1000 से अधिक टेक्स्ट इंस्टेंस हैं। लेकिन वहाँ बस एक ही समय में सभी दिखाई नहीं दे रहे हैं

उनमें से कई बस कुछ वस्तुओं के माउस-ओवर पर दिखाई देते हैं

तो मैं सोच रहा हूं कि यहां आगे बढ़ने का सबसे अच्छा तरीका क्या है:

1. केवल दृश्यमान पाठ के लिए इंस्टेंस बनाएं और फिर जैसे ही यह अदृश्य हो जाए, अनमाउंट करें?
2. इसके बजाय थ्रीजेएस सीएसएस ऑब्जेक्ट्स का उपयोग करें?

व्यक्तिगत रूप से मैं पहले विकल्प के लिए जाऊंगा। मैं गलत हो सकता था लेकिन मुझे नहीं लगता कि उन सभी छिपी हुई लेबल वस्तुओं को दृश्य ग्राफ में मौजूद होने का कोई फायदा है।

समझ लिया

मुझे वस्तुओं के माउस होवर पर उन्हें जल्दी से दिखाने में सक्षम होना चाहिए

क्या आप उपयोग के बाद उन्हें नष्ट करने और होवर पर नए बनाने की सलाह देंगे या इसके बजाय उन्हें थ्रीजे दृश्य से हटा देंगे?

ईमानदारी से कहूं तो मुझे नहीं लगता कि किसी भी तरह से ध्यान देने योग्य अंतर होने वाला है। यदि आप कोई समस्या देखते हैं तो ही मैं प्रबंधन और अनुकूलित करने के लिए सबसे आसान चीज से शुरू करूंगा।

व्यक्तिगत रूप से मैंने दृष्टिकोण को बनाने/नष्ट करने के लिए बहुत कुछ किया है, और यह हमेशा मेरे लिए बहुत तेज़ है।