Լուսանկարը ՝ Chris Liverani- ի ՝ Unsplash- ի վրա

Debubb vs Throttle vs Queue կատարումը

Մենք ինտերնետում ունենք հոդվածների մեծ քանակություն, որոնք բացատրում են, թե ինչն է Deb debing, Throttling- ը և որն է նրանց միջև տարբերությունը: Բայց գտածների մեծ մասը հաճախ երկար, շփոթեցնող և բարդ կոդային օրինակներով (եթե այդպիսիք կան):

Այսպիսով, ես եկել եմ պարզեցված աշխատանքային օրենսգրքի օրինակներ, որպեսզի նրանց գաղափարը դառնա անթերի: Եկեք սկսենք ավելի դյուրին, Deboun:

Դեբատել

Գործառույթը մերժելը օգտակար է դառնում այն ​​դեպքում, երբ այն անընդհատ կանչվում է, և մենք ուզում ենք, որ այն կատարվի որոշակի ժամանակահատվածից հետո, եթե վերջին զանգից անցել է ժամանակը:

Սա օգտակար է այն դեպքերում, երբ մենք ցանկանում ենք, որ իրավիճակը կայունանա, նախքան բեռնաթափիչը զանգահարելը `կատարողականը բարելավելու համար: Ես գտա դեբեկացման լավագույն օրինակներից մեկը ՝ այս բլոգում ՝ byեյ Թոմփկինը

Մերժելու համար մեր դիմումում մենք կարող ենք ունենալ մի քանի այլ ավտոմատ խնայողություն: Դիմումի ինքնաբերաբար պահմամբ `ամեն անգամ օգտագործողը փորձում է թարմացնել կամ որոշակի փոխազդեցություն պահպանել` պահպանելով մեր դիմումի վիճակը: Այն սպասում է 5 վայրկյան `համոզվելու համար, որ այլ նորություններ կամ փոխազդեցություններ չեն արվում, նախքան այլ պետությունը փրկելը, այն գրանցում է նոր պետությունը և կրկնում գործընթացը: Եթե ​​որևէ փոխազդեցություն տեղի ունենա, այն կրկին վերականգնում է իր ժամանակաչափը 5 վայրկյան:

ֆունկցիայի դեբատավորում (գործառույթ, սպասման ժամ) {
    var timeout;

    վերադարձի գործառույթ ()
        clearTimeout (դադարեցում);
        timeout = setTimeout (գործառույթ, սպասման ժամ)
    };
};

Դա այն է, որ դա կարող է լինել ինչպես պարզ դեբո:

Շնչափող

Այս տեխնիկան ավելի համապատասխան կոչված է: Ֆունկցիան նետելը օգտակար է, երբ այն անընդհատ կոչվում է, և մենք ուզում ենք, որ այն կատարվի յուրաքանչյուր x վայրկյան մեկ անգամ: Դրա լավ օրինակ կարող է լինել ոլորման վարիչը կամ չափափոխանակման բեռնաթափիչը, որտեղ մենք ուզում ենք բեռնաթափիչը իրականացնել մեկ անգամ ՝ հաստատված ժամանակահատվածում, նույնիսկ եթե գործառույթը անընդհատ կոչվում է:

ֆունկցիայի շնչափող (գործառույթ, սպասման ժամ) {
    var timeout = null;
    var նախորդ = 0;

    var ավելի ուշ = գործառույթ ()
        նախորդ = Date.now ();
        timeout = null;
        գործառույթ ();
    ;

    վերադարձի գործառույթ ()
        var այժմ = Date.now ();
        var մնացորդ = սպասում Ժամանակ - (այժմ - նախորդ);
        եթե (մնացած <= 0 || մնացորդը> սպասման ժամ) {
            եթե (ժամկետը) {
                clearTimeout (դադարեցում);
            }
            ավելի ուշ ();
        } other if (! timeout) {// null timeout -> no սպասում կատարման
            
            timeout = setTimeout (ավելի ուշ, մնացած);
        }
    };
};

Լրացուցիչ

Քանդման և շնչափող գծերի վրա կարող են հերթագրվել նաև ֆունկցիոնալ զանգեր: Այս գործում գործառույթն իրականացվում է այն ժամանակների քանակով, որոնք կանչվում են, բայց յուրաքանչյուր կատարումից առաջ կա սպասման ֆիքսված ժամանակ: Վերջերս ինձ համար ձեռնտու էր, երբ ես օգտագործում էի գրադարան և վազում էի մի վրիպակի, որի մեջ մի քանի անգամ առանց հետաձգման գործառույթ էին կանչում, ինչը խնդիր էր առաջացնում: (օգտագործման այլ դեպքեր էլ կարող են լինել :))

գործառույթի հերթ (գործառույթ, սպասման ժամ) {
    var functionQueue = [];
    var is սպասում;

    var executeFunc = գործառույթ (պարամետրեր) {
        isWaiting = ճշմարիտ;
        գործառույթ (պարամետրեր);
        setTimeout (խաղալ, սպասում ժամ);
    ;

    var play = գործառույթ ()
        isWaiting = կեղծ;
        եթե (functionQueue.length)
            var պարամետրեր = funksionQueue.shift ();
            գործարկելFunc (պարամետրեր);
        }
    ;

    վերադարձի գործառույթ (պարամետրեր) {
        եթե (սպասում է) {
            functionQueue.push (պարամետրեր);
        } ուրիշ
            գործարկելFunc (պարամետրեր);
        }
    }
;

Եզրակացնել, ամփոփել

Նախքան որոշեք օպտիմիզացման տեխնիկան, մի քայլ կատարեք և մտածեք, թե որ դեպքում այդ դեպքում լավագույն արդյունքը կտա: Միշտ կա մեկը, որն ավելի կատարողական կլինի:

Խնդրում ենք ազատ զգալ թողնել պատասխանը կամ գրեք ինձ ցանկացած հարց կամ առաջարկ: