#exploring
#static
#Readonly
✳️Const vs Readonly Static
🔹Const
▫️متغیرهایی که به صورت Constant تعریف میشوند باید در هنگام تعریفشان مقدار دهی شوند و دیگر در طی طول عمر برنامه قابل تغییر نیستند. تنها type های داخلی سی شارپ را میتوان به
صورت Constant تعریف کرد. به استثنای (system.object).
تایپ های تعریف شده توسط کاربر شامل کلاس ها،struct ها و یا آرایه ها ، نمیتوانند به صورت Const تعریف شوند.
همچنین سی شارپ از متدها و پراپرتی ها و ایونت ها به صورت Const پشتیبانی نمیکند.
▪️مقادیر در متغیر های Const در
زمان compile-time شناخته و صدا زده میشوند.
▫️از Const زمانی استفاده کنید که مطمئن هستید مقدار یک متغیر در طی طول عمر اپلیکیشن تغییر نخواهد کرد.
هر متغیری که به صورت Const تعریف میشود به صورت غیر صریح static نیز تعریف خواهد شد.
▫️زمانی که کامپایلر با یک
متغیر Const مواجه میشود، مقدار آنرا مستقیما در کد IL تولید شده جایگزین میکند.
🔹Static
▫️یک عضو Static مانند : متغیرها ،متد ها و ... به Type شی تعلق دارند و از طریق نام Type در دسترس خواهد بود.
🔹ReadOnly
▫️یک فیلد ReadOnly در
زمان run-time مقدار آن ارزیابی میشود.به یک فیلد ReadOnly فقط در زمان تعریف و یا در متد سازنده کلاس دربردارنده آن میتوانید مقدار اختصاص دهید.در نتیجه این را میتوان استنباط کرد که می توان برای یک
فیلد ReadOnly در متدهای سازنده مختلف مقادیر متفاوت اختصاص داد.
🔸از اختصاص دادن مقادیر به یک فیلد Readonly برای value type ها
و reference type ها در متد سازنده چند نتیجه میتوان گرفت :
🔻در valueType ها از آنجایی که مستقیما شامل مقادیر خود هستند اگر یک فیلد به صورت ReadOnly تعریف شود immutable نیز خواهد بود.
🔻در referenceType ها که یک رفرنس به داده های خود هستند اگر یک
فیلد refrenceType
بصورت ReadOnly تعریف شود، همیشه باید به یک شی یکسان و از همان نوع اشاره کند و همچنین ReadOnly تعریف کردن آنها باعث جلوگیری از تغییر مقادیر فیلد های آن شی نمیشود.
▪️با این تعاریف به سوال اصلی خود باز میگردیم❕
❇️const vs static readonly
🔹اول از همه باید بدانیم که ویژگی های یک متغیر static readonly چیست⁉️
🔻در جایی غیر از متد سازنده static و یا در هنگام تعریف آن نمیتوانید به آن مقدار اختصاص دهید.(به خاطر readonly بودن آن)
🔻از طریق نام کلاس به آن دسترسی دارید (به خاطر static بودن آن)
🔹با این وجود در نگاه اول یک
متغیر static readonly به یک
متغیر const بسیار شبیه است زیرا یک constant فقط در هنگام تعریف می تواند مقدار بگیرد و در هیچ جای دیگری از کد مقدار آن نمیتواند تغییر کند اما تفاوت در جزئیات نهفته است.
اول از همه بدانید که یک متغیر const به جیزی ارجاع نمیکند (reference) و استفاده ار آن
به معنای hard code کردن مقدار آن میباشد .
✳️ علاوه بر اینها یک تفاوت کلیدی وجود دارد که باید از آن آگاه باشیم .همانطور که پیش تر گفتیم مقادیر یک متغیر const در کد IL جایگرین میشوند.
⚠️ اگر یک متغیر const در اسمبلی A وجود داشته باشد و اسمبلی B از اسمبلی A استفاده کند . اگر یک مقدار جدید به متغیر const موجود در اسمبلی A دهید و دوباره این اسمبلی را recompile کنید و تا زمانی که اسمبلی B را recompile نکرده اید، از همان مقدار قبلی hard code شده برای متغیر const موجود در اسمبلی A استفاده میکند.
خلاصه
🔻متغیرهای static readonly فقط میتوانند در لحظه تعریف شدن یا در متد سازنده static تغییر کنند.
🔻اگر مطمئن هستید و میدانید که مقدار یک متغیر تغییر نمیکند
از const استفاده کنید.
🔻اگر مطمئن نیستید که مقدار یک متغیر تغییر میکند یا خیر و نمیخواهید کلاس دیگری مقدار آنرا تغییر دهد
از read only استفاده کنید.
🔻متغیر های const به صورت غیر صریح static هستند.
🔻اگر میخواهید از طریق نام type به یک عضو آن دسترسی داشته باشید از static استفاده کنید.
منابع 🔍
1 - 2 -3 - 4 - 5 - 6
@FullStackDevs
#static
#Readonly
✳️Const vs Readonly Static
🔹Const
▫️متغیرهایی که به صورت Constant تعریف میشوند باید در هنگام تعریفشان مقدار دهی شوند و دیگر در طی طول عمر برنامه قابل تغییر نیستند. تنها type های داخلی سی شارپ را میتوان به
صورت Constant تعریف کرد. به استثنای (system.object).
تایپ های تعریف شده توسط کاربر شامل کلاس ها،struct ها و یا آرایه ها ، نمیتوانند به صورت Const تعریف شوند.
همچنین سی شارپ از متدها و پراپرتی ها و ایونت ها به صورت Const پشتیبانی نمیکند.
▪️مقادیر در متغیر های Const در
زمان compile-time شناخته و صدا زده میشوند.
▫️از Const زمانی استفاده کنید که مطمئن هستید مقدار یک متغیر در طی طول عمر اپلیکیشن تغییر نخواهد کرد.
هر متغیری که به صورت Const تعریف میشود به صورت غیر صریح static نیز تعریف خواهد شد.
▫️زمانی که کامپایلر با یک
متغیر Const مواجه میشود، مقدار آنرا مستقیما در کد IL تولید شده جایگزین میکند.
🔹Static
▫️یک عضو Static مانند : متغیرها ،متد ها و ... به Type شی تعلق دارند و از طریق نام Type در دسترس خواهد بود.
🔹ReadOnly
▫️یک فیلد ReadOnly در
زمان run-time مقدار آن ارزیابی میشود.به یک فیلد ReadOnly فقط در زمان تعریف و یا در متد سازنده کلاس دربردارنده آن میتوانید مقدار اختصاص دهید.در نتیجه این را میتوان استنباط کرد که می توان برای یک
فیلد ReadOnly در متدهای سازنده مختلف مقادیر متفاوت اختصاص داد.
🔸از اختصاص دادن مقادیر به یک فیلد Readonly برای value type ها
و reference type ها در متد سازنده چند نتیجه میتوان گرفت :
🔻در valueType ها از آنجایی که مستقیما شامل مقادیر خود هستند اگر یک فیلد به صورت ReadOnly تعریف شود immutable نیز خواهد بود.
🔻در referenceType ها که یک رفرنس به داده های خود هستند اگر یک
فیلد refrenceType
بصورت ReadOnly تعریف شود، همیشه باید به یک شی یکسان و از همان نوع اشاره کند و همچنین ReadOnly تعریف کردن آنها باعث جلوگیری از تغییر مقادیر فیلد های آن شی نمیشود.
▪️با این تعاریف به سوال اصلی خود باز میگردیم❕
❇️const vs static readonly
🔹اول از همه باید بدانیم که ویژگی های یک متغیر static readonly چیست⁉️
🔻در جایی غیر از متد سازنده static و یا در هنگام تعریف آن نمیتوانید به آن مقدار اختصاص دهید.(به خاطر readonly بودن آن)
🔻از طریق نام کلاس به آن دسترسی دارید (به خاطر static بودن آن)
🔹با این وجود در نگاه اول یک
متغیر static readonly به یک
متغیر const بسیار شبیه است زیرا یک constant فقط در هنگام تعریف می تواند مقدار بگیرد و در هیچ جای دیگری از کد مقدار آن نمیتواند تغییر کند اما تفاوت در جزئیات نهفته است.
اول از همه بدانید که یک متغیر const به جیزی ارجاع نمیکند (reference) و استفاده ار آن
به معنای hard code کردن مقدار آن میباشد .
✳️ علاوه بر اینها یک تفاوت کلیدی وجود دارد که باید از آن آگاه باشیم .همانطور که پیش تر گفتیم مقادیر یک متغیر const در کد IL جایگرین میشوند.
⚠️ اگر یک متغیر const در اسمبلی A وجود داشته باشد و اسمبلی B از اسمبلی A استفاده کند . اگر یک مقدار جدید به متغیر const موجود در اسمبلی A دهید و دوباره این اسمبلی را recompile کنید و تا زمانی که اسمبلی B را recompile نکرده اید، از همان مقدار قبلی hard code شده برای متغیر const موجود در اسمبلی A استفاده میکند.
خلاصه
🔻متغیرهای static readonly فقط میتوانند در لحظه تعریف شدن یا در متد سازنده static تغییر کنند.
🔻اگر مطمئن هستید و میدانید که مقدار یک متغیر تغییر نمیکند
از const استفاده کنید.
🔻اگر مطمئن نیستید که مقدار یک متغیر تغییر میکند یا خیر و نمیخواهید کلاس دیگری مقدار آنرا تغییر دهد
از read only استفاده کنید.
🔻متغیر های const به صورت غیر صریح static هستند.
🔻اگر میخواهید از طریق نام type به یک عضو آن دسترسی داشته باشید از static استفاده کنید.
منابع 🔍
1 - 2 -3 - 4 - 5 - 6
@FullStackDevs
Forwarded from Web Devs
#Caching
کشینگ (Caching) چیست؟
از جمله مواردی که استفاده درست و بجا از آن به طور قابل ملاحظه ای باعث افزایش کارایی برنامه میشود Caching میباشد.درواقع Caching مکانیزمی است که داده ها را ذخیره میکند تا درخواست های آینده برای آن داده ها سریعتر انجام شود و نتیجه به کلاینت زودتر بازگشت داده شود.داده های ذخیره شده می تواند نتیجه محاسبات قبلی یا کپی ای از داده های دیگر در جای دیگری باشد.این کار برای جلوگیری از محاسبات تکراری و یا کاهش درخواست ها به دیتابیس،برای داده هایی که امکان تغییر مداوم آنها کم است و همچنین هزینه محاسبه و یا ساخت دوباره آن زیاد است، صورت میگیرد.
خوشبخانه AspNetCore از روش های مختلف Caching پشتیبانی میکند.
از جمله این روش ها به Cache In Memory و Distributed Cache می توان اشاره کرد.
روش Cache In Memory از حافظه رم سرور برای ذخیره داده های کش شده استفاده میکند. این نوع Cache متناسب برای یک سرور است و برای استفاده از این روش زمانی که چند سرور دارید از ویژگی یا تکنینک Sticky session ( که به معنی درخواست های کلاینت به همان سروری که داده ها را Cache کرده برای پردازش Route میشوند) استفاده کرد.
از روش Distributed Cache برای share کردن داده های کش شده بین چندین سرور استفاده میشود. معمولا داده ها در یک سرور خارجی نگه داشته میشوند و دیگر سرور ها به آن دسترسی دارند.
محل قرا گیری عملیات Caching در معماری پروژه هایمان کجاست؟
معماری رایج در بین وب اپلیکیشن ها غالبا یک معماری تمیز (Clean Architecture) میباشد . و ما در این پست به قرار دادن عملیات مربوط به caching در چنین معماری هایی میپردازیم.
در این قبیل معماری ها براساس اصول طراحی و قوائد تعیین شده در DDD اپلیکیشن به لایه هایی تقسیم میشود و به ترتیب داخلی ترین لایه که Domain layer میباشد و کمترین وابستگی را به یک Dll خارجی دارد و هرچه به لایه های بالاتر میرویم وابستگی لایه ها به یکدیگر بیشتر میشود. از ویژگی های یک معماری خوب Loose Coupling در بین لایه ها میباشد یعنی وابستگی لایه ها به یکدیگر را بقدری کاهش داد که با تغییر یک لایه خللی در کار دیگر لایه ها صورت نگیرد. البته در این تعریف منظور از کاهش وابستگی یعنی کاهش وابستگی در زمان Compile time.
در یک Clean Architecture یا به عبارتی در یک Clean DDD Architecture معمولا لایه های بدین شکل خواهند بود :
1 - Domain|Core layer
2 - Services | Application Layer
3 - Infrastructure Layer
4 - UI Layer
در لایه Domain اپلیکیشن Entitiy ها و Contract ها(interface) های قرار میگیرد و در لایه Infrastructure معمولا پیاده سازی دسترسی به داده ها و دیگر سرویس ها خارجی مانند FileLogger و SmtpNotifier میباشد.این لایه امکان دسترسی و ذخیره سازی دائمی داده ها را ممکن میسازد،همچنین اطلاعات موجود Domain Entity ها در دیتابیس یا هر store دیگری به صورت دائمی در این لایه برای ذخیره، پیاده سازی میشود.از سوی دیگر ریپازیتوری های ما در این لایه پیاده سازی میشوند.(ریپازیتوری محلی است که امکان دسترسی یه اینتیتی ها و valueObject ها را فراهم میکند).
برای پیدا کردن محل درست caching باید با وظیفه یک عامل دیگر اشنا باشیم.
Repository pattern
الگوی طراحی ریپازیتوری یک روش برای انتزاعی کردن دسترسی به داده ها به جای استفاده Concrete شده از آنها میباشد.
از جمله دلیل استفاده از این الگو جلوگیری از دوباره نویسی Query ها و همچنین امکان تغییر دیتابیس یا ORM اپلیکیشن را میتوان بر شمرد.
همانطور که گفتیم ریپازیتوری راه دسترسی ما به داده هاست ، این داده ها ممکن از از دیتابیس واکشی شوند یا اینکه از Cache خوانده شوند و از آنجایی که پیاده سازی الگوی Repository در لایه Infrastructure صورت میگیرد پس در نتیجه لایه قرارگیری caching نیز در همین لایه و در ریپازیتوری میباشد .
اما پیاده سازی caching در داخل خود ریپازیتوری چند مشکل اساسی دارد، مشکل، عدم تست پذیری و نقض اصل اول Solid یعنی Single responsibility میباشد.
برای حل این مشکل یک الگوی طراحی Structural به کمک ما می آید و با پیاده سازی آن این مشکل را حل میکنیم.
در این قسمت به بررسی یک سری از مسائل پایه پرداختیم و در قسمت بعدی این پست به طریقه پیاده سازی آن خواهیم پرداخت.
@fullStackDevs
کشینگ (Caching) چیست؟
از جمله مواردی که استفاده درست و بجا از آن به طور قابل ملاحظه ای باعث افزایش کارایی برنامه میشود Caching میباشد.درواقع Caching مکانیزمی است که داده ها را ذخیره میکند تا درخواست های آینده برای آن داده ها سریعتر انجام شود و نتیجه به کلاینت زودتر بازگشت داده شود.داده های ذخیره شده می تواند نتیجه محاسبات قبلی یا کپی ای از داده های دیگر در جای دیگری باشد.این کار برای جلوگیری از محاسبات تکراری و یا کاهش درخواست ها به دیتابیس،برای داده هایی که امکان تغییر مداوم آنها کم است و همچنین هزینه محاسبه و یا ساخت دوباره آن زیاد است، صورت میگیرد.
خوشبخانه AspNetCore از روش های مختلف Caching پشتیبانی میکند.
از جمله این روش ها به Cache In Memory و Distributed Cache می توان اشاره کرد.
روش Cache In Memory از حافظه رم سرور برای ذخیره داده های کش شده استفاده میکند. این نوع Cache متناسب برای یک سرور است و برای استفاده از این روش زمانی که چند سرور دارید از ویژگی یا تکنینک Sticky session ( که به معنی درخواست های کلاینت به همان سروری که داده ها را Cache کرده برای پردازش Route میشوند) استفاده کرد.
از روش Distributed Cache برای share کردن داده های کش شده بین چندین سرور استفاده میشود. معمولا داده ها در یک سرور خارجی نگه داشته میشوند و دیگر سرور ها به آن دسترسی دارند.
محل قرا گیری عملیات Caching در معماری پروژه هایمان کجاست؟
معماری رایج در بین وب اپلیکیشن ها غالبا یک معماری تمیز (Clean Architecture) میباشد . و ما در این پست به قرار دادن عملیات مربوط به caching در چنین معماری هایی میپردازیم.
در این قبیل معماری ها براساس اصول طراحی و قوائد تعیین شده در DDD اپلیکیشن به لایه هایی تقسیم میشود و به ترتیب داخلی ترین لایه که Domain layer میباشد و کمترین وابستگی را به یک Dll خارجی دارد و هرچه به لایه های بالاتر میرویم وابستگی لایه ها به یکدیگر بیشتر میشود. از ویژگی های یک معماری خوب Loose Coupling در بین لایه ها میباشد یعنی وابستگی لایه ها به یکدیگر را بقدری کاهش داد که با تغییر یک لایه خللی در کار دیگر لایه ها صورت نگیرد. البته در این تعریف منظور از کاهش وابستگی یعنی کاهش وابستگی در زمان Compile time.
در یک Clean Architecture یا به عبارتی در یک Clean DDD Architecture معمولا لایه های بدین شکل خواهند بود :
1 - Domain|Core layer
2 - Services | Application Layer
3 - Infrastructure Layer
4 - UI Layer
در لایه Domain اپلیکیشن Entitiy ها و Contract ها(interface) های قرار میگیرد و در لایه Infrastructure معمولا پیاده سازی دسترسی به داده ها و دیگر سرویس ها خارجی مانند FileLogger و SmtpNotifier میباشد.این لایه امکان دسترسی و ذخیره سازی دائمی داده ها را ممکن میسازد،همچنین اطلاعات موجود Domain Entity ها در دیتابیس یا هر store دیگری به صورت دائمی در این لایه برای ذخیره، پیاده سازی میشود.از سوی دیگر ریپازیتوری های ما در این لایه پیاده سازی میشوند.(ریپازیتوری محلی است که امکان دسترسی یه اینتیتی ها و valueObject ها را فراهم میکند).
برای پیدا کردن محل درست caching باید با وظیفه یک عامل دیگر اشنا باشیم.
Repository pattern
الگوی طراحی ریپازیتوری یک روش برای انتزاعی کردن دسترسی به داده ها به جای استفاده Concrete شده از آنها میباشد.
از جمله دلیل استفاده از این الگو جلوگیری از دوباره نویسی Query ها و همچنین امکان تغییر دیتابیس یا ORM اپلیکیشن را میتوان بر شمرد.
همانطور که گفتیم ریپازیتوری راه دسترسی ما به داده هاست ، این داده ها ممکن از از دیتابیس واکشی شوند یا اینکه از Cache خوانده شوند و از آنجایی که پیاده سازی الگوی Repository در لایه Infrastructure صورت میگیرد پس در نتیجه لایه قرارگیری caching نیز در همین لایه و در ریپازیتوری میباشد .
اما پیاده سازی caching در داخل خود ریپازیتوری چند مشکل اساسی دارد، مشکل، عدم تست پذیری و نقض اصل اول Solid یعنی Single responsibility میباشد.
برای حل این مشکل یک الگوی طراحی Structural به کمک ما می آید و با پیاده سازی آن این مشکل را حل میکنیم.
در این قسمت به بررسی یک سری از مسائل پایه پرداختیم و در قسمت بعدی این پست به طریقه پیاده سازی آن خواهیم پرداخت.
@fullStackDevs
blog.airbrake.io
Domain-Driven Design: What is it and how do you use it?
A detailed look at domain-driven design in software development, including basic implementation and a handful of advantages and disadvantages of its use.
#Chain_posts
✳️Developer Tools Console
🔹معرفی چند متد در کنسول مرورگر که دیباگ کردن کدهای js را در وب اپلیکیشن سهل و آسان می نماید.
🔹اگر تاکنون با کنسول مرورگر کار نکرده اید و با آن اشنایی ندارید همین الان مروگر را باز کرده و در هر جایی از صفحه کلیک راست کرده گزینه INSPECT ELEMENT را انتخاب کرده و به تب CONSOLE بروید. یا با فشردن کلید های CTRL + SHIFT + J کنسول مرورگر بازمیشود.(در برخی مرورگر ها نظیر کروم با فشردن کلید های CTRL + SHIFT + I).
▫️console.log()
🔸یکی از پرکاربردترین متدهایی که هر برنامه نویس جاوا اسکریپتی حداقل یکبار از آن استفاده کرده است.برای نمایش هر نوع متغیر و ابجکتی در کنسول مرورگر از این متد استفاده میکنیم.
برای نمایش چند شئ میتوانید با ',' آنها را از هم جدا کنید. همچنین این متد در پارامتر اول فرمت نمایشی خروجی را دریافت میکند به عنوان مثال فرمت
%c
امکان استایل دهی خروجی با css را فراهم مینماید.
console.log('%cThis text is styled!', 'color: #86CC00; background-color: blue; font-size: 20px; padding: 3px;')
کد بالا پیام مشخص شده را در یک کادر آبی رنگ نمایش خواهد داد.
🔻نکته برای اجرا شدن کد ها در کنسول مرورگر بعد از نوشتن هر کد کلید ENTER را فشار دهید.اگر میخواهید کد را چند خط بنویسید برای رفتن به خط بعد بدون اجرا شدن کد کلید های SHIFT + ENTER را فشار دهید.
▫️console.assert(expression, object)
🔸این متد دو پارامتر دریافت میکند . پارامتر اول یک عبارت شرطی میباشد و پارامتر دوم یک آبجکت یا یک رشته و..
در صورتی که خروجی عبارت شرطی پاس داده این متد FALSE باشد در نتیجه پارامتر دوم در خروچی چاپ خواهد شد.
var count = 5;
console.assert(count > 10, 'count is not larger than 10');
🔻برای پاک کردن انچه تاکنون نوشته اید از console.clear() استفاده کنید.
▫️console.count(label)
🔸این متد هر بار تعداد دفعاتی که با label مشخص شده، صدا زده شده است در خروجی نمایش میدهد. label پاس داده شده کلیدی برای متمایز کرد console.count ها از یکدیگر است.
▫️console.error(object [, object, …])
🔸این متد نیز مثل متد log پارامترهای ورودی خود را در خروجی چاپ میکند با این تفاوت که حروجی به عنوان یک error علامت گذاری میشود و همچنین یک stack trace ای از محلی که این متد صدا زده شده نمایش خواهد داد.
▫️console.group(object[, object, …])
▫️console.groupEnd()
🔸برای نمایش دادن مجموعه ای ار log message ها با هم که مطعلق به یک گروه اند از این متد استفاده میکنیم. بدین ترتیب که ابتدا با استفاده از متد
console.group(object[, object, …])
یک گروه جدید ایجاد کرده و هر message log و error log بعد از ایجاد تا قبل بستن آن در یک گروه میگیرند.
console.group("webdevs");
console.log("happy")
console.log("js")
console.error("codding");
console.groupEnd();
▫️console.info(object [, object, …])
🔸این متد نیز مانند متد log برای نمایش log message های به کاربرده میشود با این تفاوت خروجی نمایش داده شده توسط این متد به عنوان یک information نشانه گذاری میشوند.
▫️console.table(data)
🔸برای نمایش یک داده ساختاری مانند (ابجکت ها ، ارایه ها و...) در قالب یک جدول از این متد استفاده میکنیم.
▫️console.time(label)
▫️console.timeEnd(label)
🔸از این متد ها برای نمایش میزان زمانی که اجرای یک قطعه کد طول میکشد استفاده میکنیم.
console.time('Draw frame');
// Execute some code...
console.timeEnd('Draw frame');
برای مشخص کردن میزان زمان اجرای یک قطعه کد دو متد time و timeEnd را در با label های همنام به عنوان پارامتر ورودی در ابتدا و انتهای قطعه کد قرار دهید.
▫️console.warn(object [, object, …])
🔸از این متد هم برای چاپ خروجی به عنوان یک warning استفاده میشود.
@FullStackDevs
✳️Developer Tools Console
🔹معرفی چند متد در کنسول مرورگر که دیباگ کردن کدهای js را در وب اپلیکیشن سهل و آسان می نماید.
🔹اگر تاکنون با کنسول مرورگر کار نکرده اید و با آن اشنایی ندارید همین الان مروگر را باز کرده و در هر جایی از صفحه کلیک راست کرده گزینه INSPECT ELEMENT را انتخاب کرده و به تب CONSOLE بروید. یا با فشردن کلید های CTRL + SHIFT + J کنسول مرورگر بازمیشود.(در برخی مرورگر ها نظیر کروم با فشردن کلید های CTRL + SHIFT + I).
▫️console.log()
🔸یکی از پرکاربردترین متدهایی که هر برنامه نویس جاوا اسکریپتی حداقل یکبار از آن استفاده کرده است.برای نمایش هر نوع متغیر و ابجکتی در کنسول مرورگر از این متد استفاده میکنیم.
برای نمایش چند شئ میتوانید با ',' آنها را از هم جدا کنید. همچنین این متد در پارامتر اول فرمت نمایشی خروجی را دریافت میکند به عنوان مثال فرمت
%c
امکان استایل دهی خروجی با css را فراهم مینماید.
console.log('%cThis text is styled!', 'color: #86CC00; background-color: blue; font-size: 20px; padding: 3px;')
کد بالا پیام مشخص شده را در یک کادر آبی رنگ نمایش خواهد داد.
🔻نکته برای اجرا شدن کد ها در کنسول مرورگر بعد از نوشتن هر کد کلید ENTER را فشار دهید.اگر میخواهید کد را چند خط بنویسید برای رفتن به خط بعد بدون اجرا شدن کد کلید های SHIFT + ENTER را فشار دهید.
▫️console.assert(expression, object)
🔸این متد دو پارامتر دریافت میکند . پارامتر اول یک عبارت شرطی میباشد و پارامتر دوم یک آبجکت یا یک رشته و..
در صورتی که خروجی عبارت شرطی پاس داده این متد FALSE باشد در نتیجه پارامتر دوم در خروچی چاپ خواهد شد.
var count = 5;
console.assert(count > 10, 'count is not larger than 10');
🔻برای پاک کردن انچه تاکنون نوشته اید از console.clear() استفاده کنید.
▫️console.count(label)
🔸این متد هر بار تعداد دفعاتی که با label مشخص شده، صدا زده شده است در خروجی نمایش میدهد. label پاس داده شده کلیدی برای متمایز کرد console.count ها از یکدیگر است.
▫️console.error(object [, object, …])
🔸این متد نیز مثل متد log پارامترهای ورودی خود را در خروجی چاپ میکند با این تفاوت که حروجی به عنوان یک error علامت گذاری میشود و همچنین یک stack trace ای از محلی که این متد صدا زده شده نمایش خواهد داد.
▫️console.group(object[, object, …])
▫️console.groupEnd()
🔸برای نمایش دادن مجموعه ای ار log message ها با هم که مطعلق به یک گروه اند از این متد استفاده میکنیم. بدین ترتیب که ابتدا با استفاده از متد
console.group(object[, object, …])
یک گروه جدید ایجاد کرده و هر message log و error log بعد از ایجاد تا قبل بستن آن در یک گروه میگیرند.
console.group("webdevs");
console.log("happy")
console.log("js")
console.error("codding");
console.groupEnd();
▫️console.info(object [, object, …])
🔸این متد نیز مانند متد log برای نمایش log message های به کاربرده میشود با این تفاوت خروجی نمایش داده شده توسط این متد به عنوان یک information نشانه گذاری میشوند.
▫️console.table(data)
🔸برای نمایش یک داده ساختاری مانند (ابجکت ها ، ارایه ها و...) در قالب یک جدول از این متد استفاده میکنیم.
▫️console.time(label)
▫️console.timeEnd(label)
🔸از این متد ها برای نمایش میزان زمانی که اجرای یک قطعه کد طول میکشد استفاده میکنیم.
console.time('Draw frame');
// Execute some code...
console.timeEnd('Draw frame');
برای مشخص کردن میزان زمان اجرای یک قطعه کد دو متد time و timeEnd را در با label های همنام به عنوان پارامتر ورودی در ابتدا و انتهای قطعه کد قرار دهید.
▫️console.warn(object [, object, …])
🔸از این متد هم برای چاپ خروجی به عنوان یک warning استفاده میشود.
@FullStackDevs
#CoronaVirus
#Covid_19
#javascript
#java
#fun
The different between java and javascript is the same as corona beer and Corona virus ! 😷
@fullStackDevs
#Covid_19
#javascript
#java
#fun
The different between java and javascript is the same as corona beer and Corona virus ! 😷
@fullStackDevs
#javascript
#Immediately_Invoked_Function_Expression
#IIFE
❇️ Immediately-Invoked Function Expression (IIFE)
▫️در ابتدا باید بدانید که تفاوت بین expression و statement چیست⁉️
🔹اصلی ترین تفاوت میان statement و expression این است که یک expression را میتوانید به یک متغیر assign کنید.
✳️ در این پست به معرفی و تعریف نوعی از فانکشن های جاوا اسکریپ میپردازیم که به آنها "فانکشن های فوری صدا شونده" می گویند .به اختصار IIFE.
🔸 دو دلیل عمده برای استفاده از این نوع توابع وجود دارد.
🔻 محدود کردن scope متغیر ها
🔻 اجرای فوری و بلافاصله فانکشن بعد تعریف شدن آن.
▫️در ادامه به شرح هریک از دو علت خواهیم پرداخت.
🔹معمول ترین syntax تعریف این نوع فانکشن ها بدین صورت است :
(
//output "Hello!"
🔸 در مثال بالا پرانتز های بیرونی () که (function IIFE(){ .. }) را احاطه کرده است باعث میشوند که فانکشن داخلی آنها برای جاوا اسکریپت به عنوان یک expression در نظر گرفته شود و به مانند یک statement و یک تابع معمولی رفتار نکند.
🔸 پرانتز نهایی () در انتهای expression بالا برای آن است که فانکشن تعریف شده را بلافاصه بعد تعریف شدن صدا زده و اجرا کند.
❇️ تعریف کردن فانکشن ها باعث به وجود آمدن scope های جدید میشود و از آنجایی که IIFE یک فانکشن است تعریف کردن یک IIFE جدید باعث به وجود امدن یک scope جدید میشود اما scope به وجود امده قوانین محصور کننده ای دارد یعنی متغیر های تعریف شده در این scope بروی سایر کد های خارج از آن تاثیری ندارد و خارج از آن قابل دسترس نیستند.
▫️ حال که از ماهیت یک IIFE اگاه شدیم بیایید به syntax های مختلف تعریف یک IIFE بپردازیم.
🔸 پیشتر با معمول ترین روش تعریف آن آشنا شدیم . روش دیگری که برای تعریف یک IIFE وجود دارد به صورت زیر است
!
🔻نکته قابل توجه در مثال بالا پیشوند '!' در ابتدای تعریف فانکشن است .به طور کلی '!' در ابتدای فانکشن مثال قبل جاوا اسکریپت را مجبور میکند که هر چیزی که بعد آن بیاید را به عنوان یک expression در نظر بگیرد.
🔹 در نتیجه در مثال بالا یک IIFE جدید تعریف کردیم که بلافاصله بعد تعریف شدن صدا زده شده و اجرا میشود.
🔻 همچنین میتوانید به جای '!' از '+' , '-' , '~' و یا هر unary operator دیگری استفاده کنید.
🔻یک unary operator عملگری است که تنها یک عملوند دریافت میکند و روی آن عملیاتی انجام میدهد.
▫️ همچنین روشی دیگر برای تعریف IIFE وجود دارد.
void
🔸 در این مثال ' void ' برای مجبور کردن جاوا اسکریت برای در نظر گرفتن فانکشن بعد از آن به عنوان یک expression است.
🔻 نکته خیلی مهم در مورد این نوع syntax های تعریف IIFE این است که فانکشن نمیتواند مقدار خروجی داشته باشد❕❕
❇️ برای اینکه یک IIFE بتواند یک مقدار خروجی را بازگرداند باید به صورت اولین مثال که پیشتر تعریف شد یا به صورت زیر تعریف شود.
(
(
🔹 همچنین میتوانید به یک IIFE پارامتر پاس دهید
(
console.log(msg);
}
✳️ در این پست به معرفی IIFE پرداختیم که کاربر های فروانی دارد.
✳️ لطفا این پست را با دوستان خود به اشتراک بگذارید
▫️Happy Js Coding😉
@FullStackDevs
#Immediately_Invoked_Function_Expression
#IIFE
❇️ Immediately-Invoked Function Expression (IIFE)
▫️در ابتدا باید بدانید که تفاوت بین expression و statement چیست⁉️
🔹اصلی ترین تفاوت میان statement و expression این است که یک expression را میتوانید به یک متغیر assign کنید.
✳️ در این پست به معرفی و تعریف نوعی از فانکشن های جاوا اسکریپ میپردازیم که به آنها "فانکشن های فوری صدا شونده" می گویند .به اختصار IIFE.
🔸 دو دلیل عمده برای استفاده از این نوع توابع وجود دارد.
🔻 محدود کردن scope متغیر ها
🔻 اجرای فوری و بلافاصله فانکشن بعد تعریف شدن آن.
▫️در ادامه به شرح هریک از دو علت خواهیم پرداخت.
🔹معمول ترین syntax تعریف این نوع فانکشن ها بدین صورت است :
(
function IIFE(){
console.log( "Hello!" );})();//output "Hello!"
🔸 در مثال بالا پرانتز های بیرونی () که (function IIFE(){ .. }) را احاطه کرده است باعث میشوند که فانکشن داخلی آنها برای جاوا اسکریپت به عنوان یک expression در نظر گرفته شود و به مانند یک statement و یک تابع معمولی رفتار نکند.
🔸 پرانتز نهایی () در انتهای expression بالا برای آن است که فانکشن تعریف شده را بلافاصه بعد تعریف شدن صدا زده و اجرا کند.
❇️ تعریف کردن فانکشن ها باعث به وجود آمدن scope های جدید میشود و از آنجایی که IIFE یک فانکشن است تعریف کردن یک IIFE جدید باعث به وجود امدن یک scope جدید میشود اما scope به وجود امده قوانین محصور کننده ای دارد یعنی متغیر های تعریف شده در این scope بروی سایر کد های خارج از آن تاثیری ندارد و خارج از آن قابل دسترس نیستند.
▫️ حال که از ماهیت یک IIFE اگاه شدیم بیایید به syntax های مختلف تعریف یک IIFE بپردازیم.
🔸 پیشتر با معمول ترین روش تعریف آن آشنا شدیم . روش دیگری که برای تعریف یک IIFE وجود دارد به صورت زیر است
!
function() {
alert("Hello from IIFE!");}();🔻نکته قابل توجه در مثال بالا پیشوند '!' در ابتدای تعریف فانکشن است .به طور کلی '!' در ابتدای فانکشن مثال قبل جاوا اسکریپت را مجبور میکند که هر چیزی که بعد آن بیاید را به عنوان یک expression در نظر بگیرد.
🔹 در نتیجه در مثال بالا یک IIFE جدید تعریف کردیم که بلافاصله بعد تعریف شدن صدا زده شده و اجرا میشود.
🔻 همچنین میتوانید به جای '!' از '+' , '-' , '~' و یا هر unary operator دیگری استفاده کنید.
🔻یک unary operator عملگری است که تنها یک عملوند دریافت میکند و روی آن عملیاتی انجام میدهد.
▫️ همچنین روشی دیگر برای تعریف IIFE وجود دارد.
void
function() {
alert("Hello from IIFE!");}();🔸 در این مثال ' void ' برای مجبور کردن جاوا اسکریت برای در نظر گرفتن فانکشن بعد از آن به عنوان یک expression است.
🔻 نکته خیلی مهم در مورد این نوع syntax های تعریف IIFE این است که فانکشن نمیتواند مقدار خروجی داشته باشد❕❕
❇️ برای اینکه یک IIFE بتواند یک مقدار خروجی را بازگرداند باید به صورت اولین مثال که پیشتر تعریف شد یا به صورت زیر تعریف شود.
(
function() {
return "From IIFE";} () ); (
function() {
return "From IIFE";}) () ;🔹 همچنین میتوانید به یک IIFE پارامتر پاس دهید
(
function IIFE(msg, times) {
for (var i = 1; i <= times; i++) {console.log(msg);
}
}("Hello!", 5));✳️ در این پست به معرفی IIFE پرداختیم که کاربر های فروانی دارد.
✳️ لطفا این پست را با دوستان خود به اشتراک بگذارید
▫️Happy Js Coding😉
@FullStackDevs
This media is not supported in your browser
VIEW IN TELEGRAM
#GitHub
#Mobile
GitHub Mobile is officially leaving beta and entering general availability today. Learn more and download: https://github.com/mobile/
@fullStackDevs
#Mobile
GitHub Mobile is officially leaving beta and entering general availability today. Learn more and download: https://github.com/mobile/
@fullStackDevs
#css
CSS Custom Properties
Learn CSS Variables in 5 minutes - A tutorial for beginners
read more
@fullStackDevs
CSS Custom Properties
Learn CSS Variables in 5 minutes - A tutorial for beginners
read more
@fullStackDevs
#DI
#Ioc
#DIP
#SOLID
✳️ Captive Dependency
🔹 در این پست به توضیح مشکلی میپردازیم که معمولا به دلیل اشتباه کانفیگ کردن سرویس های اپلیکیشن در IOC Container رخ میدهد.
🔸 تزریق وابستگی (Dependency Injection) از مفاهیم مهمی هست که باید به آن آشنا باشیم. برای استفاده از این مفهوم و مفاهیم مرتبط با آن مثل IOC ,DIP
در اپلیکیشن، ابزار ها یا فریم وورک هایی وجود دارند که به آنها IOC Container می گوییم.
🔻اگر با DI و IOC و DIP آشنا نیستید مقالات لینک شده را مطالعه کنید.
🔸مدیریت lifeTime سرویس های اپلیکیشن امری است که به کمک IOC Container مقدر میشود اما وظیفه register کردن و معرفی کردن وابستگی ها به IOC Container بر عهده Developer میباشد.
🔸 اشتباه کانفیگ کردن lifeTime برای سرویسی در اپلیکیشن، که خود دارای وابستگی هایی، با lifeTime ای کمتر از lifeTime سرویس اصلی هستند، باعث به وجود آمد مشکل Captive Dependency میشود.
🔹 برای درک مسئله به مثال زیر توجه کنید
فرض کنید دو کلاس با نام های
ScopedDependency
SingletonDependency
داریم.
🔸 همانطور که از نام ها مشخص است کلاس SingletonDependency به صورت Singleton به DI Contaner معرفی شده و در طول عمر اپلیکیشن فقط یک نمونه از آن ساخته میشود.
🔸 کلاس ScopedDependency هم به صورت Scoped در IOC Container معرفی شده و به ازای هر connection به سرور فقط یک نمونه از آن به ازای هر کانکشن و درخواست ساخته میشود.
🔸 بیایید فرض کنیم که چه اتفاقی می افتد اگر کلاس SingletonDependency برای انجام برخی کارها در درون خود به کلاس ScopedDependency وابسته باشد و ما نیاز داشته باشیم که کلاس ScopedDependency در درون آن تزریق کنیم.
🔹 با رجیستر کردن کلاس ScopedDependency بصورت Scoped انتظار این است که روند نمونه سازی از این کلاس Scoped گونه باشد. اما وقتی این کلاس را در یک کلاس دیگر که به صورت Singleton رجیستر شده است تزریق میکنید، قوائد بازی را برهم زده و باعث میشوید که کلاس Singleton مورد نظر در تمام طول عمر خود فقط از یک نمونه قدیمی از وابستگی خود استفاده کند. این نمونه قدیمی برای اولین بار در هنگام ساخته شدن کلاس Singleton ای که در درون آن وجود دارد ساخته شده و به زندگی خود به لطف حضور در یک کلاس Singleton ادامه میدهد.
پس در نتیجه برای SingletonDepedency ما فقط یک نمونه از ScopedDependency ساخته میشود و در تمام طول عر خود از همان نمونه قدیمی استفاده میکند.
🔸در نگاه اول شاید این مشکل حاد به نظر نرسد اما باید بدانید که در یک پروژه که پیچیدگی های خاص خود را دارد باعث بروز مشکلات و باگ های فاحش خواهد شد.
🔸 این مشکل توسط Developer با اشتباه کانفیگ کردن lifeTime برای سرویس های اپلیکیشن رخ میدهد و حتی IOC Container هایی مانند Autofac نمی توانند از آن جلوگیری کنند.
اما IOC Container پیشفرض Asp.Net Core سعی کرده است تا حدی از این مشکل جلوگیری کند.
🔸 فعال سازی این ویژگی برای IOC Container پیشفرض اختیاری بوده و در صورت فعال سازی آن، نکته ای که باعث بهبود performance میشود این است که فقط در محیط و هنگام Development از آن استفاده کنید.
🔻همچنین باید بدانید که این ویژگی فقط از بروز Captive Dependency برای سرویس هایی که به صورت Scoped رجیستر شده اند، جلوگیری میکند و باعث صادر شدن استثنای InvalidOperationException میشود. و برای سرویس های که به صورت Transient رجیستر شده اند کار نمیکند.
❇️ برای فعال سازی این ویژگی در کلاس Program بدین شکل عمل کنید.
public class Program
{
public static void Main(string[] args)
{
CreateHostBuilder(args).Build().Run();
}
public static IHostBuilder CreateHostBuilder(string[] args) =>
Host.CreateDefaultBuilder(args)
.ConfigureWebHostDefaults(webBuilder =>
{
webBuilder.UseStartup<Startup>();
})
.UseDefaultServiceProvider((env, c) =>
{
if (env.HostingEnvironment.IsDevelopment())
{
c.ValidateScopes = true;
}
});
}
@FullStackDevs
#Ioc
#DIP
#SOLID
✳️ Captive Dependency
🔹 در این پست به توضیح مشکلی میپردازیم که معمولا به دلیل اشتباه کانفیگ کردن سرویس های اپلیکیشن در IOC Container رخ میدهد.
🔸 تزریق وابستگی (Dependency Injection) از مفاهیم مهمی هست که باید به آن آشنا باشیم. برای استفاده از این مفهوم و مفاهیم مرتبط با آن مثل IOC ,DIP
در اپلیکیشن، ابزار ها یا فریم وورک هایی وجود دارند که به آنها IOC Container می گوییم.
🔻اگر با DI و IOC و DIP آشنا نیستید مقالات لینک شده را مطالعه کنید.
🔸مدیریت lifeTime سرویس های اپلیکیشن امری است که به کمک IOC Container مقدر میشود اما وظیفه register کردن و معرفی کردن وابستگی ها به IOC Container بر عهده Developer میباشد.
🔸 اشتباه کانفیگ کردن lifeTime برای سرویسی در اپلیکیشن، که خود دارای وابستگی هایی، با lifeTime ای کمتر از lifeTime سرویس اصلی هستند، باعث به وجود آمد مشکل Captive Dependency میشود.
🔹 برای درک مسئله به مثال زیر توجه کنید
فرض کنید دو کلاس با نام های
ScopedDependency
SingletonDependency
داریم.
🔸 همانطور که از نام ها مشخص است کلاس SingletonDependency به صورت Singleton به DI Contaner معرفی شده و در طول عمر اپلیکیشن فقط یک نمونه از آن ساخته میشود.
🔸 کلاس ScopedDependency هم به صورت Scoped در IOC Container معرفی شده و به ازای هر connection به سرور فقط یک نمونه از آن به ازای هر کانکشن و درخواست ساخته میشود.
🔸 بیایید فرض کنیم که چه اتفاقی می افتد اگر کلاس SingletonDependency برای انجام برخی کارها در درون خود به کلاس ScopedDependency وابسته باشد و ما نیاز داشته باشیم که کلاس ScopedDependency در درون آن تزریق کنیم.
🔹 با رجیستر کردن کلاس ScopedDependency بصورت Scoped انتظار این است که روند نمونه سازی از این کلاس Scoped گونه باشد. اما وقتی این کلاس را در یک کلاس دیگر که به صورت Singleton رجیستر شده است تزریق میکنید، قوائد بازی را برهم زده و باعث میشوید که کلاس Singleton مورد نظر در تمام طول عمر خود فقط از یک نمونه قدیمی از وابستگی خود استفاده کند. این نمونه قدیمی برای اولین بار در هنگام ساخته شدن کلاس Singleton ای که در درون آن وجود دارد ساخته شده و به زندگی خود به لطف حضور در یک کلاس Singleton ادامه میدهد.
پس در نتیجه برای SingletonDepedency ما فقط یک نمونه از ScopedDependency ساخته میشود و در تمام طول عر خود از همان نمونه قدیمی استفاده میکند.
🔸در نگاه اول شاید این مشکل حاد به نظر نرسد اما باید بدانید که در یک پروژه که پیچیدگی های خاص خود را دارد باعث بروز مشکلات و باگ های فاحش خواهد شد.
🔸 این مشکل توسط Developer با اشتباه کانفیگ کردن lifeTime برای سرویس های اپلیکیشن رخ میدهد و حتی IOC Container هایی مانند Autofac نمی توانند از آن جلوگیری کنند.
اما IOC Container پیشفرض Asp.Net Core سعی کرده است تا حدی از این مشکل جلوگیری کند.
🔸 فعال سازی این ویژگی برای IOC Container پیشفرض اختیاری بوده و در صورت فعال سازی آن، نکته ای که باعث بهبود performance میشود این است که فقط در محیط و هنگام Development از آن استفاده کنید.
🔻همچنین باید بدانید که این ویژگی فقط از بروز Captive Dependency برای سرویس هایی که به صورت Scoped رجیستر شده اند، جلوگیری میکند و باعث صادر شدن استثنای InvalidOperationException میشود. و برای سرویس های که به صورت Transient رجیستر شده اند کار نمیکند.
❇️ برای فعال سازی این ویژگی در کلاس Program بدین شکل عمل کنید.
public class Program
{
public static void Main(string[] args)
{
CreateHostBuilder(args).Build().Run();
}
public static IHostBuilder CreateHostBuilder(string[] args) =>
Host.CreateDefaultBuilder(args)
.ConfigureWebHostDefaults(webBuilder =>
{
webBuilder.UseStartup<Startup>();
})
.UseDefaultServiceProvider((env, c) =>
{
if (env.HostingEnvironment.IsDevelopment())
{
c.ValidateScopes = true;
}
});
}
@FullStackDevs
#multithread
#multitask
#thread
#task
#async
✳️ Multitasking vs Multithreading
🔻آیا تا به حال مدت ها منتظر کسی یا کاری بوده اید ، در حالی که هیچ کاری انجام نمی دهید و فکر می کنید که می توانستید کار دیگری انجام دهید؟ این زمانی است که اهمیت multithreading را درک می کنید. انتظار وقتی آسانتر می شود که بتوانید کارهای دیگری را انجام دهید در حالی که منتظر کسی یا چیز دیگری هستید. برای روشن تر شدن مفهوم چند وظیفه ای ، مادر خود را در نظر بگیرید. از زمان به دنیا آمدن ، من مادرم را دیده ام که همزمان چندین کار را انجام می دهد و همیشه تعجب می کنم که او چگونه این کار را انجام می دهد؟ او خانه را تمیز می کند ، لباس های می شوید و همزمان غذا را آماده می کند.
▪️در برنامه نویسی ، شما با وضعیت های بسیاری روبرو میشوید که مجبور می شوید از multithreading و multitasking استفاده کنید.
به عنوان مثال ، هنگام خواندن یک file بزرگ ، بهتر است به کاربر اجازه دهید کارهای دیگری انجام دهد. از این رو ، چه تفاوتی بین multithreading و multitasking وجود دارد؟ آیا آنها یکسان هستند؟
🔸Multitasking
به این معنی است که به کاربر اجازه می دهد چندین task را همزمان انجام دهد. کاربر می تواند ضمن نوشتن یک وبلاگ ، به موسیقی در حال اجرا در پس زمینه گوش دهد. بنابراین کامپیوتر چندین کار را برای کاربر انجام می دهد. هر task به منابع نیاز دارد. از آنجا که کامپیوتر از منابع محدودی برخوردار است ، تعداد کارهای انجام شده در همان زمان نیز محدود است.
🔹Multithreading
ترد ها مربوط به بالاترین سطح کد اجرا شده توسط یک پردازنده هستند ، بنابراین با بسیاری از تردها، سی پی یو شما می تواند همزمان چندین کار را انجام دهد. تمام CPU ها تردهای فعال دارند و هر فرایندی که در رایانه شما انجام می شود حداقل یک ترد واحد دارد.
ترد برای انجام task های متعدد استفاده می شود. هر task می تواند چندین thread داشته باشد. در یک برنامه multithreaded کاربر می تواند در مدت زمان کوتاتر نسبت به یک برنامه single thread کارهای بیشتری انجام دهد. امروزه تقریباً در هر برنامه
از multiple threading استفاده شده است. یک برنامه یا یک process می تواند یک user interface thread داشته باشد که در تعامل با کاربر باشد
و background worker threads که کارهای دیگری را انجام می دهند.
🔵 حال می بینیم که چگونه multithreading و multitasking در C # کار می کند.
▪️یک task چیزی است که شما می خواهید انجام شود. ترد یکی از موارد ممکن است که آن task را انجام میدهد.
▫️در دات نت Task یک عملیات واحد را نشان می دهد و معمولاً بصورت غیر همزمان (asynchronous) انجام می شود.
▪️تسک آبجکت Task Object ها یکی از کامپوننت های اصلی task-based asynchronous pattern است که برای اولین بار در .NET Framework 4 معرفی شده است.
▫️ کارهایی که توسط یک task انجام می شود به طور معمول بصورت غیر همزمان برروی
یک thread از threadpool اجرا می شود. تسک ها برای پردازنده های چند هسته ای تنظیم شده اند.
▪️تسک Task ها توسط task library تنظیم می شوند تا از thread های threadpool به روشی بسیار کارآمدتر از زمانی که خود از thread استفاده میکنید ،استفاده میکند.
ایجاد thread بسیار گران است ، Task ها صف خواهند شد و از thread ها استفاده مجدد میشود. بنابراین هنگامی که مثلا از یک thread در انتظار network I/O است ، در واقع می توان از آن برای اجرای یک کار دیگر استفاده کرد. شما فقط می توانید تعداد thread هایی را که با تعداد هسته پردازنده شما مطابقت دارد ، اجرا کنید (به طور همزمان)
همیشه سعی کنید از task استفاده کنید و اگر با مشکلی روبرو هستید که باعث می شود خودتان بخواهید thread را کنترل کنید (احتمالاً 1٪) سپس از thread ها استفاده کنید.
@fullStackDevs
#multitask
#thread
#task
#async
✳️ Multitasking vs Multithreading
🔻آیا تا به حال مدت ها منتظر کسی یا کاری بوده اید ، در حالی که هیچ کاری انجام نمی دهید و فکر می کنید که می توانستید کار دیگری انجام دهید؟ این زمانی است که اهمیت multithreading را درک می کنید. انتظار وقتی آسانتر می شود که بتوانید کارهای دیگری را انجام دهید در حالی که منتظر کسی یا چیز دیگری هستید. برای روشن تر شدن مفهوم چند وظیفه ای ، مادر خود را در نظر بگیرید. از زمان به دنیا آمدن ، من مادرم را دیده ام که همزمان چندین کار را انجام می دهد و همیشه تعجب می کنم که او چگونه این کار را انجام می دهد؟ او خانه را تمیز می کند ، لباس های می شوید و همزمان غذا را آماده می کند.
▪️در برنامه نویسی ، شما با وضعیت های بسیاری روبرو میشوید که مجبور می شوید از multithreading و multitasking استفاده کنید.
به عنوان مثال ، هنگام خواندن یک file بزرگ ، بهتر است به کاربر اجازه دهید کارهای دیگری انجام دهد. از این رو ، چه تفاوتی بین multithreading و multitasking وجود دارد؟ آیا آنها یکسان هستند؟
🔸Multitasking
به این معنی است که به کاربر اجازه می دهد چندین task را همزمان انجام دهد. کاربر می تواند ضمن نوشتن یک وبلاگ ، به موسیقی در حال اجرا در پس زمینه گوش دهد. بنابراین کامپیوتر چندین کار را برای کاربر انجام می دهد. هر task به منابع نیاز دارد. از آنجا که کامپیوتر از منابع محدودی برخوردار است ، تعداد کارهای انجام شده در همان زمان نیز محدود است.
🔹Multithreading
ترد ها مربوط به بالاترین سطح کد اجرا شده توسط یک پردازنده هستند ، بنابراین با بسیاری از تردها، سی پی یو شما می تواند همزمان چندین کار را انجام دهد. تمام CPU ها تردهای فعال دارند و هر فرایندی که در رایانه شما انجام می شود حداقل یک ترد واحد دارد.
ترد برای انجام task های متعدد استفاده می شود. هر task می تواند چندین thread داشته باشد. در یک برنامه multithreaded کاربر می تواند در مدت زمان کوتاتر نسبت به یک برنامه single thread کارهای بیشتری انجام دهد. امروزه تقریباً در هر برنامه
از multiple threading استفاده شده است. یک برنامه یا یک process می تواند یک user interface thread داشته باشد که در تعامل با کاربر باشد
و background worker threads که کارهای دیگری را انجام می دهند.
🔵 حال می بینیم که چگونه multithreading و multitasking در C # کار می کند.
▪️یک task چیزی است که شما می خواهید انجام شود. ترد یکی از موارد ممکن است که آن task را انجام میدهد.
▫️در دات نت Task یک عملیات واحد را نشان می دهد و معمولاً بصورت غیر همزمان (asynchronous) انجام می شود.
▪️تسک آبجکت Task Object ها یکی از کامپوننت های اصلی task-based asynchronous pattern است که برای اولین بار در .NET Framework 4 معرفی شده است.
▫️ کارهایی که توسط یک task انجام می شود به طور معمول بصورت غیر همزمان برروی
یک thread از threadpool اجرا می شود. تسک ها برای پردازنده های چند هسته ای تنظیم شده اند.
▪️تسک Task ها توسط task library تنظیم می شوند تا از thread های threadpool به روشی بسیار کارآمدتر از زمانی که خود از thread استفاده میکنید ،استفاده میکند.
ایجاد thread بسیار گران است ، Task ها صف خواهند شد و از thread ها استفاده مجدد میشود. بنابراین هنگامی که مثلا از یک thread در انتظار network I/O است ، در واقع می توان از آن برای اجرای یک کار دیگر استفاده کرد. شما فقط می توانید تعداد thread هایی را که با تعداد هسته پردازنده شما مطابقت دارد ، اجرا کنید (به طور همزمان)
همیشه سعی کنید از task استفاده کنید و اگر با مشکلی روبرو هستید که باعث می شود خودتان بخواهید thread را کنترل کنید (احتمالاً 1٪) سپس از thread ها استفاده کنید.
@fullStackDevs
#AsynchronousProgramming
#Async #Await
#Tasks
✳️ Async/Await on a Separate Thread
🔸 اجرای عملیات های long-running به صورت غیر همزمان (asynchronous) در سی شارپ با mark کردن آنها با استفاده از کلمه کلیدی های async/await انجام میشود.
🔹 متد هایی که یک Task را به عنوان خروجی باز میگردانند با استفاده از این کلمه کلیدی ها به صورت غیر همزمان اجرا میشوند.
درواقع از await میتوان به همراه یک awaitable argument استفاده کرد که یک عملیات asynchronous است.
دو نوع رایج awaitable argument ها در دات نت ،
Task , Task<T>
میباشد.
🔹 اجرای متدهای long-running به صورت همزمان (synchronous)، باعث بلاک شدن thread جاری تا زمان اتمام آن متد میشود.
🔹همچنین در اپلیکیشن هایی که رابط گرافیکی کاربری دارید اجرای متد های long-running به صورت همزمان، سبب بلاک شدن thread اجرا کننده رابط گرافیکی (UI) میشود و تا زمان اتمام اجرای آن متد رابط کاربری به صورت فریز شده باقی میماند.
اما چنین متدی که خروجی آن یک Task نیست و نمیتوان آنرا با استفاده از async و await به صورت asynchronous اجرا کرد، را چگونه به یک متد asynchronous تبدیل کنیم تا در یک thread جدا اجرا شود.
اینجاست که Task.Run به کمک ما می آید.
🔸 متد Run از کلاس Task باعث اجرا شدن کد های صف شده در یک thread جدا میشود.
معمولا این thread جدید ازthread pool می آید .
▫️ در واقع thread pool مجموعه ای از worker thread هایی است که توسط .net برای اجرای اپلیکیشن، مدیریت میشوند.
▫️ هم چنین یک worker thread یک thread ای است که به درخواست یک client برای انجام کاری فعال میشود.
🔹 مهمترین نکته این که Task.Run به عنوان خروجی یک Task باز میگرداند که این بدین معنی است که می توانید آنرا await کنید.
متد Task.Run دارای overload های متفاوتی است که به عنوان پارامتر یک Action delegate یا یک Func delegate دریافت میکند.
🔸 تاکنون دانستیم که صدا زدن متد Task.Run برای اجرای یک متد long-running باعث اجرا شدن این متد بروی یک thread جدید در thread pool میشود اما پس از اتمام اجرای این متد long-running بقیه و ادامه کد ها بروی کدامین thread اجرا خواهد شد⁉️
🔸 در اکثر مواقع می خواهیم تا ادامه کار بروی thread اصلی ادامه پیدا کند مخصوصا زمانی که اپلیکیشن دارای یک رابط کاربری گرافیکی میباشد و میخواهیم بعد از انجام شدن آن متد long-running عناصری را بروی رابط گرافیکی در thread اصلی آپدیت نماییم. برای آنجام این کار کافیست Task.Run را await نمایید زیرا زمانی که که یک Task را await می کنید اطلاعات context جاری از SynchronizationContext گرفته میشود تا دوباره به thread اصلی اپلیکیشن باز گردد.
🔻زمانی که روی یک متد ای که به صورت Async اجرا میشود ConfigureAwait(
🔹 اما SynchronizationContext چیست و کار آن چه میباشد؟
🔸 هنگامی که با یک اپلیکیشن UI based کار میکنید وابستگی و ارتباط بین thread ها مسئله بسیار مهمی است
زمانی که با چنین اپلیکیشن هایی کار میکنید محدودیتی که وجود دارد این است که عناصر و کنترلر های صفحه توسط UI thread ساخته شده یا تغییر و آپدیت شوند و اگر نیاز باشد که به عنوان مثال 10 تغییر بروی عناصر صفحه صورت گیرد، این عملیات ها در صف قرار میگیرند تا به صورت متوالی توسط UI thread انجام شوند.
این محدودیت برای کمک به UI framework جهت جلوگیری از پیچیدگی های هماهنگی و مدیریت بین thread های مختلف برای آپدیت عناصر و کنترلر های صفحه صورت گرفته است.
و SynchronizationContext ارتباط با UI thread را به صورت منظم مرتب میکند.
در Asp.net Core اما SynchronizationContext برایر null میباشد.
✳️ درا این قسمت یک overview در مورد Task.Run پرداختیم تا در قسمت بعدی به عملیات های I/O و CPU bound پرداخته و با مفاهیم Asynchronous بیشتر آشنا میشویم.
@FullStackDevs
#Async #Await
#Tasks
✳️ Async/Await on a Separate Thread
🔸 اجرای عملیات های long-running به صورت غیر همزمان (asynchronous) در سی شارپ با mark کردن آنها با استفاده از کلمه کلیدی های async/await انجام میشود.
🔹 متد هایی که یک Task را به عنوان خروجی باز میگردانند با استفاده از این کلمه کلیدی ها به صورت غیر همزمان اجرا میشوند.
درواقع از await میتوان به همراه یک awaitable argument استفاده کرد که یک عملیات asynchronous است.
دو نوع رایج awaitable argument ها در دات نت ،
Task , Task<T>
میباشد.
🔹 اجرای متدهای long-running به صورت همزمان (synchronous)، باعث بلاک شدن thread جاری تا زمان اتمام آن متد میشود.
🔹همچنین در اپلیکیشن هایی که رابط گرافیکی کاربری دارید اجرای متد های long-running به صورت همزمان، سبب بلاک شدن thread اجرا کننده رابط گرافیکی (UI) میشود و تا زمان اتمام اجرای آن متد رابط کاربری به صورت فریز شده باقی میماند.
اما چنین متدی که خروجی آن یک Task نیست و نمیتوان آنرا با استفاده از async و await به صورت asynchronous اجرا کرد، را چگونه به یک متد asynchronous تبدیل کنیم تا در یک thread جدا اجرا شود.
اینجاست که Task.Run به کمک ما می آید.
🔸 متد Run از کلاس Task باعث اجرا شدن کد های صف شده در یک thread جدا میشود.
معمولا این thread جدید ازthread pool می آید .
▫️ در واقع thread pool مجموعه ای از worker thread هایی است که توسط .net برای اجرای اپلیکیشن، مدیریت میشوند.
▫️ هم چنین یک worker thread یک thread ای است که به درخواست یک client برای انجام کاری فعال میشود.
🔹 مهمترین نکته این که Task.Run به عنوان خروجی یک Task باز میگرداند که این بدین معنی است که می توانید آنرا await کنید.
متد Task.Run دارای overload های متفاوتی است که به عنوان پارامتر یک Action delegate یا یک Func delegate دریافت میکند.
🔸 تاکنون دانستیم که صدا زدن متد Task.Run برای اجرای یک متد long-running باعث اجرا شدن این متد بروی یک thread جدید در thread pool میشود اما پس از اتمام اجرای این متد long-running بقیه و ادامه کد ها بروی کدامین thread اجرا خواهد شد⁉️
🔸 در اکثر مواقع می خواهیم تا ادامه کار بروی thread اصلی ادامه پیدا کند مخصوصا زمانی که اپلیکیشن دارای یک رابط کاربری گرافیکی میباشد و میخواهیم بعد از انجام شدن آن متد long-running عناصری را بروی رابط گرافیکی در thread اصلی آپدیت نماییم. برای آنجام این کار کافیست Task.Run را await نمایید زیرا زمانی که که یک Task را await می کنید اطلاعات context جاری از SynchronizationContext گرفته میشود تا دوباره به thread اصلی اپلیکیشن باز گردد.
🔻زمانی که روی یک متد ای که به صورت Async اجرا میشود ConfigureAwait(
false) قرار میدهید. بازگشت به context اصلی صورت نمیگیرد.🔹 اما SynchronizationContext چیست و کار آن چه میباشد؟
🔸 هنگامی که با یک اپلیکیشن UI based کار میکنید وابستگی و ارتباط بین thread ها مسئله بسیار مهمی است
زمانی که با چنین اپلیکیشن هایی کار میکنید محدودیتی که وجود دارد این است که عناصر و کنترلر های صفحه توسط UI thread ساخته شده یا تغییر و آپدیت شوند و اگر نیاز باشد که به عنوان مثال 10 تغییر بروی عناصر صفحه صورت گیرد، این عملیات ها در صف قرار میگیرند تا به صورت متوالی توسط UI thread انجام شوند.
این محدودیت برای کمک به UI framework جهت جلوگیری از پیچیدگی های هماهنگی و مدیریت بین thread های مختلف برای آپدیت عناصر و کنترلر های صفحه صورت گرفته است.
و SynchronizationContext ارتباط با UI thread را به صورت منظم مرتب میکند.
در Asp.net Core اما SynchronizationContext برایر null میباشد.
✳️ درا این قسمت یک overview در مورد Task.Run پرداختیم تا در قسمت بعدی به عملیات های I/O و CPU bound پرداخته و با مفاهیم Asynchronous بیشتر آشنا میشویم.
@FullStackDevs
#linkedin
#RemoveAllMessage
زمانی که می خواهید پیام هایتان در لینکدین را حذف کنید. شما باید هر پیام را یکی یکی انتخاب کنید. برای حذف موفقیت آمیز یک پیام حدود 4 "کلیک" طول می کشد. حالا فکر کنید پیامهایتان خیلی زیاد باشد ، بنابراین زمان زیادی طول میکشد تا همه آنها را پاک کنید . اما با اسکریپت زیر کمتر از یک دقیقه اینکار را میتوانید انجام بدید . لطفا این پست را به اشتراک بزارید که همکاران و دوستان بتوانند استفاده کنند.
1- به صفحه پیامهایتان بروید.
2-کروم console را باز کنید.
3-قطعه کد زیر را در کنسول paste کنید .
#RemoveAllMessage
زمانی که می خواهید پیام هایتان در لینکدین را حذف کنید. شما باید هر پیام را یکی یکی انتخاب کنید. برای حذف موفقیت آمیز یک پیام حدود 4 "کلیک" طول می کشد. حالا فکر کنید پیامهایتان خیلی زیاد باشد ، بنابراین زمان زیادی طول میکشد تا همه آنها را پاک کنید . اما با اسکریپت زیر کمتر از یک دقیقه اینکار را میتوانید انجام بدید . لطفا این پست را به اشتراک بزارید که همکاران و دوستان بتوانند استفاده کنند.
1- به صفحه پیامهایتان بروید.
2-کروم console را باز کنید.
3-قطعه کد زیر را در کنسول paste کنید .
;(function () {
setInterval(() => {
let deleted = false;
let dropdowns = document.querySelectorAll('artdeco-dropdown-item');
for (let i = 0; i < dropdowns.length; i++){
let txt = dropdowns[i].textContent.trim();
if (txt === 'Delete') {
deleted = true;
dropdowns[i].click();
}
}
if (deleted){
setTimeout(() => {
let messageModal = document.querySelector('.msg-modal-delete-convo');
let deleteBtn = messageModal.querySelector('.artdeco-button--primary');
deleteBtn.click();
}, 500)
} else {
let messageConverstionCard = document.querySelector('.msg-conversation-card__list-action-icon');
messageConverstionCard.click();
}
}, 1000);
}());
@fullStackDevsLinkedIn
LinkedIn Login, Sign in | LinkedIn
Login to LinkedIn to keep in touch with people you know, share ideas, and build your career.
#IOBound
#CPU_Bound
#AsynchronousProgramming
#Async #Await
✳️ CPU vs. I/O-Bound Code
🔸 برای تشخیص اینکه چه زمانی از Task.Run استفاده کنیم. ابتدا نیاز به دانستن تفاوت بین کد های CPU-bound و I/O-bound داریم.
🔹 CPU-Bound
🔸 وقتی کدی CPU-Bound باشد اساسا این منظور را میرساند که پردازنده کامپیوتر یا به طور خاص thread ای در پردازنده، جایی است که به واسطه اجرای آن کد دچار ترافیک و صرف زمان زیاد خواهد شد.
▫️ در زمان اجرای کد های CPU-Bound پردازنده تا جای ممکن با سرعت به اجرای چنین کدهایی میپردازد اما با این وجود باز هم مدت زمانی که صرف اجرای چنین کدهایی خواهد شد قابل توجه خواهد بود. به عبارت دیگر در اجرای چنین کدهایی پردازنده محلی است که شما را از اجرای سریعتر باز میدارد و میتوانیم بگوییم که اجرای این کد ها باعث delay در پردازنده خواهد شد.
🔹 I/O-Bound Code
🔸 در مقابل در کد های I/O-Bound نرخ انتقال داده در دستگاه های ورودی و یا خروجی و یا عملیات های ورودی و خروجی عاملی است که باعث ایجاد delay خواهد شد.
مانند خواندن یا ذخیره کردن داده ها از یک فایل یا برقراری ارتباط با سرور جهت دانلود یا آپلود و ...
▫️ در همه این عملیات ها پردازنده تا حدودی بیکار است به این خاطر که منتظر اتمام ارسال و دریافت داده ها میباشد. در صورتی که عملیات I/O-Bound یک ارتباط با یک سرور خارجی باشد و به هر دلیلی اتصال به درستی برقرار نشود احتمالا پردازنده کاملا بیکار خواهد بود تا زمانی که ارتباط برقرار شود.
🔸 همانطور که متوجه شدید گرچه در هر دو عملیات های CPU vs. I/O-Bound تاخیر (delay) وجود دارد اما این عملیات ها در ذات کاملا متفاوت هستند.
✳️ Nature of Asynchronous operation
اصولا استفاده از Task,Run برای اجرای یک عملیات در thread ای جدا، برای عملیات های CPU Bound مسمر ثمر است، ام نه برای عملیات های I/O Bound. ولی چرا ⁉️
🔸 اکثر کامپیوترهای امروزی چندین هسته دارند که کمی شبیه این است که انگار چندین پردازنده دارند. زمانی که اپلیکیشن شروع به اجرا شدن میکند دسته ای از thread ها توسط .Net runtime ساحته میشود تا اپلیکیشن از آنها استفاده کند.
تعداد این thread ها به تعداد هسته های پردازنده کامپیوتر مرتبط است
در نتیجه اگر thread اصلی اپلیکیشن مشغول باشد می توانیم با استفاده از Task.Run عملیات سنگین خود را به لطف پردازنده چند هسته ای مان در thread ای جدا اجرا کنیم .
🔻توجه داشته باشید که thread و core گرچه مرتبط هستند اما با هم تفاوت دارند .
یک thread یک مفهوم نرم افزاری است و یک core یک ابزار سخت افزاری .
▫️ این امکان وجود دارد تا هر چند thread ای که میخواهید بسازید اما تعداد core ها ثابت است .
🔸 وقتی Task.Run را صدا میزنید یک thread از thread pool (اگر در دسترس باشد) اجرا خواهد شد و این امر بهبود عملکردی را برای اپلیکیشن به ارمغان می آورد.
🔸 وقتی که یک عملیات I/O Bound را با استفاده از Task.Run اجرا میکنید بر روی یک thread از thread pool (اگر در دسترس باشد) اجرا خواهد شد ولی در اون thread هم باز باید برای دریافت داده ها، منتظر اتمام عملیات I/O باشد.
اینکار ممکن است روشی سریع و آسان برای پاسخگو نگه داشتن اپلیکیشن برای انجام فرامین کاربران باشد اما راه کارآمدی برای استفاده هر چه بهتر منابع سیستم نیست.
🔸 در چنین عملیات هایی راه جل خیلی بهتر استفاده از async و await است. در این روش باز هم اپلیکیشن پاسخو خواهد بود .
🔸 به منظور استفاده از await برای عملیات های I/O Bound بدون استفاده کردن از Task.Run لازم است که از یک متد asynchronous استفاده کنید که یک Task را return کند. خود این متد نباید از Task.Run استفاده کرده باشد .
انجام این کار زمانی که دارید با کلاس های از پیش ساخته شده .Net نظیر FileStream
و HttpClient کار میکنید، ساده است زیرا این کلاس ها برای اعمال خود متد های asynchronous را در اختیار مان قرار میدهند.
گاهی ممکن است کلاسی در درون .net یا یک لایبری فقط متد های synchronous در اختیار مان قرار دهد که در این موارد ممکن مجبور شوید تا از Task.Run استفاده کنید.
اما همیشه و تا جای ممکن از async و await به جای Task.Run برای عملیات های I/O Bound استفاده کنید.
@FullStackDevs
#CPU_Bound
#AsynchronousProgramming
#Async #Await
✳️ CPU vs. I/O-Bound Code
🔸 برای تشخیص اینکه چه زمانی از Task.Run استفاده کنیم. ابتدا نیاز به دانستن تفاوت بین کد های CPU-bound و I/O-bound داریم.
🔹 CPU-Bound
🔸 وقتی کدی CPU-Bound باشد اساسا این منظور را میرساند که پردازنده کامپیوتر یا به طور خاص thread ای در پردازنده، جایی است که به واسطه اجرای آن کد دچار ترافیک و صرف زمان زیاد خواهد شد.
▫️ در زمان اجرای کد های CPU-Bound پردازنده تا جای ممکن با سرعت به اجرای چنین کدهایی میپردازد اما با این وجود باز هم مدت زمانی که صرف اجرای چنین کدهایی خواهد شد قابل توجه خواهد بود. به عبارت دیگر در اجرای چنین کدهایی پردازنده محلی است که شما را از اجرای سریعتر باز میدارد و میتوانیم بگوییم که اجرای این کد ها باعث delay در پردازنده خواهد شد.
🔹 I/O-Bound Code
🔸 در مقابل در کد های I/O-Bound نرخ انتقال داده در دستگاه های ورودی و یا خروجی و یا عملیات های ورودی و خروجی عاملی است که باعث ایجاد delay خواهد شد.
مانند خواندن یا ذخیره کردن داده ها از یک فایل یا برقراری ارتباط با سرور جهت دانلود یا آپلود و ...
▫️ در همه این عملیات ها پردازنده تا حدودی بیکار است به این خاطر که منتظر اتمام ارسال و دریافت داده ها میباشد. در صورتی که عملیات I/O-Bound یک ارتباط با یک سرور خارجی باشد و به هر دلیلی اتصال به درستی برقرار نشود احتمالا پردازنده کاملا بیکار خواهد بود تا زمانی که ارتباط برقرار شود.
🔸 همانطور که متوجه شدید گرچه در هر دو عملیات های CPU vs. I/O-Bound تاخیر (delay) وجود دارد اما این عملیات ها در ذات کاملا متفاوت هستند.
✳️ Nature of Asynchronous operation
اصولا استفاده از Task,Run برای اجرای یک عملیات در thread ای جدا، برای عملیات های CPU Bound مسمر ثمر است، ام نه برای عملیات های I/O Bound. ولی چرا ⁉️
🔸 اکثر کامپیوترهای امروزی چندین هسته دارند که کمی شبیه این است که انگار چندین پردازنده دارند. زمانی که اپلیکیشن شروع به اجرا شدن میکند دسته ای از thread ها توسط .Net runtime ساحته میشود تا اپلیکیشن از آنها استفاده کند.
تعداد این thread ها به تعداد هسته های پردازنده کامپیوتر مرتبط است
در نتیجه اگر thread اصلی اپلیکیشن مشغول باشد می توانیم با استفاده از Task.Run عملیات سنگین خود را به لطف پردازنده چند هسته ای مان در thread ای جدا اجرا کنیم .
🔻توجه داشته باشید که thread و core گرچه مرتبط هستند اما با هم تفاوت دارند .
یک thread یک مفهوم نرم افزاری است و یک core یک ابزار سخت افزاری .
▫️ این امکان وجود دارد تا هر چند thread ای که میخواهید بسازید اما تعداد core ها ثابت است .
🔸 وقتی Task.Run را صدا میزنید یک thread از thread pool (اگر در دسترس باشد) اجرا خواهد شد و این امر بهبود عملکردی را برای اپلیکیشن به ارمغان می آورد.
🔸 وقتی که یک عملیات I/O Bound را با استفاده از Task.Run اجرا میکنید بر روی یک thread از thread pool (اگر در دسترس باشد) اجرا خواهد شد ولی در اون thread هم باز باید برای دریافت داده ها، منتظر اتمام عملیات I/O باشد.
اینکار ممکن است روشی سریع و آسان برای پاسخگو نگه داشتن اپلیکیشن برای انجام فرامین کاربران باشد اما راه کارآمدی برای استفاده هر چه بهتر منابع سیستم نیست.
🔸 در چنین عملیات هایی راه جل خیلی بهتر استفاده از async و await است. در این روش باز هم اپلیکیشن پاسخو خواهد بود .
🔸 به منظور استفاده از await برای عملیات های I/O Bound بدون استفاده کردن از Task.Run لازم است که از یک متد asynchronous استفاده کنید که یک Task را return کند. خود این متد نباید از Task.Run استفاده کرده باشد .
انجام این کار زمانی که دارید با کلاس های از پیش ساخته شده .Net نظیر FileStream
و HttpClient کار میکنید، ساده است زیرا این کلاس ها برای اعمال خود متد های asynchronous را در اختیار مان قرار میدهند.
گاهی ممکن است کلاسی در درون .net یا یک لایبری فقط متد های synchronous در اختیار مان قرار دهد که در این موارد ممکن مجبور شوید تا از Task.Run استفاده کنید.
اما همیشه و تا جای ممکن از async و await به جای Task.Run برای عملیات های I/O Bound استفاده کنید.
@FullStackDevs
#NET5Preview3
معرفی net 5 preview 3
🔸نسخه NET 5.0 شامل مجموعه ای از ویژگی های جدید و بهبود عملکرد است. و در حال کار بر روی ویژگی های بزرگتری میباشند که نسخه 5.0 release را تعریف می کند.
🔹در اینجا میتونید به پست و مخزن dotnet / design نگاهی بیندازید و هر بازخوردی را که دارید با تیم دات نت در میان بگذارید.
🔹شما میتونید نسخه دات نت 5 را برای Windows, macOS, و Linux دانلود کنید .
▪️بهبود کیفیت کد در RyuJIT:
هر نسخه شامل مجموعه ای از تغییرات است که باعث بهبود machine code ای می شود که JIT تولید می کند (ما این را "code quality" می نامیم). کیفیت بهتر کد به معنای عملکرد بهتر برنامه است.
▫️بهبود System.Text.Json
✅برطرف کردن مشکل ReferenceLoopHandling در System.Text.Json که یکی ازویژگی های مهم سریال سازی در JSON.NET است.
✅اضافه شدن چند Extension method برای HttpClient که امکان سریال سازی از / به JSON را دارند مثلا:
GetJsonAsync<T>(HttpClient, String)
✅در این نسخه پشتیبانی از structs و کلاس ها immutable را به JsonSerializer اضافه می کند.(توی Newtonsoft.Json یه اتریبوتی دارد بنام [JsonConstructor] که این امکان رو میده وقتی چند constructor داریم ،کدوم آنها در زمان deserialize صدا زده بشه ولی تو System.Text.Json فقط از constructor بدون پارامتر پشتیبانی میشود)
▪️پشتیبانی NET SDK برای اسمبلی Net framework
این تغییر ساخت پروژه های Net Framework را بر روی یک دستگاه بدون نصب package مورد نیاز NET Framework مورد نیاز امکان پذیر می کند. این پیشرفت مختص هدف قرار دادن package ها است و وابستگی های دیگری که ممکن است یک پروژه داشته باشد را در نظر نمی گیرد.
@fullStackDevs
معرفی net 5 preview 3
🔸نسخه NET 5.0 شامل مجموعه ای از ویژگی های جدید و بهبود عملکرد است. و در حال کار بر روی ویژگی های بزرگتری میباشند که نسخه 5.0 release را تعریف می کند.
🔹در اینجا میتونید به پست و مخزن dotnet / design نگاهی بیندازید و هر بازخوردی را که دارید با تیم دات نت در میان بگذارید.
🔹شما میتونید نسخه دات نت 5 را برای Windows, macOS, و Linux دانلود کنید .
▪️بهبود کیفیت کد در RyuJIT:
هر نسخه شامل مجموعه ای از تغییرات است که باعث بهبود machine code ای می شود که JIT تولید می کند (ما این را "code quality" می نامیم). کیفیت بهتر کد به معنای عملکرد بهتر برنامه است.
▫️بهبود System.Text.Json
✅برطرف کردن مشکل ReferenceLoopHandling در System.Text.Json که یکی ازویژگی های مهم سریال سازی در JSON.NET است.
✅اضافه شدن چند Extension method برای HttpClient که امکان سریال سازی از / به JSON را دارند مثلا:
GetJsonAsync<T>(HttpClient, String)
return await client.GetJsonAsync<List<Country>>(new Uri(url));در مثال بالا فرض کنید api داریم که لیست کشور ها رو بصورت json برمیگرداند و با <GetJsonAsync<T که T نوع آبجکت خروجی deserialize شده لیستی از country خروجی داریم .(لیست HttpClientJsonExtensions )
✅در این نسخه پشتیبانی از structs و کلاس ها immutable را به JsonSerializer اضافه می کند.(توی Newtonsoft.Json یه اتریبوتی دارد بنام [JsonConstructor] که این امکان رو میده وقتی چند constructor داریم ،کدوم آنها در زمان deserialize صدا زده بشه ولی تو System.Text.Json فقط از constructor بدون پارامتر پشتیبانی میشود)
▪️پشتیبانی NET SDK برای اسمبلی Net framework
این تغییر ساخت پروژه های Net Framework را بر روی یک دستگاه بدون نصب package مورد نیاز NET Framework مورد نیاز امکان پذیر می کند. این پیشرفت مختص هدف قرار دادن package ها است و وابستگی های دیگری که ممکن است یک پروژه داشته باشد را در نظر نمی گیرد.
@fullStackDevs
.NET Blog
Announcing .NET 5.0 Preview 3
Today, we’re releasing .NET 5.0 Preview 3. It contains a set of new features and performance improvements. We’re continuing to work on the bigger features that will define the 5.0 release. The .NET 5.0 Preview 1 post covers what we are planning on building…
#EFCore5Preview3
#EFCore5
معرفی Entity Framework Core 5.0 Preview 3
🔸پیش نمایش های EF Core 5.0 نیاز به NET Standard 2.1 دارد. این یعنی:
▫️انتیتی فریمورک Core 5.0 در NET Core 3.1 اجرا می شود. نیازی به NET 5 ندارد.( این ممکن است در پیش نمایش های آینده بسته به نحوه تکامل برنامه برای NET 5 تغییر کند.)
▪️انتیتی فریمورک Core 5.0 بر روی سیستم عامل های دیگری که از NET Standard 2.1 پشتیبانی می کنند اجرا می شود.
▫️انتیتی فریمورک Core 5.0 بر روی سیستم عاملهای استاندارد NET Standard 2.0، از جمله Net Framework اجرا نمی شود.
🔹چگونه می توان پیش نمایش های EF Core 5.0 را دریافت کرد:
انتیتی فریمورک منحصراً به صورت مجموعه ای از NuGet packages توزیع می شود.
به عنوان مثال ، برای افزودن SQL Server provider به پروژه خود ، می توانید از دستور زیر با استفاده از ابزار dotnet استفاده کنید:
🔸نصب dotnet ef
مانند EF Core 3.0 و 3.1 ، ابزار خط فرمان dotnet ef دیگر در .NET Core SDK گنجانده نشده است. قبل از اجرای دستورات EF Core migration or scaffolding commands ، باید این بسته را به عنوان یک ابزار global یا محلی نصب کنید.
برای نصب ابزار ، ابتدا نسخه های موجود را با استفاده از زیر حذف کنید:
🔻امکانات جدیدی که به این نسخه اضافه شده:
✅Filtered Include
پشتیبانی قابلیت Filter کردن Include ها
✅New ModelBuilder API for navigation properties
متد جدید Navigation که وقتی navigation properties نیاز به تنظیمات اضافی داشته باشد میتونید استفاده کنید.
⛔️توجه داشته باشید که API navigation جایگزین پیکربندی relationship نمی شود.
درعوض امکان تنظیمات اضافی از خصوصیات navigation را در روابط قبلاً تعریف شده فراهم می کند.
✅New command-line parameters for namespaces and connection strings
اکنون Migrations و scaffolding اجازه می دهد تا namespaces در خط فرمان مشخص شود.
به عنوان مثال ، برای مهندسی معکوس یک database که context و کلاس های مدل را در namespace های مختلف نامگذاری می کند
به دلایل عملکرد ، EF در هنگام خواندن مقادیر از پایگاه داده ، بررسیهای null-checks را انجام نمی دهد.
و در صورت مواجهه با null ، این امر می تواند به exception منجر شود.
با استفاده از EnableDetailedErrors ، بررسیهای null checking اضافه می شود.
#EFCore5
معرفی Entity Framework Core 5.0 Preview 3
🔸پیش نمایش های EF Core 5.0 نیاز به NET Standard 2.1 دارد. این یعنی:
▫️انتیتی فریمورک Core 5.0 در NET Core 3.1 اجرا می شود. نیازی به NET 5 ندارد.( این ممکن است در پیش نمایش های آینده بسته به نحوه تکامل برنامه برای NET 5 تغییر کند.)
▪️انتیتی فریمورک Core 5.0 بر روی سیستم عامل های دیگری که از NET Standard 2.1 پشتیبانی می کنند اجرا می شود.
▫️انتیتی فریمورک Core 5.0 بر روی سیستم عاملهای استاندارد NET Standard 2.0، از جمله Net Framework اجرا نمی شود.
🔹چگونه می توان پیش نمایش های EF Core 5.0 را دریافت کرد:
انتیتی فریمورک منحصراً به صورت مجموعه ای از NuGet packages توزیع می شود.
به عنوان مثال ، برای افزودن SQL Server provider به پروژه خود ، می توانید از دستور زیر با استفاده از ابزار dotnet استفاده کنید:
dotnet add package Microsoft.EntityFrameworkCore.SqlServer --version 5.0.0-preview.3.20181.2همچنین نسخه 5.0 پیش نمایش 3 از ارائه دهنده Microsoft.Data.Sqlite.Core ADO.NET را منتشر کرده ایم.
🔸نصب dotnet ef
مانند EF Core 3.0 و 3.1 ، ابزار خط فرمان dotnet ef دیگر در .NET Core SDK گنجانده نشده است. قبل از اجرای دستورات EF Core migration or scaffolding commands ، باید این بسته را به عنوان یک ابزار global یا محلی نصب کنید.
برای نصب ابزار ، ابتدا نسخه های موجود را با استفاده از زیر حذف کنید:
dotnet tool uninstall --global dotnet-efسپس دستور زیر برای نصب نسخه پیش نمایش:
dotnet tool install --global dotnet-ef --version 5.0.0-preview.3.20181.2🔹می توان از این نسخه جدید dotnet ef با پروژه هایی استفاده کرد که از نسخه های قدیمی تر EF Core runtime استفاده می کنند.
🔻امکانات جدیدی که به این نسخه اضافه شده:
✅Filtered Include
پشتیبانی قابلیت Filter کردن Include ها
var blogs = context.Blogsاین Query بلاگ ها را به همراه هر post مرتبط باز می گرداند ، اما فقط هنگامی که عنوان post حاوی "cheese" باشد.( برای جزئیات کامل به مستندات شامل مراجعه کنید.)
.Include(e => e.Posts.Where(p => p.Title.Contains("Cheese")))
.ToList();
✅New ModelBuilder API for navigation properties
متد جدید Navigation که وقتی navigation properties نیاز به تنظیمات اضافی داشته باشد میتونید استفاده کنید.
modelBuilder.Entity<Blog>().Navigation(e => e.Posts).HasField("_myposts");
⛔️توجه داشته باشید که API navigation جایگزین پیکربندی relationship نمی شود.
درعوض امکان تنظیمات اضافی از خصوصیات navigation را در روابط قبلاً تعریف شده فراهم می کند.
✅New command-line parameters for namespaces and connection strings
اکنون Migrations و scaffolding اجازه می دهد تا namespaces در خط فرمان مشخص شود.
به عنوان مثال ، برای مهندسی معکوس یک database که context و کلاس های مدل را در namespace های مختلف نامگذاری می کند
dotnet ef dbcontext scaffold "connection string" Microsoft.EntityFrameworkCore.SqlServer --context-namespace "My.Context" --namespace "My.Model"همچنین ، connection string اکنون می تواند به دستور database-update منتقل شود:
dotnet ef database update --connection "connection string"✅EnableDetailedErrors has returned
به دلایل عملکرد ، EF در هنگام خواندن مقادیر از پایگاه داده ، بررسیهای null-checks را انجام نمی دهد.
و در صورت مواجهه با null ، این امر می تواند به exception منجر شود.
با استفاده از EnableDetailedErrors ، بررسیهای null checking اضافه می شود.
protected override void OnConfiguring(DbContextOptionsBuilder optionsBuilder)@fullStackDevs
=> optionsBuilder
.EnableDetailedErrors()
.EnableSensitiveDataLogging() // Often also useful with EnableDetailedErrors
.UseSqlServer(Your.SqlServerConnectionString);
.NET Blog
Announcing Entity Framework Core 5.0 Preview 3 | .NET Blog
The latest version of Entity Framework Core features filtered includes, new model builder API for navigation, Cosmos DB partition keys, and more.
Forwarded from Web Devs
#StaticType
#DynamicType
✳️ What are Exactly Static and Dynamic Types⁉️
🔹لزوما برای فهمیدن پایه ایه این مفهوم نیاز به دانستن زبان برنامه نویسی خاصی ندارید زیرا اینها مفاهیم طراحی زبان های برنامه نویسی هستند.پس بنابراین عدم آشنابودن با یک زبان برنامه نویسی خاص به درک این مفهوم لطمه ای وارد نمیکند.
🔻در ابتدای امر باید بدانید منظور از کلمه type در static type و dynamic type نوع داده ای متغیر ها میباشد.
▪️برای تشریح static type یا dynamic type بودن تعاریف مختلفی وجود دارد که در این پست به معقول ترین آنها میپردازیم.
▪️ type checking
🔸 فرایند تایید و اعمال محدودیت ها بروی انواع داده ها را type checking می گویند. در برخی زبانها type checking در زمان compile time و در برخی در زمان runtime انجام میشود. در واقع انجام عملیات type checking در مورد type safe بودن برنامه است تا type error های احتمالی را کاهش دهد.
▫️ type error
🔸یک type error میتواند وضعیتی باشد که در هنگام انجام یک عملیات بروی نوع های داده ای اتفاق بیافتد. برای مثال جمع کردن یک رشته با یک عدد صحیح باهم.
خطاهای type error در زبان های برنامه نویسی زیادی اتفاق می افتد بسته به نوع زبان برنامه نویسی این ارور ها در زمان compile time یا در زمان runtime صادر میشود.
▪️type safe
🔸به عملیاتی الحاق میشود که در آن برنامه از درست بودن نوع داده هایی که عملیات بروی آنها انجام میشود اطمینان حاصل میکند.
✳️ static type language
🔸 یک زبان برنامه نویسی static type زبانی است که نوع داده ای متغیر ها در زمان compile time مشخص میشود.در زبان های برنامه نویسی static type زمانی که یک متغیر با یک نوع داده ای مشخص تعریف شده است دیگر قادر به پذیرفتن داده هایی با نوع دیگر نخواهد بود . در صورت اختصاص دادن داده ای با نوع داده ای مختلف با یک type error در زمان compile time مواجه میشوید.
✳️ Dynamic type language
🔸یک زبان برنامه نویسی dynamic type زبانی است که نوع متغیر ها در زمان runtime چک و همچنین مشخص میشود. در زبان های dynamic type اگر به یک متغیر مقدار integer اختصاص دهید نوع آن متغیر از نوع integer تعیین میشود. اما اگر به همان متغیر در چند خط پایین تر در کد یک مقدار رشته ای تخصیص دهید نوع داده ای تعیین شده برای متغیر به string تغییر پیدا خواهد کرد.
✳️ معایب و مزایا
▪️static type
🔹حجم کثیری از خطاها و ارورها در فرایند توسعه مشخص و برطرف میشود.
🔹پرفورمنس بهتر(به دلیل اعمال محدودیت بر انواع داده ای و مشخص شدن نوع داده ها در زمان کامپایل)، کد ماشین بهینه تری تولید میشود.
🔹مستند سازی بهتر زیرا با مشخص بودن نوع داده ها و برطرف کردن خطاهای احتمالی رفتار تابع ها قابل پیش بینی تر خواهد بود.
🔹پیدا کردن راحت تر اشیا و متغیر ها در کد.
🔹کار کردن راحت تر با دیتابیس های رابطه ای و دیگر سیستم هایی که متکی به static type بودن هستند.
▪️Dynamic type language
🔹کد فشرده تر و کمتر
🔹عدم وجود مرحله کامپایل به این معنی که برای تست کردن تغییرات در کد دیگر منتظر کامپایلر برای کامپایل کردن کدها نیستید.این نوع زبان ها غالبا مفسری هستند و اگر در زمان runtime اروری اتفاق بیافتد، باعث کاهش پرفورمنس برنامه میشود.همچنین انجام type checking ها در زمان runtime در این نوع زبان ها بر پرفورمنس برنامه تاثیر منفی دارد.
🔹صرف زمان کمتر برای برطرف کردن syntax و همچنین semantic ارورها و به جای آن کل زمان خود را میتوانید به برطرف کردن logic ارورها بپردازید.
🔹ریفکتور کردن کدها فقط باعث تغییرات محلی میشود. برای مثال در زبان های static type با تغییر نام یک کلاس باید در سراسر کد خود این تغییر را اعمال کنید.(البته این کار در IDE های امروزی به راحتی قابل انجام است).
🔻منابع
1 - 2 - 3 - 4 - 5 - 6 - 7 - 8 - 9
@FullStackDevs
#DynamicType
✳️ What are Exactly Static and Dynamic Types⁉️
🔹لزوما برای فهمیدن پایه ایه این مفهوم نیاز به دانستن زبان برنامه نویسی خاصی ندارید زیرا اینها مفاهیم طراحی زبان های برنامه نویسی هستند.پس بنابراین عدم آشنابودن با یک زبان برنامه نویسی خاص به درک این مفهوم لطمه ای وارد نمیکند.
🔻در ابتدای امر باید بدانید منظور از کلمه type در static type و dynamic type نوع داده ای متغیر ها میباشد.
▪️برای تشریح static type یا dynamic type بودن تعاریف مختلفی وجود دارد که در این پست به معقول ترین آنها میپردازیم.
▪️ type checking
🔸 فرایند تایید و اعمال محدودیت ها بروی انواع داده ها را type checking می گویند. در برخی زبانها type checking در زمان compile time و در برخی در زمان runtime انجام میشود. در واقع انجام عملیات type checking در مورد type safe بودن برنامه است تا type error های احتمالی را کاهش دهد.
▫️ type error
🔸یک type error میتواند وضعیتی باشد که در هنگام انجام یک عملیات بروی نوع های داده ای اتفاق بیافتد. برای مثال جمع کردن یک رشته با یک عدد صحیح باهم.
خطاهای type error در زبان های برنامه نویسی زیادی اتفاق می افتد بسته به نوع زبان برنامه نویسی این ارور ها در زمان compile time یا در زمان runtime صادر میشود.
▪️type safe
🔸به عملیاتی الحاق میشود که در آن برنامه از درست بودن نوع داده هایی که عملیات بروی آنها انجام میشود اطمینان حاصل میکند.
✳️ static type language
🔸 یک زبان برنامه نویسی static type زبانی است که نوع داده ای متغیر ها در زمان compile time مشخص میشود.در زبان های برنامه نویسی static type زمانی که یک متغیر با یک نوع داده ای مشخص تعریف شده است دیگر قادر به پذیرفتن داده هایی با نوع دیگر نخواهد بود . در صورت اختصاص دادن داده ای با نوع داده ای مختلف با یک type error در زمان compile time مواجه میشوید.
✳️ Dynamic type language
🔸یک زبان برنامه نویسی dynamic type زبانی است که نوع متغیر ها در زمان runtime چک و همچنین مشخص میشود. در زبان های dynamic type اگر به یک متغیر مقدار integer اختصاص دهید نوع آن متغیر از نوع integer تعیین میشود. اما اگر به همان متغیر در چند خط پایین تر در کد یک مقدار رشته ای تخصیص دهید نوع داده ای تعیین شده برای متغیر به string تغییر پیدا خواهد کرد.
✳️ معایب و مزایا
▪️static type
🔹حجم کثیری از خطاها و ارورها در فرایند توسعه مشخص و برطرف میشود.
🔹پرفورمنس بهتر(به دلیل اعمال محدودیت بر انواع داده ای و مشخص شدن نوع داده ها در زمان کامپایل)، کد ماشین بهینه تری تولید میشود.
🔹مستند سازی بهتر زیرا با مشخص بودن نوع داده ها و برطرف کردن خطاهای احتمالی رفتار تابع ها قابل پیش بینی تر خواهد بود.
🔹پیدا کردن راحت تر اشیا و متغیر ها در کد.
🔹کار کردن راحت تر با دیتابیس های رابطه ای و دیگر سیستم هایی که متکی به static type بودن هستند.
▪️Dynamic type language
🔹کد فشرده تر و کمتر
🔹عدم وجود مرحله کامپایل به این معنی که برای تست کردن تغییرات در کد دیگر منتظر کامپایلر برای کامپایل کردن کدها نیستید.این نوع زبان ها غالبا مفسری هستند و اگر در زمان runtime اروری اتفاق بیافتد، باعث کاهش پرفورمنس برنامه میشود.همچنین انجام type checking ها در زمان runtime در این نوع زبان ها بر پرفورمنس برنامه تاثیر منفی دارد.
🔹صرف زمان کمتر برای برطرف کردن syntax و همچنین semantic ارورها و به جای آن کل زمان خود را میتوانید به برطرف کردن logic ارورها بپردازید.
🔹ریفکتور کردن کدها فقط باعث تغییرات محلی میشود. برای مثال در زبان های static type با تغییر نام یک کلاس باید در سراسر کد خود این تغییر را اعمال کنید.(البته این کار در IDE های امروزی به راحتی قابل انجام است).
🔻منابع
1 - 2 - 3 - 4 - 5 - 6 - 7 - 8 - 9
@FullStackDevs
Forwarded from Web Devs
#Caching
کشینگ (Caching) چیست؟
از جمله مواردی که استفاده درست و بجا از آن به طور قابل ملاحظه ای باعث افزایش کارایی برنامه میشود Caching میباشد.درواقع Caching مکانیزمی است که داده ها را ذخیره میکند تا درخواست های آینده برای آن داده ها سریعتر انجام شود و نتیجه به کلاینت زودتر بازگشت داده شود.داده های ذخیره شده می تواند نتیجه محاسبات قبلی یا کپی ای از داده های دیگر در جای دیگری باشد.این کار برای جلوگیری از محاسبات تکراری و یا کاهش درخواست ها به دیتابیس،برای داده هایی که امکان تغییر مداوم آنها کم است و همچنین هزینه محاسبه و یا ساخت دوباره آن زیاد است، صورت میگیرد.
خوشبخانه AspNetCore از روش های مختلف Caching پشتیبانی میکند.
از جمله این روش ها به Cache In Memory و Distributed Cache می توان اشاره کرد.
روش Cache In Memory از حافظه رم سرور برای ذخیره داده های کش شده استفاده میکند. این نوع Cache متناسب برای یک سرور است و برای استفاده از این روش زمانی که چند سرور دارید از ویژگی یا تکنینک Sticky session ( که به معنی درخواست های کلاینت به همان سروری که داده ها را Cache کرده برای پردازش Route میشوند) استفاده کرد.
از روش Distributed Cache برای share کردن داده های کش شده بین چندین سرور استفاده میشود. معمولا داده ها در یک سرور خارجی نگه داشته میشوند و دیگر سرور ها به آن دسترسی دارند.
محل قرا گیری عملیات Caching در معماری پروژه هایمان کجاست؟
معماری رایج در بین وب اپلیکیشن ها غالبا یک معماری تمیز (Clean Architecture) میباشد . و ما در این پست به قرار دادن عملیات مربوط به caching در چنین معماری هایی میپردازیم.
در این قبیل معماری ها براساس اصول طراحی و قوائد تعیین شده در DDD اپلیکیشن به لایه هایی تقسیم میشود و به ترتیب داخلی ترین لایه که Domain layer میباشد و کمترین وابستگی را به یک Dll خارجی دارد و هرچه به لایه های بالاتر میرویم وابستگی لایه ها به یکدیگر بیشتر میشود. از ویژگی های یک معماری خوب Loose Coupling در بین لایه ها میباشد یعنی وابستگی لایه ها به یکدیگر را بقدری کاهش داد که با تغییر یک لایه خللی در کار دیگر لایه ها صورت نگیرد. البته در این تعریف منظور از کاهش وابستگی یعنی کاهش وابستگی در زمان Compile time.
در یک Clean Architecture یا به عبارتی در یک Clean DDD Architecture معمولا لایه های بدین شکل خواهند بود :
1 - Domain|Core layer
2 - Services | Application Layer
3 - Infrastructure Layer
4 - UI Layer
در لایه Domain اپلیکیشن Entitiy ها و Contract ها(interface) های قرار میگیرد و در لایه Infrastructure معمولا پیاده سازی دسترسی به داده ها و دیگر سرویس ها خارجی مانند FileLogger و SmtpNotifier میباشد.این لایه امکان دسترسی و ذخیره سازی دائمی داده ها را ممکن میسازد،همچنین اطلاعات موجود Domain Entity ها در دیتابیس یا هر store دیگری به صورت دائمی در این لایه برای ذخیره، پیاده سازی میشود.از سوی دیگر ریپازیتوری های ما در این لایه پیاده سازی میشوند.(ریپازیتوری محلی است که امکان دسترسی یه اینتیتی ها و valueObject ها را فراهم میکند).
برای پیدا کردن محل درست caching باید با وظیفه یک عامل دیگر اشنا باشیم.
Repository pattern
الگوی طراحی ریپازیتوری یک روش برای انتزاعی کردن دسترسی به داده ها به جای استفاده Concrete شده از آنها میباشد.
از جمله دلیل استفاده از این الگو جلوگیری از دوباره نویسی Query ها و همچنین امکان تغییر دیتابیس یا ORM اپلیکیشن را میتوان بر شمرد.
همانطور که گفتیم ریپازیتوری راه دسترسی ما به داده هاست ، این داده ها ممکن از از دیتابیس واکشی شوند یا اینکه از Cache خوانده شوند و از آنجایی که پیاده سازی الگوی Repository در لایه Infrastructure صورت میگیرد پس در نتیجه لایه قرارگیری caching نیز در همین لایه و در ریپازیتوری میباشد .
اما پیاده سازی caching در داخل خود ریپازیتوری چند مشکل اساسی دارد، مشکل، عدم تست پذیری و نقض اصل اول Solid یعنی Single responsibility میباشد.
برای حل این مشکل یک الگوی طراحی Structural به کمک ما می آید و با پیاده سازی آن این مشکل را حل میکنیم.
در این قسمت به بررسی یک سری از مسائل پایه پرداختیم و در قسمت بعدی این پست به طریقه پیاده سازی آن خواهیم پرداخت.
@fullStackDevs
کشینگ (Caching) چیست؟
از جمله مواردی که استفاده درست و بجا از آن به طور قابل ملاحظه ای باعث افزایش کارایی برنامه میشود Caching میباشد.درواقع Caching مکانیزمی است که داده ها را ذخیره میکند تا درخواست های آینده برای آن داده ها سریعتر انجام شود و نتیجه به کلاینت زودتر بازگشت داده شود.داده های ذخیره شده می تواند نتیجه محاسبات قبلی یا کپی ای از داده های دیگر در جای دیگری باشد.این کار برای جلوگیری از محاسبات تکراری و یا کاهش درخواست ها به دیتابیس،برای داده هایی که امکان تغییر مداوم آنها کم است و همچنین هزینه محاسبه و یا ساخت دوباره آن زیاد است، صورت میگیرد.
خوشبخانه AspNetCore از روش های مختلف Caching پشتیبانی میکند.
از جمله این روش ها به Cache In Memory و Distributed Cache می توان اشاره کرد.
روش Cache In Memory از حافظه رم سرور برای ذخیره داده های کش شده استفاده میکند. این نوع Cache متناسب برای یک سرور است و برای استفاده از این روش زمانی که چند سرور دارید از ویژگی یا تکنینک Sticky session ( که به معنی درخواست های کلاینت به همان سروری که داده ها را Cache کرده برای پردازش Route میشوند) استفاده کرد.
از روش Distributed Cache برای share کردن داده های کش شده بین چندین سرور استفاده میشود. معمولا داده ها در یک سرور خارجی نگه داشته میشوند و دیگر سرور ها به آن دسترسی دارند.
محل قرا گیری عملیات Caching در معماری پروژه هایمان کجاست؟
معماری رایج در بین وب اپلیکیشن ها غالبا یک معماری تمیز (Clean Architecture) میباشد . و ما در این پست به قرار دادن عملیات مربوط به caching در چنین معماری هایی میپردازیم.
در این قبیل معماری ها براساس اصول طراحی و قوائد تعیین شده در DDD اپلیکیشن به لایه هایی تقسیم میشود و به ترتیب داخلی ترین لایه که Domain layer میباشد و کمترین وابستگی را به یک Dll خارجی دارد و هرچه به لایه های بالاتر میرویم وابستگی لایه ها به یکدیگر بیشتر میشود. از ویژگی های یک معماری خوب Loose Coupling در بین لایه ها میباشد یعنی وابستگی لایه ها به یکدیگر را بقدری کاهش داد که با تغییر یک لایه خللی در کار دیگر لایه ها صورت نگیرد. البته در این تعریف منظور از کاهش وابستگی یعنی کاهش وابستگی در زمان Compile time.
در یک Clean Architecture یا به عبارتی در یک Clean DDD Architecture معمولا لایه های بدین شکل خواهند بود :
1 - Domain|Core layer
2 - Services | Application Layer
3 - Infrastructure Layer
4 - UI Layer
در لایه Domain اپلیکیشن Entitiy ها و Contract ها(interface) های قرار میگیرد و در لایه Infrastructure معمولا پیاده سازی دسترسی به داده ها و دیگر سرویس ها خارجی مانند FileLogger و SmtpNotifier میباشد.این لایه امکان دسترسی و ذخیره سازی دائمی داده ها را ممکن میسازد،همچنین اطلاعات موجود Domain Entity ها در دیتابیس یا هر store دیگری به صورت دائمی در این لایه برای ذخیره، پیاده سازی میشود.از سوی دیگر ریپازیتوری های ما در این لایه پیاده سازی میشوند.(ریپازیتوری محلی است که امکان دسترسی یه اینتیتی ها و valueObject ها را فراهم میکند).
برای پیدا کردن محل درست caching باید با وظیفه یک عامل دیگر اشنا باشیم.
Repository pattern
الگوی طراحی ریپازیتوری یک روش برای انتزاعی کردن دسترسی به داده ها به جای استفاده Concrete شده از آنها میباشد.
از جمله دلیل استفاده از این الگو جلوگیری از دوباره نویسی Query ها و همچنین امکان تغییر دیتابیس یا ORM اپلیکیشن را میتوان بر شمرد.
همانطور که گفتیم ریپازیتوری راه دسترسی ما به داده هاست ، این داده ها ممکن از از دیتابیس واکشی شوند یا اینکه از Cache خوانده شوند و از آنجایی که پیاده سازی الگوی Repository در لایه Infrastructure صورت میگیرد پس در نتیجه لایه قرارگیری caching نیز در همین لایه و در ریپازیتوری میباشد .
اما پیاده سازی caching در داخل خود ریپازیتوری چند مشکل اساسی دارد، مشکل، عدم تست پذیری و نقض اصل اول Solid یعنی Single responsibility میباشد.
برای حل این مشکل یک الگوی طراحی Structural به کمک ما می آید و با پیاده سازی آن این مشکل را حل میکنیم.
در این قسمت به بررسی یک سری از مسائل پایه پرداختیم و در قسمت بعدی این پست به طریقه پیاده سازی آن خواهیم پرداخت.
@fullStackDevs
blog.airbrake.io
Domain-Driven Design: What is it and how do you use it?
A detailed look at domain-driven design in software development, including basic implementation and a handful of advantages and disadvantages of its use.
Forwarded from Web Devs
#Chain_posts
#JavaScript_code_snippets
"نرم افزار ها در حال بلعیدن جهان هستند و جاوا اسکریپت در حال بلعیدن نرم افزارها. هر ساله جاوا اسکریپت در حال چیره شدن برنرم افزار ها میباشد و هیچ کسی نمیداند که در نهایت چه چیزی می تواند جایگزین آن شود."
🔸در این پست به معرفی چند code snippet در زبان جاوا اسکریپت می پردازیم که به صورت زنجیروار ادامه خواهد داشت.
🔹.all
▫️خروجی این قطعه کد true خواهد بود اگر شرط مورد نظر برای تمام عناصر آرایه true باشد و بلعکس.
const all = (arr, fn = Boolean) => arr.every(fn);
all([4, 2, 3], x => x > 1); // true
all([1, 2, 3]); // true
🔻متد every() یک تابع را بروی تمام عناصر ارایه برای مطمئن شدن از برقرار بودن شرط مورد نظر چک میکند. اگر عنصری در این آرایه نتواند شرط مورد نظر را پاس کند ، دیگر عناصر ارایه (باقیمانده) چک نخواهند شد.
🔹.allEqual
▫️خروجی قطعه کد زیر در صورت برابر بودن تمام عناصر آرایه با یکدیگر true خواهد بود
const allEqual = arr => arr.every(val => val === arr[0]);
allEqual([1, 2, 3, 4, 5, 6]); // false
allEqual([1, 1, 1, 1]); // true
🔻عملگر === در جاوا اسکریپت دو متغیر را براساس نوع و مقدار با هم مقایسه میکند.
11 === 11
▫️این قطعه کد چک خواهد کرد که دو عدد به طور تقریبی با هم برابر هستند یا خیر.
🔻در این کد کلمه کلیدی const به این معنی میباشد که متغیر تعریف شده ثابت بوده و غیر قابل تغییر در سراسر کد میباشد.
const approximatelyEqual = (v1, v2, epsilon = 0.001) => Math.abs(v1 - v2) < epsilon;
approximatelyEqual(Math.PI / 2.0, 1.5708); // true
🔻متد math.abs معادل قدر مطلق در ریاضی میباشد. خروجی یک قدر مطلق همواره عددی مثبت است.
🔹.arrayToHtmlList
▫️این قطعه کد هر عنصر از آرایه را به یک تگ <li> تبدیل کرده و انها را به یک لیست با یک ID میچسباند.
const arrayToHtmlList = (arr, listID) =>
(el => (
(el = document.querySelector('#' + listID)),
(el.innerHTML += arr.map(item => `<li>${item}</li>`).join(''))
))();
arrayToHtmlList(['item 1', 'item 2'], 'myListID');
🔻متد arr.map() یک non-mutating متد بوده (یعنی باعث تغییر آرایه پدر نمیشود) و کار آن ساخت ارایه جدید به وسیله صدا زدن یک تابع بروی هریک از عناصر آرایه پدرمیباشد.
@FullStackDevs
#JavaScript_code_snippets
"نرم افزار ها در حال بلعیدن جهان هستند و جاوا اسکریپت در حال بلعیدن نرم افزارها. هر ساله جاوا اسکریپت در حال چیره شدن برنرم افزار ها میباشد و هیچ کسی نمیداند که در نهایت چه چیزی می تواند جایگزین آن شود."
🔸در این پست به معرفی چند code snippet در زبان جاوا اسکریپت می پردازیم که به صورت زنجیروار ادامه خواهد داشت.
🔹.all
▫️خروجی این قطعه کد true خواهد بود اگر شرط مورد نظر برای تمام عناصر آرایه true باشد و بلعکس.
const all = (arr, fn = Boolean) => arr.every(fn);
all([4, 2, 3], x => x > 1); // true
all([1, 2, 3]); // true
🔻متد every() یک تابع را بروی تمام عناصر ارایه برای مطمئن شدن از برقرار بودن شرط مورد نظر چک میکند. اگر عنصری در این آرایه نتواند شرط مورد نظر را پاس کند ، دیگر عناصر ارایه (باقیمانده) چک نخواهند شد.
🔹.allEqual
▫️خروجی قطعه کد زیر در صورت برابر بودن تمام عناصر آرایه با یکدیگر true خواهد بود
const allEqual = arr => arr.every(val => val === arr[0]);
allEqual([1, 2, 3, 4, 5, 6]); // false
allEqual([1, 1, 1, 1]); // true
🔻عملگر === در جاوا اسکریپت دو متغیر را براساس نوع و مقدار با هم مقایسه میکند.
11 === 11
// => true
11=== '11' // => false
🔹. approximatelyEqual▫️این قطعه کد چک خواهد کرد که دو عدد به طور تقریبی با هم برابر هستند یا خیر.
🔻در این کد کلمه کلیدی const به این معنی میباشد که متغیر تعریف شده ثابت بوده و غیر قابل تغییر در سراسر کد میباشد.
const approximatelyEqual = (v1, v2, epsilon = 0.001) => Math.abs(v1 - v2) < epsilon;
approximatelyEqual(Math.PI / 2.0, 1.5708); // true
🔻متد math.abs معادل قدر مطلق در ریاضی میباشد. خروجی یک قدر مطلق همواره عددی مثبت است.
🔹.arrayToHtmlList
▫️این قطعه کد هر عنصر از آرایه را به یک تگ <li> تبدیل کرده و انها را به یک لیست با یک ID میچسباند.
const arrayToHtmlList = (arr, listID) =>
(el => (
(el = document.querySelector('#' + listID)),
(el.innerHTML += arr.map(item => `<li>${item}</li>`).join(''))
))();
arrayToHtmlList(['item 1', 'item 2'], 'myListID');
🔻متد arr.map() یک non-mutating متد بوده (یعنی باعث تغییر آرایه پدر نمیشود) و کار آن ساخت ارایه جدید به وسیله صدا زدن یک تابع بروی هریک از عناصر آرایه پدرمیباشد.
@FullStackDevs
This media is not supported in your browser
VIEW IN TELEGRAM
🔰Microsoft Build (For developers by developers )
❇️ Free digital event
Starts: May 19, 2020 at 8 AM Pacific Time
Ends: May 21, 2020 at 8 AM Pacific Time
📢 @FullStackDevs
❇️ Free digital event
Starts: May 19, 2020 at 8 AM Pacific Time
Ends: May 21, 2020 at 8 AM Pacific Time
📢 @FullStackDevs
Forwarded from Web Devs
#SVG
#ScalableVectorGraphics
🔻 این SVG چیست و چرا باید از آن استفاده کنیم؟
ما می خواهیم تا همه تصاویر و ترسیمات در سایت هایی که خلق می کنیم به بهترین، زیباترین، و با کیفیت ترین حالت ممکن قابل مشاهده باشند. همچنین بدلیل Performance و یا همان کارایی می خواهیم اندازه فایل را کم نگه داریم. برای رسیدن به این هدف در مورد آیکون ها، لوگوها و ترسیمات ساده در سایت فقط یک راه وجود دارد.
➖ ما به عنوان طراح سایت میخواهیم که تصاویری داشته باشیم که به هر اندازه که بخواهیم بزرگشان کنیم و کیفیتشان از بین نرود که با SVG امکان پذیراست اما قبل تر با وجود مرورگرهای قدیمی ما را از استفاده از چنین قابلیتی دور نگه می داشت. اما خوشبختانه امروزه می توان از این قابلیت بهره برد.
➖ این بدین معنی نیست که در آینده نزدیک از تصاویری با فرمت های PNG، JPG و غیره دیگر استفاده نمی شود، نه، بلکه آنها همچنان کاربرد خود را در وب خواهند داشت و در کنار SVG به حیات خود در دنیای وب ادامه خواهند داد.
🔻 حالا SVG چیست؟
SVG (Scalable Vector Graphics)
در دنیای کامپیوتر ترسیمات می توانند از دو نوع Raster یا Vector باشند.
➖ در Raster Graphics یا گرافیک شطرنجی تصویر به صورت مجموعه ای از پیکسل‌ها ذخیره میشود و رنگ هر پیکسل به طور جداگانه ذخیره میشود. تغییر اندازه این تصاویر کیفیت آنها را تحث تاثیر قرار می دهد. اکثر فرمت‌های رایج فایل‌های تصویری مانند jpg، gif، و bmp بر مبنای گرافیک شطرنجی هستند.
➖ در Vector Graphics یا گرافیک برداری روشی در تولید و ذخیرهٔ فایل‌های تصویری کامپیوتری است که در آن تصویر در قالب مجموعه‌ای از مشخصات هندسی نقاط، خط‌ها، منحنی‌ها و چندضلعی‌ها ذخیره میشود. واژهٔ «بردار» در این کاربرد معنایی وسیع‌تر از یک خط راست دارد.
➖ تصاویر تعریف شده به کمک گرافیک برداری، از خطوط و منحنی‌هایی به نام بردار تشکیل شده‌اند که به صورت ریاضی تعریف میشوند. اجزای این تصاویر را میتوان بدون از دست دادن کیفیت به راحتی جا به جا کرد و تغییر اندازه داد.
➖ این تصاویر مستقل از رزولوشن هستند و میتوان آنها را بزرگ و کوچک کرد و در هر رزولوشن بدون از دست دادن جزئیات و وضوح چاپ کرد. یکی از شناخته شده ترین فرمت‌های ذخیرهٔ فایل‌های گرافیک برداری، فرمت SVG است.
➖ در SVG بر اساس XML است این یعنی سینتکس آن خیلی هم غریبه نخواهد بود و به HTML شباهت دارد. به این صورت که برای ترسیم شکل های مختلف تگ های مختلف وجود دارد مثلا برای ترسیم دایره از تگ
ادامه در پست بعدی ...
@fullStackDevs
#ScalableVectorGraphics
🔻 این SVG چیست و چرا باید از آن استفاده کنیم؟
ما می خواهیم تا همه تصاویر و ترسیمات در سایت هایی که خلق می کنیم به بهترین، زیباترین، و با کیفیت ترین حالت ممکن قابل مشاهده باشند. همچنین بدلیل Performance و یا همان کارایی می خواهیم اندازه فایل را کم نگه داریم. برای رسیدن به این هدف در مورد آیکون ها، لوگوها و ترسیمات ساده در سایت فقط یک راه وجود دارد.
➖ ما به عنوان طراح سایت میخواهیم که تصاویری داشته باشیم که به هر اندازه که بخواهیم بزرگشان کنیم و کیفیتشان از بین نرود که با SVG امکان پذیراست اما قبل تر با وجود مرورگرهای قدیمی ما را از استفاده از چنین قابلیتی دور نگه می داشت. اما خوشبختانه امروزه می توان از این قابلیت بهره برد.
➖ این بدین معنی نیست که در آینده نزدیک از تصاویری با فرمت های PNG، JPG و غیره دیگر استفاده نمی شود، نه، بلکه آنها همچنان کاربرد خود را در وب خواهند داشت و در کنار SVG به حیات خود در دنیای وب ادامه خواهند داد.
🔻 حالا SVG چیست؟
SVG (Scalable Vector Graphics)
در دنیای کامپیوتر ترسیمات می توانند از دو نوع Raster یا Vector باشند.
➖ در Raster Graphics یا گرافیک شطرنجی تصویر به صورت مجموعه ای از پیکسل‌ها ذخیره میشود و رنگ هر پیکسل به طور جداگانه ذخیره میشود. تغییر اندازه این تصاویر کیفیت آنها را تحث تاثیر قرار می دهد. اکثر فرمت‌های رایج فایل‌های تصویری مانند jpg، gif، و bmp بر مبنای گرافیک شطرنجی هستند.
➖ در Vector Graphics یا گرافیک برداری روشی در تولید و ذخیرهٔ فایل‌های تصویری کامپیوتری است که در آن تصویر در قالب مجموعه‌ای از مشخصات هندسی نقاط، خط‌ها، منحنی‌ها و چندضلعی‌ها ذخیره میشود. واژهٔ «بردار» در این کاربرد معنایی وسیع‌تر از یک خط راست دارد.
➖ تصاویر تعریف شده به کمک گرافیک برداری، از خطوط و منحنی‌هایی به نام بردار تشکیل شده‌اند که به صورت ریاضی تعریف میشوند. اجزای این تصاویر را میتوان بدون از دست دادن کیفیت به راحتی جا به جا کرد و تغییر اندازه داد.
➖ این تصاویر مستقل از رزولوشن هستند و میتوان آنها را بزرگ و کوچک کرد و در هر رزولوشن بدون از دست دادن جزئیات و وضوح چاپ کرد. یکی از شناخته شده ترین فرمت‌های ذخیرهٔ فایل‌های گرافیک برداری، فرمت SVG است.
➖ در SVG بر اساس XML است این یعنی سینتکس آن خیلی هم غریبه نخواهد بود و به HTML شباهت دارد. به این صورت که برای ترسیم شکل های مختلف تگ های مختلف وجود دارد مثلا برای ترسیم دایره از تگ
<circle/>استفاده می شود و در نهایت همه اشکال، درون یک تگ
<svg />قرار می گیرند.
ادامه در پست بعدی ...
@fullStackDevs
Wikipedia
گرافیک شطرنجی
نگاشتار شطرنجی یا گرافیک شطرنجی (به انگلیسی: Raster Graphics) روشی از گرافیک است که به وسیله تقسیم کردن تصویر به چهارخانه‌های کوچک یا عناصر کوچک تصویر که پیکسل نام دارند ساخته میشود. پیکسل‌ها، محتوای اطلاعاتی مثل حافظ، کنترل شفافیت و رنگ میباشند. این اطلاعات…
Forwarded from Web Devs
ادامه پست قبل
🔻 چرا SVG ؟
🔹 مستقل از رزولوشن
یکی از نقاط قوت SVG این است که در صفحه نمایش هایی با کیفیت بسیار بالا هم به بهترین شکل نمایش داده می شود و کیفیتش تغییر نمی کند. برخلاف تصاویر Raster که کیفیت خود را از دست می دهند و مجبوریم برای صفحه نمایش هایی با کیفیت بالاتر نسخه با کیفیت تری از تصویر را نمایش دهیم.
دیگر مهم نیست اندازه تصویر چه باشد، یا چقدر کاربر Zoom کند و یا اینکه کیفیت صفحه نمایش کاربر چه اندازه باشد. در همه این موارد SVG قصه ما همان حالت با کیفیت و تیزش را حفظ می کند.
🔸 سازگار با CSS
از اونجایی که SVG هم مثل HTML یک markup است می تواند Class یا css داشته باشد و از آن طریق در css می تواند در دسترس باشد.
پس می توانیم روی ترسیمات برداری از طریق css کارهای زیادی انجام دهیم که این کار برای ترسیمات Raster امکان پذیر نمی باشد.
فرض کنید مستطیلی را از طریق SVG ساخته ایم می توانیم رنگ آن را بصورت های مختلف تغییر دهیم ولی اگر همان مستطیل از نوع تصاویر معمولی مثلا با فرمت PNG بود می توان گفت دیگر این امکان برای ما وجود نداشت.
🔹 تعامل پذیری ساده از طریق Javascript
به همان دلیلی که SVG با CSS سازگار است می توان گفت که به راحتی می توان از طریق جاواسکریپت با آن تعامل داشت و مواردی مثل انیمیشن و غیره را به راحتی پیاده و در نتیجه تجربه کاربری و تعاملی خوبی را به سادگی برای کاربر مهیا کرد.
🔸 درخواست HTTP کمتر
هر زمان که بواسطه تگ <img> از تصویری به صورت عادی در یک صفحه وب استفاده کنید مرورگر برای ترسیم آن تصویر یک درخواست HTTP به سرور می فرستد تا تصویر را از سرور گرفته و نمایش دهد. اگر از روش خطی برای SVG استفاده کنیم SVG بصورت مستقیم در فایل HTML قرار دارد و دیگر نیازی به یک درخواست جداگانه برای تصویر ما نخواهد بود.
🔹 ویرایش ساده
برای تغییر یک فایل SVG فقط به یک ویرایشگر متن نیاز داریم این یعنی در همان محیط کدنویسی می توانیم ویراش مورد نظرمان را انجام دهیم. اما اگر یک تصویر Raster را بخواهیم ویرایش کنیم باید به فوتوشاب یا مشابه آن پناه ببریم.
🔸 حجم فایل کمتر
ترسیمات وکتور معمولا حجم کمتری را می گیرند مخصوصا اگر شکل و طرح ساده ای داشته باشند. پس فایل تصویر ما سایز کمتری خواهد داشت. همچنین فشرده سازی بصورت بهتری روی SVG اعمال می شود. پس می توان از نظر سایز صفحه وب هم با استفاده از SVG صرفه جویی داشته باشیم که از نظر کارایی کمک بسیار خوبی برای سایت ما خواهد بود.
🔹طراحی واکنشگرا
اگر تصویر شما می تواند بصورت SVG باشد دیگر نگرانی برای واکنشگرا بودن آن نخواهید داشت. ولی در صورت استفاده از تصاویری با فرمت PNG یا JPG شاید مجبور شوید تا در صفحه نمایش های مختلف نسخه های مختلفی از آن تصاویر را قرار دهید.
✔️ بهترین موارد استفاده SVG :
▪️ آیکون ها
▫️ ترسیمات ساده مثل شکل های مختلف
▪️ بنرهای تبلیغاتی
▫️ ترسیمات متحرک
▪️ اینفوگراف ها و مصورسازی داده ها
می باشند.
🌀 واضح است که اگر تصویری از یک منظره داشته باشیم که توسط یک عکاس گرفته شده است، نمایش آن بوسیله SVG منطقی نخواهد بود چرا که در این مورد حجم فایل به مراتب بیشتر از فرمت PNG یا JPG خواهد بود.
@fullStackDevs
🔻 چرا SVG ؟
🔹 مستقل از رزولوشن
یکی از نقاط قوت SVG این است که در صفحه نمایش هایی با کیفیت بسیار بالا هم به بهترین شکل نمایش داده می شود و کیفیتش تغییر نمی کند. برخلاف تصاویر Raster که کیفیت خود را از دست می دهند و مجبوریم برای صفحه نمایش هایی با کیفیت بالاتر نسخه با کیفیت تری از تصویر را نمایش دهیم.
دیگر مهم نیست اندازه تصویر چه باشد، یا چقدر کاربر Zoom کند و یا اینکه کیفیت صفحه نمایش کاربر چه اندازه باشد. در همه این موارد SVG قصه ما همان حالت با کیفیت و تیزش را حفظ می کند.
🔸 سازگار با CSS
از اونجایی که SVG هم مثل HTML یک markup است می تواند Class یا css داشته باشد و از آن طریق در css می تواند در دسترس باشد.
پس می توانیم روی ترسیمات برداری از طریق css کارهای زیادی انجام دهیم که این کار برای ترسیمات Raster امکان پذیر نمی باشد.
فرض کنید مستطیلی را از طریق SVG ساخته ایم می توانیم رنگ آن را بصورت های مختلف تغییر دهیم ولی اگر همان مستطیل از نوع تصاویر معمولی مثلا با فرمت PNG بود می توان گفت دیگر این امکان برای ما وجود نداشت.
🔹 تعامل پذیری ساده از طریق Javascript
به همان دلیلی که SVG با CSS سازگار است می توان گفت که به راحتی می توان از طریق جاواسکریپت با آن تعامل داشت و مواردی مثل انیمیشن و غیره را به راحتی پیاده و در نتیجه تجربه کاربری و تعاملی خوبی را به سادگی برای کاربر مهیا کرد.
🔸 درخواست HTTP کمتر
هر زمان که بواسطه تگ <img> از تصویری به صورت عادی در یک صفحه وب استفاده کنید مرورگر برای ترسیم آن تصویر یک درخواست HTTP به سرور می فرستد تا تصویر را از سرور گرفته و نمایش دهد. اگر از روش خطی برای SVG استفاده کنیم SVG بصورت مستقیم در فایل HTML قرار دارد و دیگر نیازی به یک درخواست جداگانه برای تصویر ما نخواهد بود.
🔹 ویرایش ساده
برای تغییر یک فایل SVG فقط به یک ویرایشگر متن نیاز داریم این یعنی در همان محیط کدنویسی می توانیم ویراش مورد نظرمان را انجام دهیم. اما اگر یک تصویر Raster را بخواهیم ویرایش کنیم باید به فوتوشاب یا مشابه آن پناه ببریم.
🔸 حجم فایل کمتر
ترسیمات وکتور معمولا حجم کمتری را می گیرند مخصوصا اگر شکل و طرح ساده ای داشته باشند. پس فایل تصویر ما سایز کمتری خواهد داشت. همچنین فشرده سازی بصورت بهتری روی SVG اعمال می شود. پس می توان از نظر سایز صفحه وب هم با استفاده از SVG صرفه جویی داشته باشیم که از نظر کارایی کمک بسیار خوبی برای سایت ما خواهد بود.
🔹طراحی واکنشگرا
اگر تصویر شما می تواند بصورت SVG باشد دیگر نگرانی برای واکنشگرا بودن آن نخواهید داشت. ولی در صورت استفاده از تصاویری با فرمت PNG یا JPG شاید مجبور شوید تا در صفحه نمایش های مختلف نسخه های مختلفی از آن تصاویر را قرار دهید.
✔️ بهترین موارد استفاده SVG :
▪️ آیکون ها
▫️ ترسیمات ساده مثل شکل های مختلف
▪️ بنرهای تبلیغاتی
▫️ ترسیمات متحرک
▪️ اینفوگراف ها و مصورسازی داده ها
می باشند.
🌀 واضح است که اگر تصویری از یک منظره داشته باشیم که توسط یک عکاس گرفته شده است، نمایش آن بوسیله SVG منطقی نخواهد بود چرا که در این مورد حجم فایل به مراتب بیشتر از فرمت PNG یا JPG خواهد بود.
@fullStackDevs
Telegram
Web Devs
#SVG
#ScalableVectorGraphics
🔻 این SVG چیست و چرا باید از آن استفاده کنیم؟
ما می خواهیم تا همه تصاویر و ترسیمات در سایت هایی که خلق می کنیم به بهترین، زیباترین، و با کیفیت ترین حالت ممکن قابل مشاهده باشند. همچنین بدلیل Performance و یا همان کارایی می خواهیم…
#ScalableVectorGraphics
🔻 این SVG چیست و چرا باید از آن استفاده کنیم؟
ما می خواهیم تا همه تصاویر و ترسیمات در سایت هایی که خلق می کنیم به بهترین، زیباترین، و با کیفیت ترین حالت ممکن قابل مشاهده باشند. همچنین بدلیل Performance و یا همان کارایی می خواهیم…