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