#JS
#slice
#prototype
#trick
🌀 معرفی متد slice در جاوا اسکریپت :
Array.prototype.slice()

Syntax

slice()
slice(start)
slice(start, end)

✅ متد slice عناصر انتخاب شده را در یک آرایه به عنوان یک شی آرایه جدید برمی گرداند.
❕ دو تا پارامتر داره که start تا end ایندکس عناصر انتخاب شده را مشخص میکند. اگر فقط پارامتر start را مقدار بدید یعنی از مقدار ایندکس start ارایه تا انتهای عنصر ارایه انتخاب شود. مثال زیر را در نظر بگیرید :

const fruits = ['apple', 'banana', 'orange', 'Pineapple', 'Strawberry'];

console.log(fruits.slice(2));
// expected output: Array ["orange ", " Pineapple ", "Strawberry"]

console.log(fruits.slice(2, 4));
// expected output: Array ["orange ", " Pineapple "]

‼️ نکته: برای انتخاب از انتهای رشته از یک عدد منفی استفاده کنید (زمانی که شما پارامتر های start , end را مقدار منفی بدید کاملا برعکس مقدار مثبت عمل میکند):

  var fruits = ['apple', 'banana', 'orange', 'Pineapple', 'Strawberry'];
  var myBest = fruits.slice(-3, -1);
// expected output: Array ["orange ", " Pineapple "]

string.prototype.slice()

✅ متد slice در prototype استرینگ هم وجود دارد و قسمتهایی از یک رشته را استخراج کرده و قسمتهای استخراج شده را در یک رشته جدید برمی گرداند و پارامتر های شروع و پایان برای انتخاب شروع پایان رشته را نیز دارد.

var str = "Hello world!";
var res = str.slice(3, 8);
// expected output: "lo world! "

❗️ حالا تصور کنید میخوایید اعداد تک رقمی را دو رقمی نمایش دهید مانند نمایش ماه یا روز در تاریخ به صورت زیر :
1400/02/09

برای اینکه اعداد کوچکتراز ده ما همیشه دو رقمی نمایش داده شود و if و else هم استفاده نکنیم کافی است از همین متد slice استفاده کنیم به این صورت که یک “0” سمت چپ عدد ماه قرار میدیم و از انتها 2 کاراکتر از سمت راست یا انتها (2-) بر میداریم . بصورت زیر :

var myNumber = 7;
var myNumber2 = 11;
var formattedNumber = ("0" + myNumber).slice(-2);
// expected formattedNumber: 07

var formattedNumber2 = ("0" + myNumber2).slice(-2);
// expected formattedNumber2: 11

@fullStackDevs

#LoopOptimizations

Loop Optimizations in C# (and various other compilers)


This post comprises infographics showing various loop optimizations that happen in C# (dotnet).

🔗 Link

@fullStackDevs

#NetCore
#NewVersion

✅ دات نت ورژن 5.0.6 منتشر شد. با قابلیت نصب دات نت بر روی Ubuntu ورژن 21.04 و Fedora ورژن 34 .


https://devblogs.microsoft.com/dotnet/net-may-2021/



✅ می توانید نسخه های 5.0.6 ، 3.1.15 ، 2.1.28 را برای ویندوز ، macOS و Linux برای x86 ، x64 ، Arm32 و Arm64 بارگیری کنید.



** Improvements

ASP.NET Core : 5.0.6 | 3.1.15
CoreFx: 2.1.28
CoreCLR: 3.1.15
Extensions: 3.1.15
Runtime : 5.0.6
Winforms: 5.0.6

@fullStackDevs

#Flexbox

🔰Flexbox Grid System

🔸بسیاری از توسعه دهندگان با سیستم های گریدی css مانند بوت استرپ اشنا هستند. که درگذشته با استفاده از float و مقادیر درصدی برای width المنت ها، پیاده سازی شده اند.

🔹اما امروزه مرورگر ها پیشترفته تر شده اند و به خوبی از flexbox پشتیبانی میکنند.
از همین رو استفاده از یک گرید سیستم بر پایه flexbox مزایای شاخص داری را، ارائه میدهد.


▫️simpler syntax
▫️ equal height columns
▫️ reordering sibling content

🔹بوت استرپ 4 از یک flex grid سیستم برخوردار است.
اکنون به برسی یک سری general structure در سیستم گرید و نحوه پیاده سازی انها میپردازیم.

