هفتم سپتامبر (۱۰ روز دیگه) Bun نسخه ۱ خودش رو به صورت رسمی منتشر میکنه و گفتم بد نیست قبل از اون یه آشنایی باهاش داشته باشیم 🤓
🔍 اول از همه درباره این صحبت کنیم که Bun چیه؟
به طور خلاصه Bun یه محیط اجرا برای جاوااسکریپت هست و توسط Jarred Summer در حال توسعه هست.
برای پیادهسازی اون از انجین JavaScriptCore مرورگر Safari و زبان Zig استفاده شده. Bun یه رقیب سرسخت برای Node.js به حساب میاد و در واقع قصد داره به طور کامل جایگزین Node.js بشه.
🌟 حالا ببینیم ویژگیهای Bun چیه:
🔹 سازگاری Bun با Node.js بالاست و اکثر ماژولها و global variableهای نود داخل Bun هم قابل دسترس هستن
🔸 پرفورمنس اپهای توسعه داده شده با Bun بهتر از Node.js هست. سرعت بالای Bun برای serverless computing خیلی خوبه
🔹 به صورت پیشفرض از تایپاسکریپت پشتیبانی میکنه
🔸 خودش یه پکیج منیجر هست و مثل npm پکیجها رو داخل پوشه node_modules میریزه اما سریعتره. بعد از اینکه یه پکیج رو دانلود کرد اون رو کش میکنه و برای دانلود بعدی فقط اون رو کپی میکنه (نسخه یکسان پکیج).
🔹 کار کردن با قابلیت پکیج منیجری اون به شکلی هست که کاربرهای yarn - npm - pnpm باهاش راحت باشن
🔸 در مورد تستنویسی، Bun سینتکسی شبیه Jest داره و شما میتونین تستهای نوشته شده با Jest رو با اسکریپت bun test بدون تغییر کد اون اجرا کنین. سرعت اجرای تستها داخل Bun به گفته خودشون خیلی سریعتره.
🔹 همچنین Bun به طور پیشفرض میتونه عمل transpile هم انجام بده
به طور کلی Bun نوعی all-in-one حساب میشه چون هم میتونه اسکریپت ران کنه، هم پکیج دانلود کنه، هم تست ران کنه و عمل transpile رو انجام بده.
⏱ داخل سایت Bun مقایسههایی از لحاظ سرعت با بقیه ابزارها انجام شده:
⚪ در مقایسه هندل کردن ریکوئستهای HTTP، عملکرد Bun نسبت به Node.js تقریبا ۵ برابر و نسبت به Deno تقریبا ۲ برابر بهتر بوده
⚪ در مقایسه تعداد پیام ارسال شده از طریق WebSocket تو یه سرور چت، Bun تونسته ۶ برابر نسبت به Node.js و ۲ برابر نسبت به Deno پیام بیشتری ارسال کنه
⚪ درایوری که Bun برای Sqlite ساخته پرفورمنس بالایی داره. در مقایسه کوئریهای اجرا شده، Bun تقریبا ۴ برابر نسبت به better-sqlite3 در Node.js و تقریبا ۲ برابر نسبت به x/sqlite3 در Deno عملکرد بهتری داشته
⚪ در مورد نصب پکیجها Bun تونسته ۱۷ برابر نسبت به pnpm و ۲۹ برابر نسبت به npm و ۳۳ برابر نسبت به yarn سریعتر باشه
⚪ در ران کردن تستها، Bun نسبت به Jest بین ۸ تا ۲۰ برابر سرعت بیشتری داشته
یه نکتهای که خوبه گفته بشه اینه که Bun هنوز به طور کامل با Node.js سازگاری نداره و هنوز تمام ماژولها و global variableها داخلش پیادهسازی نشدن. همچنین Bun فعلا فقط روی لینوکس و مک و WSL قابل نصبه.
اگه Bun بتونه حرفش رو عملی کنه و شما بدون تغییر کد پروژهتون بتونین روی Bun هم اجراش کنین، شاید بشه گفت دوران Node.js به سر میرسه. البته از بین بردن ابزاری که به طور وسیع استفاده میشه به همین راحتی نیست و همه چی بستگی به عملکرد Bun داره.
اینم بگم برای برنامهنویسا فرقی نداره چون پروژههای Node.js بدون هیچ تغییری میتونن با پرفورمنس بهتر روی Bun هم اجرا بشن
@AlirezaJsTs
🔍 اول از همه درباره این صحبت کنیم که Bun چیه؟
به طور خلاصه Bun یه محیط اجرا برای جاوااسکریپت هست و توسط Jarred Summer در حال توسعه هست.
برای پیادهسازی اون از انجین JavaScriptCore مرورگر Safari و زبان Zig استفاده شده. Bun یه رقیب سرسخت برای Node.js به حساب میاد و در واقع قصد داره به طور کامل جایگزین Node.js بشه.
🌟 حالا ببینیم ویژگیهای Bun چیه:
🔹 سازگاری Bun با Node.js بالاست و اکثر ماژولها و global variableهای نود داخل Bun هم قابل دسترس هستن
🔸 پرفورمنس اپهای توسعه داده شده با Bun بهتر از Node.js هست. سرعت بالای Bun برای serverless computing خیلی خوبه
🔹 به صورت پیشفرض از تایپاسکریپت پشتیبانی میکنه
🔸 خودش یه پکیج منیجر هست و مثل npm پکیجها رو داخل پوشه node_modules میریزه اما سریعتره. بعد از اینکه یه پکیج رو دانلود کرد اون رو کش میکنه و برای دانلود بعدی فقط اون رو کپی میکنه (نسخه یکسان پکیج).
🔹 کار کردن با قابلیت پکیج منیجری اون به شکلی هست که کاربرهای yarn - npm - pnpm باهاش راحت باشن
🔸 در مورد تستنویسی، Bun سینتکسی شبیه Jest داره و شما میتونین تستهای نوشته شده با Jest رو با اسکریپت bun test بدون تغییر کد اون اجرا کنین. سرعت اجرای تستها داخل Bun به گفته خودشون خیلی سریعتره.
🔹 همچنین Bun به طور پیشفرض میتونه عمل transpile هم انجام بده
به طور کلی Bun نوعی all-in-one حساب میشه چون هم میتونه اسکریپت ران کنه، هم پکیج دانلود کنه، هم تست ران کنه و عمل transpile رو انجام بده.
⏱ داخل سایت Bun مقایسههایی از لحاظ سرعت با بقیه ابزارها انجام شده:
⚪ در مقایسه هندل کردن ریکوئستهای HTTP، عملکرد Bun نسبت به Node.js تقریبا ۵ برابر و نسبت به Deno تقریبا ۲ برابر بهتر بوده
⚪ در مقایسه تعداد پیام ارسال شده از طریق WebSocket تو یه سرور چت، Bun تونسته ۶ برابر نسبت به Node.js و ۲ برابر نسبت به Deno پیام بیشتری ارسال کنه
⚪ درایوری که Bun برای Sqlite ساخته پرفورمنس بالایی داره. در مقایسه کوئریهای اجرا شده، Bun تقریبا ۴ برابر نسبت به better-sqlite3 در Node.js و تقریبا ۲ برابر نسبت به x/sqlite3 در Deno عملکرد بهتری داشته
⚪ در مورد نصب پکیجها Bun تونسته ۱۷ برابر نسبت به pnpm و ۲۹ برابر نسبت به npm و ۳۳ برابر نسبت به yarn سریعتر باشه
⚪ در ران کردن تستها، Bun نسبت به Jest بین ۸ تا ۲۰ برابر سرعت بیشتری داشته
یه نکتهای که خوبه گفته بشه اینه که Bun هنوز به طور کامل با Node.js سازگاری نداره و هنوز تمام ماژولها و global variableها داخلش پیادهسازی نشدن. همچنین Bun فعلا فقط روی لینوکس و مک و WSL قابل نصبه.
اگه Bun بتونه حرفش رو عملی کنه و شما بدون تغییر کد پروژهتون بتونین روی Bun هم اجراش کنین، شاید بشه گفت دوران Node.js به سر میرسه. البته از بین بردن ابزاری که به طور وسیع استفاده میشه به همین راحتی نیست و همه چی بستگی به عملکرد Bun داره.
اینم بگم برای برنامهنویسا فرقی نداره چون پروژههای Node.js بدون هیچ تغییری میتونن با پرفورمنس بهتر روی Bun هم اجرا بشن
@AlirezaJsTs
اگر از tyoeof و instanceof برای کاندیشنهاتون استفاده میکنید حسابی مراقب باشید. مثلا وقتی از typeof استفاده میکنید، تایپ Array رو به عنوان Object میشناسه و عملا تو این حالت استفاده ازش کاربردی نداره.
@AlirezaJsTs
@AlirezaJsTs
👍6🔥1
https://www.totaltypescript.com/
یه سایت خیلی خوب برای آموزش typescript که کلی آموزش رایگان داره. با تمرین و حل تمرین آنلاین بعد از هر ویدیو. طراحی سایتش هم جالب بود 👌
یک ایده جالب که داره اینه که مشکل رو به شما توضیح میده و بعد حل مشکل رو به شما میسپره. و توی همون محیط وب شما دیباگ میکنید و تست مینویسید. و در نهایت سولوشن رو در اختیارتون میذاره.
اکستنشن ejoy هم برای ترجمه خوب روی ویدیوهاش کار میکنه که جدیدن حالت دو تا subtitle رو هم به این سایت اضافه کرده.
@AlirezaJsTs
یه سایت خیلی خوب برای آموزش typescript که کلی آموزش رایگان داره. با تمرین و حل تمرین آنلاین بعد از هر ویدیو. طراحی سایتش هم جالب بود 👌
یک ایده جالب که داره اینه که مشکل رو به شما توضیح میده و بعد حل مشکل رو به شما میسپره. و توی همون محیط وب شما دیباگ میکنید و تست مینویسید. و در نهایت سولوشن رو در اختیارتون میذاره.
اکستنشن ejoy هم برای ترجمه خوب روی ویدیوهاش کار میکنه که جدیدن حالت دو تا subtitle رو هم به این سایت اضافه کرده.
@AlirezaJsTs
👍6
اگه تو NodeJS برای وب سرورتون Auth service نوشتین و با password درستیِ اطلاعات رو چک میکنین، احتمالا به این صورت مقایسه پسورد رو انجام میدین:
حالا این مشکل چیه و چطور رفعش کنیم.
به این باگ امنیتی میگن Timing attack.
اینطور کار میکنه که با استفاده brute force هربار یک پسورد رو سمت back-end ارسال میکنن و با استفاده از تایمینگِ response حدس میزنن که چند درصد این پسورد درسته و اینقدر این کار رو انجام میدن تا پسورد درست رو به دست بیارن.
استفاده از پکیجهای bcrypt میتونه با یه روش امن براتون پسورد رو چک کنه. اما اگه از scrypt استفاده کنین شما باید از یک function کمکی در ماژول crypto استفاده کنین.
@AlirezaJsTs
if (hashed_pass_from_db === hashed_pass_from_input) {
// success
}
این تکه کد یک مشکل امنیتی خطرناک داره که به خاطر استفاده از "===" هست.حالا این مشکل چیه و چطور رفعش کنیم.
به این باگ امنیتی میگن Timing attack.
اینطور کار میکنه که با استفاده brute force هربار یک پسورد رو سمت back-end ارسال میکنن و با استفاده از تایمینگِ response حدس میزنن که چند درصد این پسورد درسته و اینقدر این کار رو انجام میدن تا پسورد درست رو به دست بیارن.
استفاده از پکیجهای bcrypt میتونه با یه روش امن براتون پسورد رو چک کنه. اما اگه از scrypt استفاده کنین شما باید از یک function کمکی در ماژول crypto استفاده کنین.
crypto.timingSafeEqual(Buffer.from("a"), Buffer.from("a"))
این فانکشن زمان مقایسه رو یک مقدار ثابت در نظر میگیره. یعنی زمان مقایسه پسورد اشتباه با پسورد درست همیشه یکی هست و اینطوری attacker نمیتونه حدس بزنه که تا چه حد درست پیش رفته.@AlirezaJsTs
👍6
This media is not supported in your browser
VIEW IN TELEGRAM
وقتی بهت گفتن کرم بریز در کنارش درست رو هم ادامه بده
🤣6
چرا React اینقدر محبوب است ؟ و کاربردهای آن کدامند؟ چه پرفورمنسی را برای ما بالا میبرد؟
وقتی Js میره سراغ Dom اصلی و بخواد اون رو تغییری مثل عمل درج کردن و حذف کردن و .. بده زمان زیادی صرف میکنه و هزینه ی کار کردن با Dom اصلی ( real Dom ) خیلی بالاست به همین دلیل ری اکت این مشکل رو حل میکنه.
ری اکت از روی Dom اصلی و نسخه اصلی یک کپی به اسم Virtual Dom میسازه و تغییراتی روکه میخواد روی نسخه ی کپی شده اِعمال میکنه و بعد از اتقاق افتادن تغییرات میاد اختلاف بین Dom اصلی و Virtual Dom رو بررسی میکنه و فقط اون تغییراتی که اتفاق افتاده رو دوباره سازی میکنه به همین خاطر هست که در پروژه های ری اکت کُدها وجود ندارن و در پشت پرده همه چی توسط Virtual Dom اتفاق میافته و فقط همون قسمتی رو که تغییر میدیم دوباره سازی و load میشه و اینطوریه ک performance به شدت بالا میره .
البته همینvirtual dom اگر دولوپر نا آگاهی ازش استفاده کنه میتونه فاجعه پرفورمنسی خلق کنه مثلا keyها رو برای راحتی خودش که خطا نخوره بیاد با متدهای رندم تعریف کنه یا هر جا رسید ایندکس مپ رو بذاره key و حتی در شرایطی که لزومی نداره رندر اضافی به سیستم تحمیل کنه!
نکته: کدهای دام مجازی ( VirtualDom ) درون inspect قابل مشاهده هستند .
@AlirezaJsTs
وقتی Js میره سراغ Dom اصلی و بخواد اون رو تغییری مثل عمل درج کردن و حذف کردن و .. بده زمان زیادی صرف میکنه و هزینه ی کار کردن با Dom اصلی ( real Dom ) خیلی بالاست به همین دلیل ری اکت این مشکل رو حل میکنه.
ری اکت از روی Dom اصلی و نسخه اصلی یک کپی به اسم Virtual Dom میسازه و تغییراتی روکه میخواد روی نسخه ی کپی شده اِعمال میکنه و بعد از اتقاق افتادن تغییرات میاد اختلاف بین Dom اصلی و Virtual Dom رو بررسی میکنه و فقط اون تغییراتی که اتفاق افتاده رو دوباره سازی میکنه به همین خاطر هست که در پروژه های ری اکت کُدها وجود ندارن و در پشت پرده همه چی توسط Virtual Dom اتفاق میافته و فقط همون قسمتی رو که تغییر میدیم دوباره سازی و load میشه و اینطوریه ک performance به شدت بالا میره .
البته همینvirtual dom اگر دولوپر نا آگاهی ازش استفاده کنه میتونه فاجعه پرفورمنسی خلق کنه مثلا keyها رو برای راحتی خودش که خطا نخوره بیاد با متدهای رندم تعریف کنه یا هر جا رسید ایندکس مپ رو بذاره key و حتی در شرایطی که لزومی نداره رندر اضافی به سیستم تحمیل کنه!
نکته: کدهای دام مجازی ( VirtualDom ) درون inspect قابل مشاهده هستند .
@AlirezaJsTs
👍5
Alireza 👨🏻💻
چرا React اینقدر محبوب است ؟ و کاربردهای آن کدامند؟ چه پرفورمنسی را برای ما بالا میبرد؟ وقتی Js میره سراغ Dom اصلی و بخواد اون رو تغییری مثل عمل درج کردن و حذف کردن و .. بده زمان زیادی صرف میکنه و هزینه ی کار کردن با Dom اصلی ( real Dom ) خیلی بالاست…
ولی خب همچنان بیشتر از ۷۰٪ وبسایتهای جهان از jQuery استفاده میکنن 😂
🔥2🤣1
https://flickity.metafizzy.co
این سایت کلی اسلایدر با ویژگیهای مشخص و بهینه داره که میتونید تو پروژههاتون استفاده کنید. به نظرم جالب بود.
@AlirezaJsTs
این سایت کلی اسلایدر با ویژگیهای مشخص و بهینه داره که میتونید تو پروژههاتون استفاده کنید. به نظرم جالب بود.
@AlirezaJsTs
👍4
This media is not supported in your browser
VIEW IN TELEGRAM
«این متغیری که استفاده نشده رو پاک کنم»
🤣7