مقایسه هزینه واقعی تو لایه نتورک

رو بستر وب سوکت این هزار تا ایونت کلا ۱۱۹ کیلوبایت ترافیک مصرف کرد. با اس اس ای این عدد شد ۱۳۱ کیلوبایت. اما لانگ پولینگ روی اچ تی تی پی وان (HTTP/1.1) یه فاجعه واقعی بود و ۸۸۴ کیلوبایت ترافیک ساخت. دلیل این اختلاف عجیب و غریب هم هدرهای ریکوئست‌های اچ تی تی پی هست. تو لانگ پولینگ حجم زیادی از هدرها و کوکی‌های سشن برای تک تک این هزار تا ایونت مدام ارسال میشن که فقط ۵۶۹ کیلوبایتش مربوط به همین هدرها بود.

@codehalics | کدهالیک

تاثیر پروتکل‌های جدید و تست سرعت

حالا دو تا سوال مهم پیش میاد. اول اینکه اگه بریم سمت اچ تی تی پی تو (HTTP/2) مشکل لانگ پولینگ حل میشه؟ دوم اینکه آیا وب سوکت تو واقعیت سریعتر پیام‌ها رو میرسونه؟

در مورد سوال اول باید بگم که اچ تی تی پی 2 با فشرده کردن هدرها حجم مصرفی لانگ پولینگ رو از ۸۸۴ به ۱۸۲ کیلوبایت میرسونه و اونو از یه انتخاب افتضاح به یه گزینه معمولی تبدیل میکنه. در مورد سرعت هم وقتی تو یه نتورک با دیلی ۵۰ میلی ثانیه تست کردیم، هر سه تا تکنولوژی پیام‌ها رو تو حدود ۲۶.۵ میلی ثانیه تحویل دادن و اختلافشون حتی به نیم میلی ثانیه هم نرسید. باگ لانگ پولینگ فقط اونجایی خودش رو نشون میده که سرعت تولید ایونت‌ها از زمان رفت و برگشت شبکه بیشتر باشه و پیام‌ها تو صف بمونن. از نظر مصرف مموری سرور هم هر سه تا روش تقریبا تو یه سطح هستن و باز نگه داشتن کانکشن‌ها فرق چندانی تو مصرف منابع سرور نداره.

@codehalics | کدهالیک

بالاخره کدوم رو انتخاب کنیم؟

خب با این تستایی که روی این ۱۰۰۰ تا ایونت زدیم، معماری نهایی رو چطور بچینیم؟ خیلی از تیم‌ها دیفالت میرن سراغ وب سوکت در حالی که همیشه بهترین گزینه نیست.

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


@codehalics | کدهالیک

درایو C برای ویندوز دشمن خونیه، همیشه سعی میکنه پرش کنه حتی اگر شما چیزی نصب نکنی!
و نمیتونی خالیش کنی چون نمیدونی چی پرش کرده
ولی WinDirStat میتونه!
یه ابزار ساده که بهت نشون میده دقیقا چی پر کرده درایوت رو

Zeth

https://windirstat.net/download.html

@codehalics | کدهالیک

کدنویسی در سال ۲۰۲۶ :)))

@codehalics | کدهالیک

خیلی وقتا برای هماهنگ کردن تب‌های مرورگر (مثلا وقتی کاربر تو یه تب لاگ‌اوت میکنه یا سبد خریدش رو آپدیت میکنه) میایم سراغ هک localStorage. یعنی یه دیتا مینویسیم و فورا پاک میکنیم تا ایونت storage صدا زده بشه. این روش پر از دردسره، کدهای اضافه زیادی می‌طلبه و کلا از پایه برای این کار ساخته نشده.

راه‌حل نیتیو و اصولی چیه؟ استفاده از BroadcastChannel این API دقیقا برای ارتباط مستقیم بین تب‌ها ساخته شده. نه نیازی به JSON.stringify داره، نه لازم هست ایونت‌های اضافه رو فیلتر کنید و دیتای ساختاریافته رو خیلی راحت منتقل میکنه. فقط یه کانال با اسم مشخص باز میکنید و پیامتون رو می‌فرستید:

توی تب فرستنده:

const channel = new BroadcastChannel('app-sync');
channel.postMessage({ type: 'LOGOUT' });

توی تب‌های گیرنده:

const channel = new BroadcastChannel('app-sync');
channel.onmessage = (event) => {
  console.log(event.data); // { type: 'LOGOUT' }
};

به همین راحتی و تمیزی! فقط یادتون باشه وقتی کارتون تموم شد channel.close() رو صدا بزنید تا ریسورس‌ها آزاد بشن.

@codehalics | کدهالیک

امروز یه مقاله خیلی خوب خوندم که نویسنده مقاله میگه وسط این بلبشوی هوش مصنوعی و توقعات فضایی مدیرها، بازخوانی کتاب ۲۷ ساله «اکستریم پروگرمینگ» کنت بک بدجور جواب میده. خیلیا فکر می‌کنن XP فقط یعنی پیر پروگرمنگ (کد زدن دونفره) و TDD، اما این کتاب ۲۶ تا روش عملی و ۵ تا ارزش کلیدی داره که دقیقاً درمان درد امروز ماست. الان که همه با ابزارهای AI پی‌آرهای غول‌آسا باز می‌کنن و کیفیت کد داره فدای سرعت میشه، اصول XP مثل سادگی، جلوگیری از معماری‌های پیچیده و بی‌خود، بازخورد سریع و احترام به وقت همدیگه یادمون میاره چطور کار کنیم. دلیل پیشنهاد این کتاب همینه که یاد بگیریم چطور وسط این سرعت دیوانه‌وار، کنترل کیفیت پروژه رو دستمون بگیریم و به عنوان یه مهندس زیر فشار ابزارها له نشیم.

لینک کتاب برای مطالعه :
https://refhub.ir/fa/refrence_detail/extreme-programming-explained-embrace-change/

لینک مقاله :
https://managerdotdev.beehiiv.com/p/extreme-programming-1999-2026

@codehalics | کدهالیک

این لغت یعنی XP مخفف Extreme Programming هست. یه متدولوژی خیلی معروف تو توسعه نرم‌افزاره که همون کنت بک (نویسنده کتابی که تو مقاله بود) اواخر دهه نود معرفیش کرد.

ایده اصلیش خیلی سادس: میگه بیاین پرکتیس‌های خوب مهندسی نرم‌افزار رو بگیریم و تا بالاترین حد ممکن (همون اکستریم) اجراشون کنیم. مثلا اگه معتقدیم کد ریویو کار خوبیه، پس بیایم کلا دو نفری پای یه سیستم کد بزنیم که میشه همون پیر پروگرمینگ (Pair Programming). یا اگه تست کردن جوابه، پس اول تست رو بنویسیم و بعد کدش رو بزنیم (TDD).

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

@codehalics | کدهالیک

انگولار ۲۲ با کلی تغییرات اساسی منتشر شده که مهم‌ترینش استیبل شدن Signal Forms به عنوان یه جایگزین یکپارچه و قوی برای فرم‌های قبلیه. تو این آپدیت، استراتژی تشخیص تغییرات کامپوننت‌های جدید به صورت دیفالت روی OnPush تنظیم شده و علاوه بر اجباری شدن مهاجرت به تایپ‌اسکریپت ۶، ابزارهای جدیدی هم برای تزریق وابستگی اضافه شده. یه بخش خیلی هیجان‌انگیز این نسخه، پشتیبانی آزمایشی از WebMCP هست که به ایجنت‌های هوش مصنوعی اجازه میده به جای خوندن ظاهر صفحه، مستقیم از طریق یه پروتکل با اپلیکیشنی که در حال اجراست تعامل داشته باشن.

https://angular.dev/events/v22

@codehalics | کدهالیک

یه نکته فرانتی خفن برای کسایی که خیلی از useMemo و React.memo استفاده میکنن

استفاده بی‌رویه از useMemo و React.memo بدون پروفایلینگ فقط هزینه‌ی نگهداری کد رو بالا می‌بره، چون ری‌رندر تو ری‌اکت صرفاً اجرا شدن مجدد تابع کامپوننت و ساخت ابجکت‌های جدید JSX هست و تا زمانی که فرآیند Commit و تغییرات فیزیکی DOM اتفاق نیفته، پردازش سنگینی محسوب نمیشه.

چرخه ری‌رندر کلاً سه تا تریگر داره: تغییر استیت داخلی، تغییر مقادیر context، یا دریافت ابجکت المنت جدید از والد؛ بنابراین تغییر Props به‌خودی‌خود تریگر نیست مگر اینکه کامپوننت با React.memo رپ شده باشه تا مقایسه سطحی یا Shallow Compare رو پراپس انجام بده.

برای حل مشکلات کارایی، بهینه‌سازی اول از اصلاح ساختار شروع میشه: پایین بردن محل قرارگیری استیت تا نزدیک‌ترین مصرف‌کننده و استفاده از الگوی ترکیب با children prop که باعث میشه ری‌اکت به دلیل یکسان بودن رفرنس ابجکت، کلاً فاز محاسبه زیردرخت رو Bypass کنه.