▪️Rows
ساختار کلی مانند دیگر سیستم های قدیمی گرید است. با ساختاری مانند یک parent row و column های child، در نتیجه flex container تان به این شکل خواهد بود :
.row {
display: flex;
flex-wrap: wrap;
margin-left: -1rem;
margin-right: -1rem;
}

🔻 پراپرتی flex-wrap مشخص میکند که در حالت فلکس باکس ،فلکس ایتم ها فقط در یک خط کنار هم بیایند و یا به خط بعدی منتقل شوند.

▪️Columns
برای تعریف یک base class برای Columns این گونه کد مینویسیم :
.col {
flex-grow: 1;
flex-basis: 100%;
padding-left: 1rem;
padding-right: 1rem;
}

🔻با پراپرتی flex-grow می توانیم عرض آیتم یا آیتم هایی که با حالت Flexbox درون یک تگ container صفحه آرایی شدند افزایش دهیم.

▪️Flex-direction
جهت چینش عناصر داخلی یا فرزند هارا در المنت پدر مشخص میکند.

🔻با پرارپتی flex-basisمی توان به هر عنصر یک مقدار اختصاص داد و این مقدار با توجه به جهت عنصر نگهدارنده به عرض یا ارتقاع به صورت خودکار تعلق میگیرد یعنی اگر جهت عنصر نگهدارنده row باشد این مقدار به عرض عنصرهای داخلی داده می شود و اگر column باشد به ارتقاع عنصرهای داخلی تعلق میگیرد

▪️justify-content
با این پراپرتی , فلکس ایتم ها یا المنت های فرزند در جهت افقی چینش میشوند.

▪️align-items
با این پراپرتی , فلکس ایتم ها یا المنت های فرزند در جهت عمودی چینش میشوند.

▪️align-content
این پراپرتی رفتار flex-wrap را تغییر میدهد و مشابه پراپرتی align-items میباشد با این تفاوت که به جای align کردن فلکس ایتم ها، فلکش لاین ها را چینش میکند. در این حالت باید فلکس ایتم ها بیشتر از چند line باشند تا مقادیر این پراپرتی بر روی انها تاثیر بگذارد.


@fullStackDevs

#Netcore
#DiagnosticSource


🔰DiagnosticSource

🔹مجموعه ای ساده و کاربردی از api ها که از طریق نوگت پکیج
System.Diagnostics.DiagnosticSource
در دسترش میباشد.
🔸بدین ترتیب دیگر لایبری ها مانند EF , SqlClient و ... با استفاده از DiagnosticSource ایونت هایی را در سیستم تحت یک نام مرتبط، ارسال میکنند و اپلیکیشن با دریافت این ایونت ها، آنها را پردازش میکند.
🔸 هر ایونتی که ارسال میشود علاوه بر نام، یک payload هم به همراه دارد و از انجایی که پردازش ایونت در همان فرایند ارسال اتفاق می افتد، این اطلاعات (payload) میتواند شامل هرنوع آبجکتی بدون نیاز به سریالایز یا دیسریالاز شدن باشد.

🔸همچنین DiagnosticSource در
AspNetCore و EntityFrameworkCore و HttpClient و SqlClient
نیز استفاده شده است و این قابلیت را به developer میدهد تا در خواست های ورودی و خروجی , دیتابیس کوئری ها را رهگیری (intercept) کند.
همچنین دسترسی به آبجکت هایی نظیر
HttpContext, DbConnection, DbCommand, HttpRequestMessage
و بسیاری دیگر امکان پذیر است و میتوانید در ایونت ارسال شده اگه نیاز باشد تغییراتی در آنها ایجاد کنید.


🔹 هدف از توضیح و معرفی DiagnosticSource در این پست این بود که گرچه DiagnosticSource چیزی جدیدی نیست اما دانستن اطلاعاتی در مورد آن میتواند در چالش های پیش رو به کمک ما بیاد
برای مثال Interceptor ها از نسخه 3.0 به Ef Core اضافه شدند و پیش از آن در نسخه های قبلی Ef Core پیاده سازی نشده بودند.
و امکان استفاده از Interceptor ها در نسخه های پایینتر Ef core وجود نداشت و برای این منظور میتوانیم از Diagnostic listener ها استفاده کنیم.

