شاید شما به JQuery نیاز نداشته باشید!

طراحان وب اغلب با کتابخانه‌ی JQuery آشنا هستند؛ این کتابخانه با آماده کردن دستوراتی بسیار کوتاه در زبان جاوا اسکریپت، به طراحان وب کمک می‌کند تا بدون نیاز به نوشتن دستورات پیچیده، وب‌سایت‌های پویا و غیر ثابت طراحی کنند.

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

در همین زمینه وب‌سایت You Might Not Need jQuery با ارائه‌ی جایگزین‌های بومی هر دستور جی‌کوئری در زمینه‌های مختلف (AJAX، افکت‌ها و…)، به توسعه‌دهندگان کمک می‌کند تا وب‌سایت خود را سبک‌تر طراحی کنند.

 

بروزرسانی: این وب‌سایت به زبان فارسی‌ست و محتوای مشابهی با وب‌سایتی که قبلا معرفی کرده‌ام دارد:

جی‌کوئری لازم نیست (nojquery.ir)

چطور با جاوا اسکریپت، یک svg را به صورت png دانلود کنیم؟

در یکی از پروژه‌ها نیاز بود تا کاربر بتواند یک تصویر svg را به صورت png دانلود کند (! نیازه دیگه چه میشه کرد!😁)؛ با مقداری تحقیق و بررسی و ترکیب تعدادی کد با یکدیگر به این کد رسیدم:

روش کار کد به صورت خلاصه این است که ابتدا svg در یک متغیر ذخیره شده و سپس یک canvas نامرئی ساخته می‌شود؛ در ادامه تصویر svg درون canvas رسم شده و در نهایت با ترفندِ ساخت لینک مخفی و کلیک مصنوعی، تصویر برای کاربر دریافت می‌شود.

  • ابعاد canvas بر مبنای ابعاد svg تنظیم می‌شود. برای اینکه تصویر زیادی کوچک نباشد، عرض و ارتفاع تصویر در 5 ضرب شده است که می‌توانید آن را تغییر دهید.
  • برای اینکه پس‌زمینه تصویر نهایی نامرئی نباشد، ابتدا یک مستطیل سفید در ابعاد کل canvas رسم شده (
    ctx.fillRect) و سپس تصویر svg رسم می‌شود.

تبدیل متن به هش کد MD5 در جاوااسکریپت

گاهی اوقات لازم داریم تا متغیرهای ورودی در یک فرم را کمی دستکاری کنیم؛ مثلا رمز عبور دریافتی از کاربر را تبدیل به یک رمز برگشت‌ناپذیر کنیم که MD5 یکی از معروف‌ترین آنهاست. جاوا اسکریپت به صورت پیشفرض دستوری برای این کار ندارد اما با افزودن این تابع به کدها می‌توانید این قابلیت را اضافه کنید: