هنوز چند بایت مونده که پیدا کنم...

25 تکنیک برای بهبود راندمان جاوا اسکریپت قسمت سوم

در رویداد نویسی منظم باشید.
 

3- مثل یک نینجا عمل کنید وقتی دارید مدیریت رویداد میکنید (event handling).

 

مشکل:

رویدادهای سفارشی و رویداد های مرورگر – Browser and Custom Events - ابزارهای خوبی هستن برای اینکه از فراخوانی پشته ای توابع فرار کنیم (منظورم اینه که توی یک تابع یکی رو صدا کنیم باز تو اون یکی دیگه و الی آخر) اما از اونجایی که سخته رهگیری این مدل رویداد ها به دلیل اجرای مخفی اونها میتونه این مشکل رو بوجود بیاره که بی شمار تکرار و اجرا بشن البته به صورت ناخواسته! و این باعث کاهش راندمان میشه.

 

راهکار:

حواستون رو جمع کنید! وقتی دارین برای رویدادها کد مینویسین. و سلاحتون رو هم خوب بشناسین!
منظورم اینه که اگر دارید از یک کتابخونه یا فریم ورک استفاده میکنید از ترکیب و نحوه اجرای دستورات در لایه های پایین تر مطلع و مطمئن بشین.

 
تکنیک ها:

 

  • از مقید سازی رویدادها (Event Binding) استفاده کنید اما با دقت!

یه راه توپ برای برنامه های ریسپانسیو یا پاسخگوی خودمونه. اگرچه، باید چند بار گردش عملیات رو توی کدتون چک کنید که مطمئن بشین چند بار یک رویداد فراخوانی نمیشه. و کامنت بذارید برا رفقای بعدی که ناخواسته با تغییر کد باعث این فاجعه راندمانی نشن :)
اگر از انگولار استفاده میکنید مطمئن بشید که از شر پاسبان های (ترجمه watcher شده پاسبان :p) اضافی خلاص میشین.

 

  • به رویدادهایی که خیلی سریع و با فرکانس بالا فراخوانی میشن توجه ویژه کنید.

یه سری رویداد مرورگر هستن مثل mousemove یا resize که در پی در پی در زمانی بسیار پایین مثلا صدها بار در ثانیه فراخوانی میشن. خوب باید مطمئن بشید دستورات توی این بلاک اداره کننده بهینه نوشته شدن و زمان لازم برا اجراشون از 2 تا 3 میلی ثانیه تجاوز نمی کنه. هر مقداری بیش از این باعث افت شدید راندمان میشه مخصوصا توی بروزهایی که قدرت رندر پایینی دارن.

 

  • یادتون نره تقید رویداد هایی که مورد نیاز نیستن دیگه رو از بین ببرین (unbind events).

لغو تقید مثل مقید سازی مهمه. وقتی رویداد جدیدی اضافه میکنید به کدتون باید یه جایی به هر حال جلو اجرا شدنش رو بگیرید وقتی دیگه نیاز نیستن. به طور مثال اگر لازمه یک رویداد یک بار فراخوانی بشه از متد جی کوئری jQuery.one() استفاده کنید. این باعث میشه که از اجرای چند باره رویداد مشابه جلوگیری بشه.
اگر از جی کوئری برای مقید سازی یا لغو تقید استفاده میکنید مطمئن باشید از یک انتخابگر (Selector) یکتا استفاده کنید برای اداره رویداد مثلا نیاید از اسم کلاس یا نوع کنترل استفاده کنید اگر بیش از یکبار استفاده شداون اسم کلاس یا نوع کنترل.

 

  • انتشار رویداد رو یادش بگیرین.

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

 

  • جای click از mouseup استفاده کنید.

توجه داشته باشید که محاوره با کاربر از طریق ماوس یا صفحه کلید رویداد های بسیاری رو فراخوانی میکنه و صد البته با یک ترتیب مشخص. و این میتونه لازم باشه و کمک کنه ترتیب فراخوانی ها رو بشناسیم که راندمان رو بالاتر ببریم.  یه مثال خوب: همین mouseup هست که قبل از click اجرا میشه و در بروزرهای قدیمی تر تفاوت پرفورمنسی بسیار بالاتری داره.

 

قسمت دوم | قسمت چهارم

نویسنده : محمد ملک مکان
دوشنبه 27 ارديبهشت 1395
+ 110 -

ایده ها، نظرات و سوالات دوستان ما

مهمون کدجیک
یکشنبه 19 آذر 1396
سلام ممنونم از مطلب فوق العادتون
با تشکر کوتاه کننده لينک
+ 50 -
مهمون کدجیک
یکشنبه 9 خرداد 1395
لایک!
+ 00 -

خوشحال میشیم نظرتُ بدونیم