در نهایت اگه بعد از سنجش با ابزارهایی مثل Profiler یا React Scan محاسبه سنگینی دیدید، اونوقت تثبیت رفرنس با useMemo یا جداسازی با useDeferredValue معنا پیدا می‌کنه، چرا که حتی React Compiler هم فقط فرآیند ممیوایز کردن رفرنس‌های JSX رو خودکار می‌کنه و توانایی جابه‌جایی استیت یا اصلاح ساختار درخت کامپوننت رو نداره.

https://thetshaped.dev/p/react-rendering-demystified-your-usememo-probably-isnt-doing-anything

@codehalics | کدهالیک

یکمی حس میکنم ادبیاتش شاید برای کسایی که تازه کار باشن ناآشنا و سخت باشه برای همین یکمی ساده ترش میکنم :

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

امیدوارم متوجهش شده باشید که منظور دقیقا از پست قبلی چی بود !

@codehalics | کدهالیک

در یک حرکت انتحاری برای مقابله با BUZZ جک دورسی اسلک هم از فیچر جدید اسلک کد رونمایی کرده !

اسلک قابلیت Slack Code را معرفی کرده که به تیم‌ها اجازه می‌دهد ایجنت‌های هوش مصنوعی را در کانال‌های اختصاصی برای نوشتن، بررسی و انتشار کد به کار بگیرند. این قابلیت با حضور ایجنت‌هایی از جمله کلاد، چت‌جی‌پی‌تی، Devin، کوپایلوت و دیگر سرویس‌ها ارائه شده و روند کدنویسی، بازبینی و پیش‌نمایش را داخل اسلک انجام می‌دهد.

https://slack.com/features/code-channels

دیجیاتو ✍️

@codehalics | کدهالیک

توی اپیزود این هفته پادکست طبقه ۱۶ به یه نکته خیلی قشنگ اشاره شد؛ اینکه چرا الان با وجود این‌همه ایده جذاب، سرمایه‌گذارها سخت‌تر پول میدن. علت اصلیش اینه که سرمایه‌گذارها الان یه سوال سرنوشت‌ساز می‌پرسن: اگه شرکت‌های بزرگ که پول، نیروی انسانی و میلیون‌ها کاربر آماده دارن بیان عین همین ایده رو از نو بسازن، چرا باید روی تو سرمایه‌گذاری کنیم؟

خوشبختانه یا متأسفانه، هوش مصنوعی این فاصله ایده تا اجرا رو خیلی کم کرده. فرض کن یه ایده ناب داری؛ اما شرکتی مثل اسلک می‌تونه به لطف AI خیلی سریع کد بزنه و ابزار مشابهش رو بده بیرون. تا تو بخوای یوزربیس جمع کنی و فرهنگش رو بسازی، اسلک از قبل اون همه کاربر فعال رو داره.

واسه همین روی هر ایده‌ای که داریم، باید عمیقاً فکر کنیم: اگه یه شرکت خیلی بزرگ بیاد عین ایده‌مون رو بزنه چی؟ آیا می‌تونیم خودمون و بیزینسمون رو انقدر خوب پرزنت کنیم که اونا به جای اینکه وقت بذارن ایده‌مون رو دوباره بسازن، ترجیح بدن بیان خود شرکت یا ایده رو ازمون بخرن؟

@codehalics | کدهالیک

چند ماه قطعی‌های اینترنت ایران رو یادتونه؟

وسط همون روزا، یه پروژه‌ی NestJS + Prisma داشتیم که باید دیپلوی می‌شد ولی همه چی خاموش بود !

روی سیستم لوکال همه‌چی عادی بود. ولی همین که npx prisma generate رو تو Container زدیم، گیر کردیم !!
چون Prisma برای Generate کردن Client، یه Engine باینری از سرور خودش (نه npm) دانلود می‌کنه. و اون سرور رو اصلاً دسترسی نداشتیم.

یعنی یه دستور که همیشه چند ثانیه طول می‌کشید، تبدیل شد به یه مشکل واقعی که باید حلش می‌کردیم اونم بدون اینکه اینترنت بین المللی داشته باشیم.

تو این پست کامل نوشتم چطور با پیدا کردن Environment Variable درست، و آوردن Engine باینری سازگار از ریپوی خود Prisma، مشکل رو بدون نیاز به اینترنت حل کردیم:

لینک پست

@codehalics | کدهالیک

اگه این روزا استک پروژه تون NextJs هست و نمیدونین چه مدلی مناسب تره برای کد زدن بهتره که این بنچ مارک که توسط تیمشون انجام شده رو بهش یه نگاه بندازین اینطوری خیلی سیف تر و مطمئن تر روی مدل هایی که استفاده می کنید سرمایه گذاری می‌کنید!
بنچ مارک این موارد رو براتون به نسبت مدل شفاف میکنه:
-امتیازدهی‌ بر اساس نرخ موفقیت
-میانگین مدت‌زمان
-میانگین هزینه

