جلسه ۴۱ – رفع ارور Remove unused JavaScript

سلام همراهان عزیز میزفا
از مجموعه مقالات آموزش جی تی متریکس و از سایت میزفا همراه شما هستیم. تو جلسه ۴۰ درباره رفع خطای Remove unused CSS صحبت کردیم و در این جلسه به آموزش رفع ارور Remove unused JavaScript در جی تی متریکس می‌پردازیم. این مشکل مربوط به بهینه سازی فایل JavaScript و مخصوصا حذف کدهای JS بدون استفاده ست. البته که روش برطرف کردن خطای Remove unused JavaScript اصلا آسون نیست و نیاز به مهارت و تخصص بالا در برنامه نویسی داره. با این حال ما در این مقاله علت ایجاد خطا و روش‌هایی رو برای بهینه سازی اون به شما آموزش می‌دیم و امیدواریم مفید باشه.
لطفا تا پایان با میزفا همراه باشید.

خلاصه خطای Remove unused JavaScript

میزان سختی: *****
روی چه مواردی تاثیر می‌ذاره: First Paint و خطای Eliminate render-blocking resources

علت ایجاد خطای Remove unused JavaScript چیست؟

هنگامی که مرورگر داره سند HTML رو خط به خط بررسی می‌کنه تا صفحه رو Render کنه، هرجا به یه فایل JS برسه در حالت عادی جاوا اسکریپت‌ها رو دانلود، تجزیه و اجرا می‌کنه. این موضوع باعث render-blocking و افزایش زمان لود صفحه میشه. به همین دلیله که گفته میشه JavaScript ها رفتار render-blocking دارند و باعث کاهش سرعت سایت میشن. اما مسئله اصلی و مرتبط با خطای Remove unused JavaScript اینه که بعضی از این اسکریپت‌ها برای لود اولیه صفحه ضروری نیستند و میشه لود و یا اجرای اونها رو به تعویق انداخت.

از طرف دیگه بعضی از کدهای JavaScript اصلا هیچ استفاده و کاربردی در صفحات سایت ما ندارند و وجودشون باعث افزایش حجم صفحه میشه. اگه این کدهای بدون استفاده render-blocking باشند، تاثیر خیلی مخربی روی سرعت لود سایت دارند. اما حتی اگه render-blocking هم نباشند، باعث مصرف پهنای باند میشن (درحالیکه هیچ استفاده‌ای ندارند) و در نتیجه باز هم روی سرعت سایت اثر مخرب دارند.

پس ما علت ایجاد ارور Remove unused JavaScript در جی تی متریکس رو به ۲ دسته تقسیم کردیم. کدهای JS غیرضروری و کدهای JS بدون استفاده. حالا باید به فکر بهینه سازی چنین کدهای جاوا اسکریپتی در صفحاتمون باشیم تا بتونیم باعث افزایش سرعت لود سایت بشیم. چرا که خطای Remove unused JavaScript روی معیار First Paint هم موثره و ممکنه باعث بشه کاربر تا مدت زمان طولانی‌تری نتونه هیچ محتوایی رو در صفحه ما ببینه.

چطور خطای Remove unused JavaScript را برطرف کنیم؟

حالا که با علت ایجاد خطا آشنا شدیم، روش‌های برطرف کردن خطای Remove unused JavaScript در جی تی متریکس رو بررسی می‌کنیم. ما در اینجا ۳ راهکار رو پیشنهاد می‌کنیم که ۲ تاشون نیاز به دانش و تخصص بالا در برنامه نویسی دارند. برای هر کدوم از این ۲ روش هم یه مقاله تخصصی‌تر معرفی می‌کنیم تا متخصصین برنامه نویسی بتونند مطالعه کنند:

۱. جدا سازی کدها (code-splitting)

