ویرگول
ورودثبت نام
Nima Mohamadian
Nima Mohamadian
خواندن ۵ دقیقه·۵ سال پیش

آپدیت بد بینانه و خوش بینانه

اسم مقاله در نگاه اول ممکنه کمی عجیب به نظر برسه! اما در واقع ترجمه کلمه pessimistic & optimistic update است. حالا چرا آپدیت بدبینانه و خوش بینانه؟

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

آپدیت بدبینانه و خوش بینانه
آپدیت بدبینانه و خوش بینانه


خوب یک بار دیگه یوزر استوری رو تعریف کنیم :

کاربر از یک مطلب خوشش میاد و میخواد که لایک کنه . روی علامت قلب کلیک میکنه . قلب قرمز میشه و عدد قبلی که مثلا ۱۰ بود میشه ۱۱
همینطور اگه بخواهد مطلبی که لایک کرده رو دیسلایک کنه (لایک خودش رو پس بگیره) ، روی قلب قرمز کلیک میکنه و قلب میشه و عدد ۱۱ به ۱۰ تغییر میکنه.

خوب حالا میخواهیم این موضوع رو از نگاه فنی تری مورد بررسی قرار بدیم:

تعداد لایک های یک مطلب و وضعیت قبلا لایک شده کاربر مشخص ، باید جایی توی دیتابیس ذخیره شده باشه و توی سایت یا اپ اونو نمایش بدیم. خوب حالا با چه روشی باید این کارو انجام بدیم ؟‌

روش اول، آپدیت خوش بینانه:

خوب تو این روش، روند آپدیت کردن قلب و لایک به این شکل هست که به محض انجام این اکشن (لایک کردن) بدون در نظر گرفتن ارتباط با سرور و ... قلب قرمز شده و عدد ۱۰ به ۱۱ تغییر میکند. در ادامه ریکوئست از سمت فرانت به API مورد نظر زده میشه. این ریکوئست اعلام میکنه که مقدار لایک فلان مطلب یک شماره اضافه میشود.

اگر با جاواسکریپت کار کرده باشید میدونید که تابع fetch وظیفه انجام این کار رو به عهده داره . تابع fetch و یا حتی ماژول axios یک پرومیس تولید میکنند که با استفاده از then میتونیم مطمئن شیم که سرور به ما response مورد نظر رو داده. تو این روش ما کاری با جواب سرور نداریم. جدا ازینکه جواب سرور ۲۰۰ و یا ۴۰۴ و یا ۵۰۰ و ... ما مقدار لایک رو از ۱۰ به ۱۱ تغییر دادیم.
در صورتی که اگر سرور به هر دلیلی مقدار ۲۰۰ برنگردونه در واقع مقدار لایک اون مطلب روی دیتابیس هیچ تغییری نمیکنه و همون مقدار ۱۰ باقی میمونه !
کاربر لایک رو انجام میده و ۱۰ به ۱۱ تغییر میکنه اما اگر مشکلی در این بین وجود داشته باشه مقدار ۱۱ بعد از refresh کردن صفحه به همون ۱۰ (که مقدار ارسال شده از سمت دیتابیس هست ) تغییر میکنه.

روش دوم، آپدیت بدبینانه:

کاربر روی لایک کلیک میکنه و ریکوئست به سرور ارسال میشه . اگر و تنها اگر مقدار response سرور ۲۰۰ بود (یعنی همه چی درست انجام شده) مقدار جدید تعداد لایک ها که الان ۱۱ شده به کاربر نمایش داده میشه!

مقایسه روش های آپدیت خوش بینانه و بد بینانه
مقایسه روش های آپدیت خوش بینانه و بد بینانه

مقایسه دو روش:

ما نمیتونیم بگیم که کدوم روش بهتره و شما هم از همون روش استفاده کنید. هر پروژه با توجه به نیاز هایی که وجود داره و محدودیت هایی که هست نیاز به تصمیم گیری داره.

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

در مورد عمل لایک کردن در این مدل اپ ها استراتژی به این شکل هست که کاربر همون لحظه که روی قلب کلیک میکنه عملیات لایک کردن اتقاق بیوفته !
ولی توی همین اپ ها و در قسمت های دیگه تفکر دیگه ای حاکم هست که نیاز به آپدیت بدبینانه داره!


استفاده از ریداکس + دیتابس در پروژه ها

ریداکس ( و ماژول های مشابه به اون)‌ از پرکاربردترین تکنولوژی های مورد استفاده دنیای وب هستند. ما با استفاده از ریداکس در سمت فرانت اند میتونیم این جوری به سناریو دیتا فلو نگاه کنیم که :
دیتایی که میخواستیم از سمت سرور برای ما ارسال شده و در ریداکس محفوظ هست و هر زمانی که ما خواستیم میتونه از اون دیتا در جای جای برنامه استفاده کرد.

خوب حالا همون سناریو قبلی که در موردش صحبت کردیم رو با فرض وجود داشتن ریداکس بررسی کنیم:

الان موضوع پیچیده تر شد. ما یه جا سمت فرانت برای ذخیره و نمایش دیتا ها داریم ( به اسم ریداکس)
و یه جای دیگه هم به اسم دیتابیس داریم که همه دیتاهای ما اونجا دخیره میشن!
حالا تو سناریو قبلی که کاربر با لایک کردن قراره که مقدار جدید رو ببینه رو با ریداکس و دیتا بیس بررسی میکنیم:

روش اول، ِآپدیت بدبینانه:
کاربر بعد از کلیک کردن روی دکمه لایک عمل دیسپچ کردن یک اکشن رو انجام داده پس این اکشن ۲ تاثیر باید توی سیستم ما بگذاره. یکی اینکه باید اکشن اضافه کردن تعداد لایک هارو به ۱۱ افزایش بده و دومی اینکه باید ریکوئست بده به سرور و همین کارو از طریق API مورد نظر انجام بده.

روش دوم، آپدیت خوش بینانه:
کاربر بعد از کلیک کردن روی دکمه لایک یک اکشن رو انجام میده و این اکشن به صورت یک ریکوئست به سرور اتفاق میوفته و در صورتی که مقدار response سرور ۲۰۰ باشه یک اکشن به ریداکس دیسپچ میشه و مقدار ۱۰ به ۱۱ تغییر میکنه.

آپدیت خوش بینانه و بدبینانه
آپدیت خوش بینانه و بدبینانه


جمع بندی

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

تو روش دوم ما به عمل کردن اینترنت و سرور و دیتا بیس و هرچی که هست شک داریم و میخواهیم ریداکس ما همواره بعد از آپدیت شدن دیتابیس ما تغییر میکنه . پس کاربر شاهد تغییراتی هست که روی سرور هم اتفاق افتاده!


سایر مقاله های من در ویرگول:

https://virgool.io/JavaScript8/معرفی-storybookjs-ub1k1h88bda6
https://virgool.io/JavaScript8/معرفی-flow-برای-جاواسکرپیت-ogssae9iaif4
https://virgool.io/iran-react-community/ریداکس-به-زبان-ساده-emxqh7w4gnpk
https://virgool.io/@novonimo/مکمل-قردتمند-گیت-git-flow-ufhgxx6j6ah3



Contact With me:
https://t.me/nimamohamadian
https://www.facebook.com/nimamohamadian89
https://twitter.com/Nima_Mohamadian
https://www.linkedin.com/in/nima-mohamadian-57ba63123



برنامه نویسیbackendfrontenddeveloperریداکس
توسعه دهنده جاواسکریپت
شاید از این پست‌ها خوشتان بیاید