کارایی

از موتو کد، دانشنامهٔ برنامه‌نویسی

چگونه سرعت اجرای کد اسکریپت خود را افزایش دهید؟ [۱]

کاهش فعالیت در حلقه ها[ویرایش | ویرایش]

حلقه‌ها اغلب در برنامه‌نویسی استفاده می‌شوند.

هر تکه کد در حلقه، که شامل حلقه for نیز می‌شود در هر بار پیمایش حلقه نیز اجرا می‌شود.

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

روش نادرست:[ویرایش | ویرایش]

var i;
for (i = 0; i < arr.length; i++) {

روش صحیح‌تر:[ویرایش | ویرایش]

var i;
var l = arr.length;
for (i = 0; i < l; i++) {

در روش نادرست، دسترسی به ویژگی length یک آرایه در هر بار پیمایش حلقه صورت می‌گیرد.

در روش صحیح تر، ویژگی length بیرون حلقه قرار می‌گیرد و اجرای حلقه را سریعتر می‌کند.

کاهش دسترسی از طریق DOM[ویرایش | ویرایش]

دسترسی به عناصر HTML به وسیلهٔ HTML DOM در مقایسه با سایر تکه کدها بسیار آهسته‌تر است.

اگر شما می‌خواهید که به یک عنصر DOM چندین بار دسترسی داشته باشید، یک بار به آن دسترسی پیدا کنید و از آن به عنوان متغیر محلی استفاده کنید:

مثال[ویرایش | ویرایش]

var obj;
obj = document.getElementById("demo");
obj.innerHTML = "Hello";


مشاهدهٔ نتیجه


تعداد استفاده از Dom را کاهش دهید[ویرایش | ویرایش]

تعداد استفاده از عناصر به وسیلهٔ HTML DOM را کم نگه دارید.

این امر همیشه موجب بهبود بارگذاری صفحه و افزایش سرعت رندر صفحه (نمایش صفحه) به خصوص در دستگاه‌های کوچک می‌شود.

در هر دفعه جستجو به وسیلهٔ DOM ، (همانند متد getElementByTagName) موجب اجرای یک DOM کوچک‌تر می‌شود.

جلوگیری از استفاده غیرضروری متغیرها[ویرایش | ویرایش]

اگر برنامه ای برای ذخیره مقادیر ندارید، متغیرهای جدید را تعریف نکنید.

بیشتر موارد شما می‌توانید کدی همانند کد زیر را:

var fullName = firstName + " " + lastName;
document.getElementById("demo").innerHTML = fullName;

با این کد جابه‌جا کنید:

document.getElementById("demo").innerHTML = firstName + " " + lastName

تأخیر در بارگذاری جاوا اسکریپت[ویرایش | ویرایش]

قرار دادن اسکریپتهایتان در پایین صفحه به مرورگر اجازه می‌دهد که ابتدا صفحه را بارگذاری کند.

زمانی که یک اسکریپت در حال دانلود است، مرورگر سایر دانلودها را آغاز نخواهد کرد. به علاوه تمامی عملیات‌های تبدیل یا parsing و عملیات‌های رندر کردن نیز ممکن است block شوند.

طبق قانون HTTP مرورگر نباید بیشتر از دو کامپوننت را به صورت موازی یا parallel دانلود کند.

یک روش برای حل این مشکل، استفاده از دستور defer="true" در تگ script است.

ویژگی deffer مشخص می‌کند که اسکریپت می‌بایست بعد از بارگذاری کامل صفحه اجرا شود، اما این ویژگی تنها در اسکریپت‌های خارجی یا external کار می‌کند.

در صورت امکان، شما می‌توانید اسکریپت خود را به وسیلهٔ کد بعد از اینکه بارگذاری صفحه انجام شد، به صفحه اضافه کنید:

<script>
window.onload = function() {
  var element = document.createElement("script");
  element.src = "myScript.js";
  document.body.appendChild(element);
};
</script>

از استفادهٔ کلمهٔ کلیدی with بپرهیزید[ویرایش | ویرایش]

از استفاده از کلمه کلیدی with بپرهیزید. این استفاده اثر منفی بر روی سرعت دارد. همچنین موجب بهم ریختن ناحیه کد یا Scopeها در جاوا اسکریپت می‌شود.

استفاده از کلمه کلیدی with در حالت سخت گیرانه یا Strict mode مجاز نیست.


منابع آموزشی[ویرایش]