اولین راهکار موثر برای رفع ارور Remove unused JavaScript استفاده از code-splitting هست. در این روش باید اول کدهای JS ضروری و غیرضروری رو تشخیص بدیم و جداسازی کنیم. سپس برای لود اولیه صفحه فقط کدهای ضروری رو اجرا کنیم و اجرای کدهای غیرضروری رو به تعویق بندازیم. همچنین در این روش اگه به کدهایی برخوردیم که کلا بدون استفاده و اضافی بودند، میشه اونها رو به‌صورت اصولی حذف کرد. اطلاعات بیشتر درباره code-splitting رو اینجا مطالعه کنید.

۲. حذف JavaScript بدون استفاده

کدهای جاوا اسکریپت بدون استفاده ممکنه به دلایلی مثل نصب افزونه‌های متعدد، استفاده از کتابخانه‌های JS، کدهای باقی مانده از ورژن قبلی سایت، انجام تست‌های مختلف و… در صفحات ما وجود داشته باشند. ما باید ابتدا این کدهای بدون استفاده رو شناسایی و سپس حذف کنیم. اما متاسفانه انجام این کار و حل مشکل Remove unused JavaScript به همین سادگی نیست. شناسایی این کدها و حذف کردنشون نیاز به مهارت و تخصص در برنامه نویسی داره. برای انجام این کار از روشی به نام Tree Shaking استفاده میشه. مطالعه این مقاله درباره Tree Shaking می‌تونه راهنمای خوبی برای برنامه نویسان عزیز باشه.

۳. استفاده از افزونه های سرعت برای وردپرس

هرچند پلاگین‌های سرعت وردپرس تنظیمات اختصاصی برای رفع ارور Remove unused JavaScript ندارند؛ اما تو برخی موارد، اگه تنظیمات مربوط به جاوا اسکریپت این افزونه‌ها رو درست انجام بدیم، ممکنه باعث برطرف شدن این خطا در GTmetrix بشه. درباره این پلاگین‌ها تو مقاله بهترین افزونه افزایش سرعت صحبت کردیم که پیشنهد میشه مطالعه بفرمایید.
البته از طرف دیگه شدیدا پیشنهاد می‌کنیم از حداقل افزونه ممکن برای CMS های عمومی مثل وردپرس، جوملا و دروپال استفاده کنید. چرا که یکی از دلایل ایجاد این خطا ممکنه نصب تعداد افزونه‌های زیاد و تداخل بین کدهای این افزونه‌ها باشه.

۴. کار رو به یه متخصص برنامه نویسی یا متخصص SEO بسپارید

اگه مقاله رو خوندید و تلاش کردید این خطا رو در جی تی متریکس جدید برطرف کنید اما هنوز موفق نشدید، می‌تونید کار رو به یه متخصص برنامه نویسی یا متخصص SEO بسپارید. اگه تیم خوب می‌شناسید که هیچ ولی اگه دنبال یک تیم حرفه‌ای و همینطور دنبال بهترین خدمات در زمینه SEO می‌گردید، می‌تونید خدمات سئو سایت میزفا رو بررسی کنید. کلی خدمات متنوع از جمله بهینه سازی سرعت سایت برای خدمت رسانی به شما عزیزان آماده کردیم.

جمع بندی

در این مقاله میزفا درباره روش برطرف کردن خطای Remove unused JavaScript در GTmetrix صحبت کردیم. این خطا مربوط به بهینه سازی فایل‌های JavaScript و حذف فایل‌های JS بدون استفاده بود. ما دلیل ایجاد خطا و روش‌های برطرف کردنش رو گفتیم که البته خیلی آسون نیستند و نیاز به مهارت و تجربه بالا در برنامه نویسی دارند. امیدوارم این آموزش برای شما مفید بوده باشه. تو جلسه بعدی درباره خطای Replace large JavaScript libraries with smaller alternatives صحبت می‌کنیم که باز هم مربوط به بهینه سازی جاوا اسکریپت‌ها میشه.

اگه سوالی دارید در قسمت نظرات (پایین همین صفحه) بپرسید تا با کمال میل پاسخگوی شما عزیزان باشیم.