عکس کریس لیرانی در Unsplash

اعدام در مقابل Throttle vs Queue را رد کنید

ما مقالات زیادی در اینترنت داریم که توضیح می دهند Deb debing ، Throttling چیست و تفاوت بین آنها چیست. اما بیشتر من پیدا شد اغلب طولانی ، گیج کننده و با نمونه های پیچیده کد (در صورت وجود) بود.

بنابراین من مثالهای ساده ای از کد کار را برای آنها آورده ام تا مفهوم را در یک حالت تند و تیز دریافت کنند. بیایید با ساده تر شروع کنیم ، Debounce.

رد کردن

هنگامی که به طور مداوم فراخوانده می شویم ، کارکردن برای کارکرد مفید است و می خواهیم اگر از زمان آخرین تماس گذشته باشد ، آن را اجرا کنیم.

این امر در مواردی مفید است که می خواهیم وضعیت قبل از تماس با مدیر به منظور بهبود عملکرد ثبات یابد. یکی از بهترین نمونه های ردگیری که من پیدا کردم در این بلاگ توسط جی تامپکینز بود

برای رد کردن ، ما می توانیم برخی از ویژگی های صرفه جویی در خودکار را در برنامه خود داشته باشیم. با صرفه جویی خودکار در برنامه ، سعی می شود هر زمان که کاربر بروزرسانی کند یا تعامل برقرار کند ، وضعیت برنامه ما را نجات دهد. 5 ثانیه صبر می کند تا اطمینان حاصل شود که قبل از صرفه جویی در حالت دیگر ، هیچ به روزرسانی یا تعامل دیگری انجام نشده است و وضعیت جدید را ضبط می کند و روند را تکرار می کند. اگر تعامل رخ دهد ، تایمر خود را برای 5 ثانیه دوباره تنظیم می کند.

تخصیص تابع (عملکرد ، انتظار لحظه) {
    var timeout؛

    عملکرد بازگشت ()
        clearTimeout (زمان بندی)؛
        timeout = setTimeout (کارکرده ، منتظر زمان)؛
    ؛
؛

این مسئله ، چگونگی توجیه ساده است.

دریچه گاز

این تکنیک به شکلی دقیق تر نامگذاری شده است. هنگامی که به طور مداوم فراخوانی می شود ، عملکردی به کمک آن می رسد و می خواهیم آن را هر بار در هر ثانیه انجام دهد. یک مثال خوب از این امر می تواند یک کنترل کننده پیمایش یا یک اندازه گیرنده تغییر اندازه باشد ، جایی که می خواهیم یک بار در یک بازه زمانی ثابت یک بار را اجرا کنیم حتی اگر عملکرد به طور مداوم فراخوانی شود.

عملکرد دریچه گاز (عملکرد ، انتظار لحظه) {
    var timeout = null؛
    var قبلی = 0؛

    var بعد = عملکرد ()
        قبلی = Date.now ()؛
        timeout = null؛
        عملکرد ()؛
    ؛

    عملکرد بازگشت ()
        var now = Date.now ()؛
        var باقی مانده = waitTime - (اکنون - قبلی)؛
        اگر (باقیمانده <= 0 || باقی مانده> صبر کنید) {
            اگر (وقت) {
                clearTimeout (زمان بندی)؛
            }
            بعد()؛
        } other if (! timeout) {// زمان پایان صفر -> بدون اجرای معلق
            
            timeout = setTimeout (بعداً ، باقی مانده)؛
        }
    ؛
؛

اضافی: صف

همچنین در خطوط اعزام و بهره برداری ، تماسهای عملکردی نیز می توانند صف شوند. در این تابع تعداد دفعاتی که گفته می شود اجرا می شود اما قبل از اجرای هر زمان انتظار ثابت وجود دارد. این اواخر برای من مفید بود که من از یک کتابخانه استفاده می کردم و به اشکال می رسیدم که چندین بار بدون تأخیر در آن کار می کردم و باعث ایجاد مشکل می شد. (موارد استفاده دیگری نیز وجود دارد :))

صف عملکرد (عملکرد ، انتظار زمان) {
    var functionQueue = []؛
    var is Waiting؛

    var executeFunc = عملکرد (پارامترها) {
        isWaiting = true؛
        عملکرد (پارامترها)؛
        setTimeout (بازی ، انتظار)
    ؛

    var play = function ()
        isWaiting = false؛
        if (functionQueue.l طول)
            var params = functionQueue.shift ()؛
            executeFunc (پارامترها)؛
        }
    ؛

    عملکرد بازگشت (پارامترها) {
        اگر (isWaiting)
            functionQueue.push (پارامترها)؛
        } دیگه
            executeFunc (پارامترها)؛
        }
    }
؛

نتیجه گیری

قبل از تصمیم گیری در مورد روش بهینه سازی ، یک قدم عقب بردارید و فکر کنید کدام یک بهترین نتیجه را برای آن حالت خواهد داد. همیشه یکی وجود دارد که عملکرد بیشتری خواهد داشت.

لطفا در صورت تمایل پاسخ خود را ترک کنید یا با من درمورد هرگونه سؤال یا پیشنهاد قرار دهید.