🔻 نکته : Diagnostic listener ها با Interceptor متفاوت هستند برای مثال یک Interceptor برای هر نمونه از DbContext رجیستر میشود در حالی که با Diagnostic listener میتوانید از ایونت های ارسال شده همه DbContext instance ها در اطلاعات, (payload) دریافت کنید.

🔹در asp core سه سیستم وجود دارد که از آنها برای logging می توان استفاده کرد که یک مورد آن DiagnosticSource میباشد. مورد بعدی سیستم ILogger است که استفاده از آن بسیار رایج است .
🔸اما یک تفاوت مهم وجود دارد و آن اینکه asp core از سیستم DiagnosticSource برای ایونت های مرتبط با زیر ساخت فریم وورک و از سیستم ILogger برای tracing جریان پراسس های اپلیکیشن استفاده میکند.

نمونه سورس کدی که از DiagnosticSource برای log ایونت ها استفاده شده است .


@fullStackDevs

#Js
#AccessToDevice

New Standards to Access Device Hardware using JavaScript

WebHID, WebNFC, and WebUSB have opened up new avenues to interact with user’s device hardware for web apps.


آیا تاکنون نیاز به دسترسی به سخت افزار دستگاه کاربر و پیاده سازی یک برنامه دسک تاپ فقط برای آن ویژگی پیدا کرده اید؟ تو تنها نیستی. تا همین اواخر ، راه دستیابی به موارد فوق دور از ذهن و دست و پا گیر بود. با این حال ، با به روزرسانی های اخیر Chrome DevTools ، صحبت با سخت افزار با استفاده از JavaScript به واقعیت تبدیل شده است.


https://blog.bitsrc.io/new-standards-to-access-user-device-hardware-using-javascript-86b0c156dd3d

@fullStackDevs

#Brave

ظاهرا رقیب گوگل از راه رسید

نسخه بتای موتور جستجوی Brave در اختیار کاربران جهانی

▪️ موتور جستجوی Brave درون مرورگر (دانلود ) این شرکت قرار گرفته و از طریق آدرس search‌.‌brave‌.‌com در دسترس است. Brave می‌گوید در آینده یک نسخه پولی از این سرویس را بدون تبلیغات عرضه می‌کند ولی در حال حاضر نسخه رایگان آن را با تبلیغات معمولی در اختیار کاربران قرار می‌دهد.

▫️ ین موتور جستجو با تمرکز بر حریم خصوصی و شفافیت ساخته شده و می‌گوید فعالیت‌های شما را ردیابی نمی‌کند.

@fullStackDevs

Advanced C# - Understand the implementation details of readonly and how it affects performance of your C# applications.

🔴 Don't forget to like, Share and Subscribe!

#csharp

https://youtu.be/6T5pE1pPBd8

#GitHub
#Copilot

‼️ ابزار جدید GitHub ساخته شده با هوش مصنوعی برای برنامه نویسان و توسعه دهندگان.

این ابزار GitHub Copilot نام دارد که از سیستم هوش مصنوعی ساخته شده توسط شرکت OpenAI استفاده میکند.
این سیستم میتواند با استفاده از درک متن کدی که برنامه نویس نوشته است خطوط و توابع کامل را به برنامه نویس پیشنهاد دهد.

این ابزار از طیف گسترده ای از زبان ها را پشتیبانی میکند ولی در حال حاضر با پایتون و جاوا نتایج بهتری میدهد.
github copilot
About GitHub Copilot telemetry
Introducing GitHub Copilot: your AI pair programmer

@fullStackDevs

#Angular

Designing Scalable Angular Apps: Pages, Containers and Views

Terminology and a methodology that would help you build a scalable Angular application

http://amp.gs/jjtsl

@fullStackDevs

#OneLineCode
#Readability


🔰 فرض کنید software Developer یک شرکت هستید و task ای به شما داده می شود تا برای حل یک مسئله پیچیده یک الگوریم و یا راه حل پیدا کنید.

🔶 شما کار را با پیدا کردن هر راه حل ممکن برای حل کردن مسئله شروع میکنید. بعد از مدتی بلاخره یک راه حل کاری پیدا میکنید اما فکر میکنید که این راه حل بسیار طولانی و شلوغ است پس فکر میکنید که :

🔶 حتما باید راه حلی هوشمندانه تر و سریعتری برای حل این مسئله وجود داشته باشه.

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

🔹پس پیش سنیور دولوپر خود میروید و راه حل خود را ارائه میدهید و او میگوید :

دوباره انجامش بده !!!

چرا!!!!؟؟

🔰در توسعه نرم افزار هدف نوشتن کدی است که بقیه بتوانند آنرا بفهوند نه کدی که از بقیه کوتاه تر باشد چون برای ما Readability اهمیت دارد.


@fullStackDevs

#miro
میرو یا Miro یک پلت فرم آنلاین وایت برد مشترک است که تیم های توزیع شده را قادر می سازد تا به طور موثر با یکدیگر کار کنند ، از طوفان مغزی با یادداشت های مهم دیجیتالی و ترسیم فلوچارت گرفته تا ایجاد تسک و بک لاگ و برنامه ریزی و مدیریت گردش کار اجایل.
https://vimeo.com/362858018

https://miro.com


@fullStackDevs

#CleanArchitecture


CleanArchitecture

Clean Architecture Solution Template for .NET 5 Web Api

This is a solution template for creating Web Api ASP.NET Core following the principles of Clean Architecture.

Technologies

▫️ASP.NET Core 5
▪️Entity Framework Core 5
▫️ABluePredicateBuilder
▪️MediatR
▫️AutoMapper
▪️FluentValidation
▫️NUnit
▪️Docker


Features
🔸Event sourcing
🔹CQRS with MediatR Library
🔸MediatR Pipeline Logging & Validation
🔹Swagger UI
🔸Response Wrappers
🔹Pagination
🔸filter and sorting like ODATA with ABluePredicateBuilder
🔹In-Memory Caching
🔸In-Memory Database
🔹Custom Exception Handling Middlewares
🔸Fluent Validation
🔹Automapper
🔸Complete User Management Module (Register / Generate Token / Refresh token /Forgot Password / Confirmation Mail)
🔹User Auditing

Link : https://github.com/armanab/CleanArchitecture

@fullStackDevs

#Netcore
#DiagnosticSource


🔰DiagnosticSource

🔹مجموعه ای ساده و کاربردی از api ها که از طریق نوگت پکیج
System.Diagnostics.DiagnosticSource
در دسترش میباشد.
🔸بدین ترتیب دیگر لایبری ها مانند EF , SqlClient و ... با استفاده از DiagnosticSource ایونت هایی را در سیستم تحت یک نام مرتبط، ارسال میکنند و اپلیکیشن با دریافت این ایونت ها، آنها را پردازش میکند.
🔸 هر ایونتی که ارسال میشود علاوه بر نام، یک payload هم به همراه دارد و از انجایی که پردازش ایونت در همان فرایند ارسال اتفاق می افتد، این اطلاعات (payload) میتواند شامل هرنوع آبجکتی بدون نیاز به سریالایز یا دیسریالاز شدن باشد.

🔸همچنین DiagnosticSource در
AspNetCore و EntityFrameworkCore و HttpClient و SqlClient
نیز استفاده شده است و این قابلیت را به developer میدهد تا در خواست های ورودی و خروجی , دیتابیس کوئری ها را رهگیری (intercept) کند.
همچنین دسترسی به آبجکت هایی نظیر
HttpContext, DbConnection, DbCommand, HttpRequestMessage
و بسیاری دیگر امکان پذیر است و میتوانید در ایونت ارسال شده اگه نیاز باشد تغییراتی در آنها ایجاد کنید.


🔹 هدف از توضیح و معرفی DiagnosticSource در این پست این بود که گرچه DiagnosticSource چیزی جدیدی نیست اما دانستن اطلاعاتی در مورد آن میتواند در چالش های پیش رو به کمک ما بیاد
برای مثال Interceptor ها از نسخه 3.0 به Ef Core اضافه شدند و پیش از آن در نسخه های قبلی Ef Core پیاده سازی نشده بودند.
و امکان استفاده از Interceptor ها در نسخه های پایینتر Ef core وجود نداشت و برای این منظور میتوانیم از Diagnostic listener ها استفاده کنیم.

🔻 نکته : Diagnostic listener ها با Interceptor متفاوت هستند برای مثال یک Interceptor برای هر نمونه از DbContext رجیستر میشود در حالی که با Diagnostic listener میتوانید از ایونت های ارسال شده همه DbContext instance ها در اطلاعات, (payload) دریافت کنید.

🔹در asp core سه سیستم وجود دارد که از آنها برای logging می توان استفاده کرد که یک مورد آن DiagnosticSource میباشد. مورد بعدی سیستم ILogger است که استفاده از آن بسیار رایج است .
🔸اما یک تفاوت مهم وجود دارد و آن اینکه asp core از سیستم DiagnosticSource برای ایونت های مرتبط با زیر ساخت فریم وورک و از سیستم ILogger برای tracing جریان پراسس های اپلیکیشن استفاده میکند.

نمونه سورس کدی که از DiagnosticSource برای log ایونت ها استفاده شده است .


@fullStackDevs

#Slack

Slack added this nice and cool quick voice calls, which is super useful

Can share screen and draw on it together with the team

Useful especially when you just need to quickly discuss something and don't have to worry about creating a meeting, calendar invite etc


اسلک این تماس های صوتی سریع و زیبا را اضافه کرد که بسیار مفید است

می توانید صفحه را به اشتراک بگذارید و همراه با تیم روی آن ترسیم کنید

مفید است به ویژه هنگامی که شما فقط نیاز دارید که به سرعت در مورد موضوعی بحث کنید و نگران ایجاد یک جلسه ، دعوت تقویم و غیره نباشید

@fullStackDevs

#JS
#slice
#prototype
#trick
🌀 معرفی متد slice در جاوا اسکریپت :
Array.prototype.slice()

Syntax

slice()
slice(start)
slice(start, end)

✅ متد slice عناصر انتخاب شده را در یک آرایه به عنوان یک شی آرایه جدید برمی گرداند.
❕ دو تا پارامتر داره که start تا end ایندکس عناصر انتخاب شده را مشخص میکند. اگر فقط پارامتر start را مقدار بدید یعنی از مقدار ایندکس start ارایه تا انتهای عنصر ارایه انتخاب شود. مثال زیر را در نظر بگیرید :

const fruits = ['apple', 'banana', 'orange', 'Pineapple', 'Strawberry'];

console.log(fruits.slice(2));
// expected output: Array ["orange ", " Pineapple ", "Strawberry"]

console.log(fruits.slice(2, 4));
// expected output: Array ["orange ", " Pineapple "]

‼️ نکته: برای انتخاب از انتهای رشته از یک عدد منفی استفاده کنید (زمانی که شما پارامتر های start , end را مقدار منفی بدید کاملا برعکس مقدار مثبت عمل میکند):

  var fruits = ['apple', 'banana', 'orange', 'Pineapple', 'Strawberry'];
  var myBest = fruits.slice(-3, -1);
// expected output: Array ["orange ", " Pineapple "]

string.prototype.slice()

✅ متد slice در prototype استرینگ هم وجود دارد و قسمتهایی از یک رشته را استخراج کرده و قسمتهای استخراج شده را در یک رشته جدید برمی گرداند و پارامتر های شروع و پایان برای انتخاب شروع پایان رشته را نیز دارد.

var str = "Hello world!";
var res = str.slice(3, 8);
// expected output: "lo world! "

❗️ حالا تصور کنید میخوایید اعداد تک رقمی را دو رقمی نمایش دهید مانند نمایش ماه یا روز در تاریخ به صورت زیر :
1400/02/09

برای اینکه اعداد کوچکتراز ده ما همیشه دو رقمی نمایش داده شود و if و else هم استفاده نکنیم کافی است از همین متد slice استفاده کنیم به این صورت که یک “0” سمت چپ عدد ماه قرار میدیم و از انتها 2 کاراکتر از سمت راست یا انتها (2-) بر میداریم . بصورت زیر :

var myNumber = 7;
var myNumber2 = 11;
var formattedNumber = ("0" + myNumber).slice(-2);
// expected formattedNumber: 07

var formattedNumber2 = ("0" + myNumber2).slice(-2);
// expected formattedNumber2: 11

@fullStackDevs

#AOP

🔰AOP
🔹در این پست میخواهیم AOP رو مورد بررسی قرار دهیم.
در توسعه نرم افزار AOP یک مدل توسعه نرم افزار است که برای تکمیل OOP ( برنامه نویسی شی گرا) به وسیله جدا سازی concern ها اپلیکیشن برای رسیدن به ماژولاریتی استفاده میشود.
جداسازی concern ها با دسته بندی feature ها و behavior های اپلیکیشن به بخش های قابل مدیریت که هر کدام هدف خاصی دارن، نگهداری آنرا آسان تر میکند .
البته به کمک OOP امکان modularizing کردن concern ها به متد های مجزا و کلاس ها و package ها وجود دارد.

❇️ Aspect-Oriented Programming (AOP)

🔹یک تکنیک رایج برای ساخت راه کارهایی قابل استفاده در سراسر اپلیکیشن است که در طی توسعه نرم افزار، جداسازی منطق برنامه و تسک های قابل تکرار را تسهیل میکند.
مانند (input validation, logging, error handling, security)
🔸معماری یک اپلیکیشن اگر به خوبی طراحی شده باشد دارای لایه های متفاوت باید باشد و concern های مختلف در این معماری فقط در صورت نیاز باهم در ارتباط باشند.
▪️ فرض کنید یک اپلیکیشن loosely couple و maintainable طراحی کرده اید اما در میان راه نیازمند یه سری موارد هستید که ممکن است، نتوان آنها را در معماری به درستی جایگذاری کرد مانند :
▫️نیازمند سیستم authentication ای هستید برای بررسی احراز هویت کاربر قبل از هر کوئری به دیتا بیس
▫️ یا نیازمند است دیتاها قبل از insert در دیتابیس اعتبار سنجی شوند
▫️اپلیکیشن باید برای عملیات های حساس و مهم logging را انجام دهد.
▫️اپلیکیشن باید دارای یک سیستم debugging log جهت بررسی ok بودن عملیات ها باشد.
▫️اپلیکیشن باید دارای یک سیستم بررسی پرفورمنس باشد تا عملکرد عملیات های اپلیکیشن را بررسی کند.

🔸هر کدام از نیازمند های گفته شده نیازمند حجم زیادی از checking و کد میباشند.
علاوه بر آن امکان code duplication نیز وجود دارد و مجبورید کد های تکراری زیادی را در بخش های مختلف سیستم اضافه کنید. که نقض اصل DRY است و نگهداری اپلیکیشن را سخت میکند.
علاوه بر اینها هر تغییر کوچک در این نیازمندی ها باعث تغییرات عظیم در اپلیکیشن میشود.
🔹مواقعی که مجبور باشیم چنین الزاماتی را به اپلیکیشن خود اضافه کنیم، سوالی پیش می اید :
🔻 "چرا اصلا خود کامپایلر نمیتواند این کدهایی که در جاهای مختلف تکرار میشوند را اضافه کند ؟"
خبر خوب این است که چیزی به نام "aspect-oriented programming (AOP)" وجود دارد که general کد ها را از aspect ها در سراسر boundary های یک آبجکت یا یک لایه جدا میکند.
برای مثال logging در اپلیکیشن، وابسته به هیچ یک از لایه های اپلیکیشن نیست، بلکه باید در سراسر اپلیکیشن وجود داشته باشد و در همه جای برنامه بتوان آنرا اضافه کرد.
🔹از مزیت های AOP این است که فقط نیاز است نگران یک جای کد باشید. در یک جا کد بنویسید و آنرا در هرجایی که نیاز است اعمال کنید.

❇️ موارد استفاده از AOP بسیار زیاد است مانند :
▫️پیاده سازی logging در اپلیکیشن
▫️استفاده از authentication قبل از یک عملیات (اجازه دسترسی به کاربرانی که احراز هویت شده اند)
▫️پیاده سازی اعتبار سنجی و همچنین پیاده سازی سیستم اعلانی که با تغییر مقدار یک پراپرتی ایونتی را raise میکند.
▫️تغییر رفتار برخی متد ها.
🔸همانطور که میبینید AOP کاربرد های فراوانی دارد اما باید با احتیاط از آن استفاده کنید.
چون استفاده از آن برخی کد ها را در حالی که وجود دارند Hide میکند. همچنین aspect ها میتواند دارای باگی باشند یا تاثیر بسزایی در پرفورمنس اپلیکیشن داشته باشد. هزینه یک باگ جزئی در یک aspect ممکن است ساعت ها دیباگ کردن باشد. در نتیجه اگر aspect تان در جاهای دیگری ار اپلیکیشن استفاده نمیشود بهتر است مستقیما آنرا وارد کدتان کنید.

@fullStackDevs

#LoopOptimizations

Loop Optimizations in C# (and various other compilers)


This post comprises infographics showing various loop optimizations that happen in C# (dotnet).

🔗 Link

@fullStackDevs

#VSCode
#Github

A cool feature that GitHub has just added is the use of a point (.) key .wherever you are in the repository, which opens the code on the VS Code Editor browser

یک ویژگی جالب که GitHub به تازگی اضافه کرده است ، استفاده از کلید نقطه در هر کجا که در مخزن هستید ، است که کد را روی یک VS Code Editor browser باز می کند.
فقط برا ما گویا با وی پی ان باز میکنه 😐

@fullStackDevs

#javaScript_tricks
#js

❇️ در این پست چندتا تکنیک جاوا اسکریپتی معرفی میکنیم که امیداوریم براتون مفید واقع بشه.

🔹لاگ سریع در console به کمک object literal میتونید متغیرهاتون رو خیلی سریع و خوانا لاگ بزنید.
const myVar = 'foo'
const otherVar = 2

// output:
// {myVar: "foo", otherVar: 2}
console.log({ myVar, otherVar })

به این ترتیب یه آبجکت میسازین و مقدار هر پراپرتیش به همراه نامش در کنسول لاگ میشه.

🔹نمایش نام پارامترهای تابع به همراه تایپ شون.
به کمک object destructuring در جاوا اسکریپت و مشخص کردن مقدار پیشفرض برای پارامتر های تابع میتونید موقع صدا زدن تابع نام پارامتر ها به همراه تایپ اونها رو داشته باشید و از آنجایی که به پارامترتون مقدار پیشفرض دادید به صورت optional هست و به شکل های متفاوت میتونید تابع تون رو صدا بزنید.

const notify = (msg, { type = 'info', timeout, close = true } = {}) => {
  // display notification
}

notify('Hi!')
notify('Hi!', { type: 'error' })
notify('Hi!', { type: 'warn', close: false })

🔹کلون کردن آرایه.
از اونجایی که ارایه ها با رفرنسشون پاس داده میشن به کمک spread operator میتونید یک آرایه رو به راحتی کلون کنید.
const manipulateList = (list) => {
// defensively copy list
const copiedList = [...list]

// do something with copiedList
}

🔹 اجباری کردن پارامترهای تابع
به کمک مقدار دهی پیشفرض برای پارامترهای تابع و به کمک این تکنیک میتونید پارامترهای توابع تون رو درصورتی که مقداری براشون پاس داده نشده اجباری کنید.
const throwIfMissing = () => {
throw new Error('Missing parameter')
}
const func = (requiredParam = throwIfMissing()) => {
// some implementation
}


🔹رکوئست های زماندار (برای fetch api)
دیگر لایبری های رایج جاوااسکریپتی مثل jquery ajax و axios این امکان رو بهتون میدن تا برای درخواستتون یک timeout تنظیم کنین و درصورتی که در زمان مشخص شده رکوئست انجام نشد، خودکار fail بشه.
متد fetch در مرورگر های جدید به صورت توکار چنین قابلیتی رو نداره اما به کمک این تکنیک میتونید اینکار رو انجام بدید.

const timeout = (delay = 30000) => {
return new Promise((resolve, reject) => {
const rejectWithError = () => {
reject(new Error('Timed out!'))
}

setTimeout(rejectWithError, delay)
})
}

const fetchWithTimeout = (url, delay = 3000) => {
// construct an array to pass to `Promise.race`
return Promise.race([fetch(url), timeout(delay)])
}

fetchWithTimeout('/json/data.json', 1000)
.then((response) => {
// successful response before the 1 s timeout
console.log('successful response', response)
})
.catch((e) => {
// Either the timeout occurred or some other error.
// Would need to check the method or use a custom
// Error subclass in timeout
console.error('request error', e)
})

🔹تبدیل رشته به عدد .
برای تبدیل رشته های عددی به معادل number ای شون از این تکنیک استفاده کنید.
let int = "15";

int = +int;

اگر جایی امکان استفاده از عملگر + نداشتید از دوتا عملگر ~~ استفاده کنید.

@fullStackDevs