این روزها که عمیقتر وارد دنیای وب و سئو شدم، یه سری اصطلاحات و کلماتی میشنوم که آشنایی با اون ها باعث میشن کامل بفهمم که دارم چیکار میکنم.جالبه بدونید که سرعت سایت نقش بسیار مهمی برای جلب اعتماد موتورهای جستجوی گوگل داره. عوامل بسیاری روی این فاکتور تأثیر گذاره، یکی از این عوامل فایل‌های جاوا اسکریپته.
اگر از این نوع فایل‌ها به درستی استفاده نشه میتونه برای سایتتون فاجعه به بار بیاره. به طور کلی تو وب سایت های مدرن ، اسکریپت ها اغلب "سنگین تر" از HTML هستند: سایز دانلود در اونها بیشتر و زمان پردازش هم طولانی تر هست.
وقتی مرورگر HTML رو بارگیری می کنه و با تگ ... مواجه میشه ، نمی تونه ساخت DOM رو ادامه بده و باید اسکریپت رو همون لحظه اجرا کنه. همین مورد برای اسکریپت های خارجی هم اتفاق می افته، که منجر به یه موضوع مهم می شه:
راه حل هایی برای این مساله وجود داره. به عنوان مثال ، ما می تونیم یه اسکریپت پایین صفحه قرار بدیم. بعد می تونه المان های بالای خودش رو ببینه ، و نمایش محتوای صفحه رو بلاک نمی کنه:
اما این راه حل خیلی مناسب نیست. به عنوان مثال ، مرورگر فقط پس از دانلود کامل HTML متوجه اسکریپت می شه (و می تونه بارگیری اون رو شروع کنه). برای داکیومنت های طولانی HTML ، ممکنه تاخیر قابل توجهی اتفاق بیفته.
طبق اطلاعاتی که دراین باره به دست اوردم، بزرگترین پیشرفت در عملکرد وب زمانی بود که مرورگرها شروع به بارگیری اسکریپتها به طور موازی کردند. قبل از سال 2006 ، همه مرورگرها اسکریپت های خارجی رو به طور متوالی بارگیری و اجرا می کردند.
با HTML5 ، دو attribute بولی برای تگ داریم : async و defer.
این دو attribute برای افزایش سرعت و عملکرد وب سایت ها ضروریه. این دو آپشن، امکان رفع بلاک بودن جاوا اسکریپت رو که در اون صفحه باید قبل از پایان رندر شدن صفحه، بارگذاری و اجرا بشن ، رو فراهم میکنه.
اگر شما هم تازه وارد حوزه سئو شدید و بار اولتون هست که دارید این اصطلاحات رو میشنوید تا انتهای این پست همراه من باشید تا به طور کامل بهتون بگم جریان از چه قراره…
به طورکلی Defer به مرورگر می گه منتظر اسکریپت نباش. در عوض ، مرورگر به پردازش HTML و ساخت DOM ادامه میده. اسکریپت "در پشت پرده" بارگیری می شه ، و پس از ساخت کامل DOM اجرا می شود.
ویژگی async تا حدودی مثل defer هست و اسکریپت رو بلاک نمی کنه. اما تفاوت های مهمی در رفتار داره.
اسکریپت موردنظر همزمان با بارگیری صفحه بارگیری میشه و هر موقع دریافت شد پارسینگ HTML صفحه متوقف می شه تا اجرای اسکریپت انجام بشه، درنهایت دوباره پارسینگ صفحه ادامه پیدا میکنه.
