کد های جاوا اسکریپت به دو صورت internal و external در صفحات وب سایت استفاده می شوند. در حالت internal کد ها داخل تگ script و ترجیحا داخل تگ head نوشته می شوند، اما در حالت external کد ها در یک فایل جاوا اسکریپت نوشته و سپس آن را با تگ script در کد html فراخونی می کنیم.
مرورگر کد های html را خط به خط اجرا می کند و در حالت عادی وقتی از تگ script در کد html استفاده می کنید، داده گرفته و اجرا می شود.
<script src="myscript.js">
صفت defer و async دو صفت برای اسکریپت کلاسیک در تگ های html هستند. با اضافه کردن این دو صفت به تگ اسکریپت می توانید رفتار مرورگر را تغییر دهید و Render_Blocking را حذف کنید.
در حالتی که از صفت async در script استفاده می کنید، مرورگر کد JavaScript و html را به صورت موازی و همزمان دریافت می کند اما پس از دانلود JavaScript اجرا می شود.
<script async src="myscript.js">
در حالت استفاده از صفت defer، مرورگر شروع به دانلود کردن فایل JavaScript می کند اما پس از دانلود کل صفحه اجرا می شود.
<script defer src="myscript.js">
از این دو ویژگی باید به درستی استفاده شود چرا در صورت استفاده نادرست از آنها ممکن است Reder_Blocking را کاهش دهد ولی استایل CSS و Bootstrap ها را بهم می ریزد.
منبع : caniuse.com
#آزادی_دانش
#انتشار_دانش
#سئولب