با عرض سلام خدمت کاربران محترم سایت پی وی لرن.
در این جلسه قصد داریم تا به بهبود عملکرد برنامه در جاوا اسکریپت JavaScript یا بهینه سازی برنامه در جاوا اسکریپت بپردازیم.
بهبود عملکرد جاوا اسکریپت (Performance) باعث بیشتر شدن سرعت اجرای برنامه ها و صرفه جویی در مانبع مصرفی مانند حافظه می شود.
از حلقه های تکرار کمتر استفاده کنید
معمولا حلقه های تکرار در برنامه نویسی زیاد استفاده می شوند.
بنابراین بهتر است تا فعالیت و کد هایی را که در این حلقه ها اجرا می شود را کاهش دهیم.
هر دستور در حلقه با هر بار تکرار حلقه تکرار می شود.
دستوراتی که درخارج از حلقه قرار دارند، باعث می شوند تا حلقه سریع تر اجرا شود. زیرا بیرون حلقه هستند و تکرار نمی شوند.
مثال زیر یک نمونه بد و بهینه نشده است:
مثال :
| var i; for (i = 0; i < arr.length; i++) {.... |
دستور arr.length با هر بار اجرای حلقه اجرا می شود(برای بررسی شرط حلقه)
بنابراین بهتر است تا این دستور را از حلقه خارج کنیم تا تنها یک بار اجرا شود.
مثال بهینه شده:
مثال :
| var i; var l = arr.length; for (i = 0; i < l; i++) { ...... |
کاهش استفاده از DOM
دستیابی به عناصر HTML وقت و هزینه بیشتری نسبت به اجرای دستور های خود جاوا اسکریپت دارد.
بنابراین هروقت نیاز بود تا چندین بار به یم عنصر HTML دسترسی داشته باشیم، بهتر است تا یک بار به آن دست پیدا کنیم و از آن استفاده کنیم:
مثال : از دسترسی DOM نیز کمتر استفاده کنید
| var obj; obj = document.getElementById("demo"); obj.innerHTML = "Hello"; |
کاهش اندازه DOM
تعداد عناصر HTML DOM را کم کنید.
این کار باعث بهبود سرعت بارگذاری صفحه و رندر (نمایش) آن می شود.مخصوصا در دیوایس های کوچکتر.
از متغیر های غیرضروری بپرهیزید
اگر قصد ذخیره مقادیر را ندارید، از ایجاد متغیر برای آن ها خودداری کنید.
در مثال زیر می توانیم متغیر fullName را حذف کنیم و مقادیر را مستقیما به پروپرتی بفرستیم:
مثال :
| var fullName = firstName + " " + lastName; document.getElementById("demo").innerHTML = fullName; |
بهتر تبدیل به کد زیر شود:
مثال :
| document.getElementById("demo").innerHTML = firstName + " " + lastName |
تاخیر در بارگذاری
بهتر است تا کد های جاوا اسکریپت را در انتهای صفحه قرار دهید تا ابتدا صفحه بارگداری شود.
تا وقتی که اسکریپت ها دانلود نشوند، مرورگر به سراغ کد های بعدی نمی رود.
در صورت امکان، شما می توانید اسکریپت خود را به صفحه توسط کد، پس از صفحه لود شده اضافه کنید:
مثال :
| <script> window.onload = function() { var element = document.createElement("script"); element.src = "myScript.js"; document.body.appendChild(element); }; </script> |
از کلمه کلیدی with استفاده نکنید
از استفاده از کلمه کلیدی with بپرهیزید.
with تاثیر منفی بر سرعت برنامه دارد. استفاده از این کلمه در strict mode غیر مجاز است.
جلسه بهبود عملکرد برنامه در جاوا اسکریپت JavaScript به پایان رسید.
فروشگاه
فیلم های آموزشی
کتاب های آموزشی
مقالات آموزشی
وردپرس