https://nextjs.org/evals

Javad

@codehalics | کدهالیک

زبان G# یا همون جی‌شارپ یه زبان برنامه‌نویسی جدید و متن‌باز برای اکوسیستم دات‌نت هست که ساختارش رو از زبان گو الهام گرفته و می‌خواد برنامه‌نویسی سیستم و موبایل رو با کدهای سبک و امن راحت‌تر کنه. این زبان بهت اجازه میده سادگی و قابلیت‌های همزمانیِ گو مثل کانال‌ها رو در کنار مدل async و await دات‌نت داشته باشی و خیلی راحت از کتابخونه‌ها و پکیج‌های نوگت هم استفاده کنی. چون با دات‌نت ۸ تا ۱۰ سازگاره و خروجی‌های بسیار سبکی میده، هم برای کارهای ابری و وب‌اسمبلی عالیه و هم یه مسیر یادگیری خیلی خوب برای کساییه که می‌خوان از گو، سوئیفت یا کاتلین وارد دنیای دات‌نت بشن.

https://github.com/DavidObando/gsharp

@codehalics | کدهالیک

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

function Test () {
  return(<>
    <Text as="p">Hello</Text>
    <Text as="a" href="https://www.google.com">Google</Text>
</>)
}

https://kittygiraudel.com/2026/06/19/typed-polymorphic-react-component

@codehalics | کدهالیک

تو یکی از مصاحبه‌هایی که اخیرا برای پوزیشن Software Engineer تو یه شرکت خیلی خوب داخلی داشتم، یه سوال جالب ازم پرسیدن که امروز می‌خوام راجع بهش باهاتون صحبت کنم. مصاحبه‌کننده اول پرسید آیا تا به حال از ردیس استفاده کردی؟ گفتم بله. پرسید برای چه کاری؟ جواب دادم عموما برای کش کردن دیتا. بعد رسید به سوال اصلیش و گفت خب حالا بگو کلا چند تا استراتژی کشینگ موقع استفاده از ابزارهایی مثل ردیس یا مموری کش داریم؟ پاسخش رو تو پست بعدی براتون می‌ذارم ولی تا پست بعدی آماده بشه، یکم بهش فکر کنید و ببینید جواب شما به این سوال چیه.

#interview

@codehalics | کدهالیک

بچه‌ها بریم سراغ جواب اون سوال مصاحبه که قولش رو داده بودم. وقتی صحبت از استراتژی‌های کشینگ میشه، ما چند تا الگوی استاندارد داریم که بسته به سناریو و نیازمندی سیستم باید بهترینش رو انتخاب کنیم.

استراتژی اول: Cache Aside یا Lazy Loading

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

استراتژی دوم: Write Through

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


استراتژی سوم: Write Behind یا Write Back

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

در نهایت تو پروژه‌های بزرگ و معماری‌های توزیع‌شده، ما معمولا فقط به یک روش بسنده نمی‌کنیم و ترکیبی از این استراتژی‌ها رو پیاده می‌کنیم. هنر شما به عنوان طراح سیستم اینه که بر اساس بار ترافیکی و نیاز بیزینس، الگوی درست رو برای هر بخش از پروژه انتخاب کنید.

رفرنس :

https://devscape.in/blog/caching-strategies

@codehalics | کدهالیک

دوستانی که مک دارن پیشنهاد میکنم حتما این اپ رو امتحان کنین خیلی خوبه!

یه آیکون کوچیک توی منوبار که کار ده‌ها اپ پولی رو یک‌جا انجام می‌ده. رایگان، اوپن‌سورس و همه‌چیز فقط روی خود مک اجرا می‌شه (بدون اکانت، بدون ترکینگ، بدون اشتراک).

امکانات اصلیش ایناست:
• کنترل صدای جدا برای هر اپ (مثل میکسِر ویندوز)
• مانیتور کامل سیستم (CPU، GPU، رم، دما، باتری، شبکه و مصرف انرژی)
• جلوگیری از خواب مک (Keep Awake)
• سوییچر خیلی بهتر پنجره‌ها با پیش‌نمایش زنده
• تاریخچه کلیپ‌بورد + شلف فایل‌ها
• آنینستالر تمیز اپ‌ها • و کلی ابزار دیگه مثل اسکرین‌شات پیشرفته، اسنیپت متن، ویندوز اسنپ و...
ماژولاره هم هست؛ فقط چیزایی که لازم داری رو فعال می‌کنی.
اگه مک داری، حتماً یه نگاهی بهش بنداز:
http://vorssaint.com

GOODRICH ✍️

@codehalics | کدهالیک