תצלום של כריס ליברני ב- Unsplash

התייצב מול ביצוע מצערת לעומת תור

יש לנו המון מאמרים באינטרנט המסבירים מהם התעללות, מצערת ומה ההבדל ביניהם. אבל לרוב מצאתי היו לעתים קרובות ארוכות, מבלבלות ועם דוגמאות קוד מורכבות (אם בכלל).

אז הגעתי לדוגמאות קוד עבודה פשוטות יותר עבורן כדי לקבל את הרעיון בבדיחות. בוא נתחיל עם הקלה יותר, התעלם.

להתנער

התעלמות מפונקציה מועילה כאשר היא מתקשרת ברציפות ואנחנו רוצים שהיא תבצע לאחר פרק זמן מסוים אם עבר זמן מאז השיחה האחרונה.

זה מועיל במקרים בהם אנו רוצים שהמצב יתייצב לפני שמתקשר למטפל בכדי לשפר את הביצועים. אחת הדוגמאות הטובות ביותר לניסיון שגיליתי הייתה בבלוג הזה של ג'יי טומפקינס

לביצוע ביכורים, נוכל להיות באיזו תכונה שמירה אוטומטית ביישום שלנו. כאשר שמירה אוטומטית ביישום מנסה לשמור את מצב היישום שלנו בכל פעם שהמשתמש מבצע עדכון או מקיים אינטראקציה מסוימת. זה מחכה 5 שניות כדי לוודא שלא יתבצעו עדכונים או אינטראקציות אחרים לפני שמירת המדינה אחרת היא רושמת את המצב החדש וחוזרת על התהליך. אם קורה אינטראקציה כלשהי, הוא מאפס מחדש את הטיימר למשך 5 שניות.

הפעלת פונקציה (func, waitTime) {
    פסק זמן var;

    פונקצית החזרה () {
        clearTimeout (פסק זמן);
        פסק זמן = setTimeout (func, waitTime);
    };
};

זהו, ככה יכול להיות פריצה פשוטה.

מצערת

טכניקה זו נקראת בצורה טובה יותר. הפעלת פונקציה מועילה כאשר היא נקראת באופן רציף ואנחנו רוצים שהיא תבצע אחת לשעה שניות. דוגמה טובה לכך יכולה להיות מטפל גלילה או מטפל בגודל שינוי, שם אנו רוצים לבצע את המטפל פעם בפרק זמן קבוע, גם אם הפונקציה נקראת באופן רציף.

מצערת פונקציה (func, waitTime) {
    פסק זמן var = null;
    var הקודם = 0;

    var מאוחר יותר = פונקציה () {
        קודם = Date.now ();
        פסק זמן = null;
        func ();
    };

    פונקצית החזרה () {
        var now = Date.now ();
        var שאר = waitTime - (עכשיו - קודם);
        אם (שנותר <= 0 || הנותר> waitTime) {
            אם (פסק זמן) {
                clearTimeout (פסק זמן);
            }
            מאוחר יותר();
        } אחרת אם (! פסק זמן) {// null פסק זמן -> ללא ביצוע בהמתנה
            
            פסק זמן = setTimeout (מאוחר יותר, שנותר);
        }
    };
};

תוספת: תור

בקווי ניתוק ומצערת ניתן גם לתור שיחות פונקציות. במסגרת זו הפונקציה מבוצעת מספר הפעמים שהיא נקראת אך יש זמן המתנה קבוע לפני כל ביצוע. זה שימושי לאחרונה עבורי כאשר השתמשתי בספריה ונתקלתי באג שקורא לפונקציה בו מספר פעמים ללא עיכוב גורם לבעיה. (יכולים להיות גם מקרי שימוש אחרים :))

תור פונקציות (func, waitTime) {
    var funcQueue = [];
    var הוא מחכה;

    var executeFunc = פונקציה (פרמטרים) {
        isWaiting = נכון;
        func (params);
        setTimeout (הפעלה, waitTime);
    };

    var play = פונקציה () {
        isWaiting = שקר;
        if (funcQueue.length) {
            var params = funcQueue.shift ();
            לבצע את פונק (פרמטרים);
        }
    };

    פונקצית החזרה (פרמים) {
        אם (ממתין) {
            funcQueue.push (פרמות);
        } אחרת {
            לבצע את פונק (פרמטרים);
        }
    }
};

להסיק

לפני שתחליטו על טכניקת אופטימיזציה, קחו צעד אחורה וחשבו איזו מהן תעניק את התוצאה הטובה ביותר לאותו מקרה. תמיד יש אחד שיהיה יותר ביצועים.

אנא אל תהסס להשאיר תגובה או לצייץ אותי בכל שאלה או הצעה.