6 نکته بهینه سازی جاوا اسکریپت از طرف گوگل

در یک ویدیوی جدید از Google، توسعه دهنده مدافع، آلن کنت، شش راه برای بهینه سازی جاوا اسکریپت برای بهبود عملکرد وب سایت شما به اشتراک می گذارد.

کنت مشکلات عملکرد رایج ناشی از جاوا اسکریپت را شناسایی می‌کند و مراحلی را که می‌توانید برای رفع آنها انجام دهید، طی می‌کند.

1. از تکثیر فایل های جاوا اسکریپت خودداری کنید

از افزایش تعداد فایل های جاوا اسکریپت در سایت خود اجتناب کنید.

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

کاهش تعداد فایل های جاوا اسکریپت که مرورگر باید دانلود کند می تواند عملکرد وب سایت را بهبود بخشد.

چگونه تشخیص دهیم

را فرصت بخش از PageSpeed ​​Insights گزارش توصیه های خاص سایت شما را فهرست می کند.

به دنبال توصیه به تعداد درخواست ها را کم نگه دارید و اندازه های انتقال را کوچک نگه دارید.

بر روی توصیه برای خلاصه ای از تعداد و اندازه انواع منابع درخواستی از جمله فایل های جاوا اسکریپت کلیک کنید.

چگونه برای رفع

شما می توانید این مشکل را به روش های مختلف برطرف کنید. یکی از گزینه هایی که گوگل توصیه می کند این است که فایل های کوچکتر را با هم ترکیب کنید تا یک فایل واحد و بزرگتر برای دانلود داشته باشید.

راه حل دیگر پشتیبانی از HTTP2 در سایت شما است، زیرا می تواند عملکرد را بدون پیوستن به فایل ها بهبود بخشد.

2. از جستجوی بیش از حد DNS اجتناب کنید

از تعداد زیاد جستجوی DNS برای فایل های جاوا اسکریپت مرجع اجتناب کنید، زیرا این کار می تواند اولین بازدید کاربر از سایت شما را کند کند.

چگونه تشخیص دهیم

PageSpeed ​​Insights می‌تواند فهرستی از نام‌های دامنه مورد استفاده در URL‌ها را در بخش‌هایی مانند کاهش زمان اجرای جاوا اسکریپت.

برگه شبکه در ابزار توسعه‌دهنده کروم راه دیگری برای مشاهده همه نام‌های دامنه ارجاع شده است.

چگونه برای رفع

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

3. جاوا اسکریپت ناکارآمد را حذف کنید

جاوا اسکریپت ناکارآمد را کاهش دهید یا حذف کنید، زیرا می تواند سرعت صفحات وب را کاهش دهد و منجر به تجربه ضعیف کاربر شود.

چگونه تشخیص دهیم

در گزارش PageSpeed ​​Insights گوگل به دنبال فرصت های زیر باشید:

  • کاهش زمان اجرای جاوا اسکریپت: این اسکریپت را گزارش می دهد که در آن مقدار زیادی از زمان CPU صرف تجزیه یا اجرای کد جاوا اسکریپت شده است.
  • منابع مسدود کننده رندر را حذف کنید: این شامل جاوا اسکریپت است که ممکن است قبل از رندر شدن صفحه اجرا شود و باعث می شود کاربر برای دیدن هر محتوا مدت بیشتری منتظر بماند.
  • سند.نوشتن: در صورت استفاده نادرست از این می‌تواند باعث مشکلات عملکردی قابل توجهی در صفحه شود، زیرا از انجام سایر عملیات جلوگیری می‌کند.
  • از شنوندگان منفعل استفاده نمی کند: شنونده غیرفعال به مرورگر اشاره می کند که کد جاوا اسکریپت تابعی را که از پیمایش جلوگیری می کند فراخوانی نمی کند و به مرورگر اجازه می دهد حتی زمانی که جاوا اسکریپت هنوز در حال اجرا است صفحه را اسکرول کند.

چگونه برای رفع

حذف جاوا اسکریپت ناکارآمد موضوع بزرگ تری است که فراتر از محدوده ویدیوی گوگل است.

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

4. جاوا اسکریپت استفاده نشده را حذف کنید

جاوا اسکریپت استفاده نشده نیز ناکارآمد است، اما گوگل می گوید این مشکل آنقدر رایج است که به تنهایی آن را برطرف کند.

استفاده مجدد از کد در سراسر سایت ها می تواند منجر به گنجاندن جاوا اسکریپتی شود که مورد نیاز نیست.

جاوا اسکریپتی که هرگز فراخوانی نمی شود هنوز باید توسط مرورگر وب دانلود و تجزیه شود، که باعث اتلاف منابع می شود.

چگونه تشخیص دهیم

در گزارش PageSpeed ​​Insights گوگل به دنبال فرصت های زیر باشید:

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

چگونه برای رفع

گوگل تکنیکی به نام درخت تکان دادن را توصیه می کند که می تواند برای شناسایی جاوا اسکریپتی که هرگز فراخوانی نمی شود، استفاده شود که پاک کردن آن بی خطر است.

5. فشرده سازی فایل های جاوا اسکریپت

مطمئن شوید که فایل های جاوا اسکریپت شما هنگام دانلود فشرده شده اند. در حالی که مرورگر وب باید زمان بیشتری برای CPU صرف کند تا محتوای فایل را از حالت فشرده خارج کند، گوگل می گوید فشرده سازی یک پیروزی کلی است.

چگونه تشخیص دهیم

گزارش PageSpeed ​​Insights دارای بخشی است که فایل‌های جاوا اسکریپت را برجسته می‌کند که ممکن است از فشرده‌سازی سود ببرند.

کلیک کردن فشرده سازی متن را فعال کنید به شما نشان می دهد که کدام فایل ها برای فشرده سازی توصیه می شوند.

چگونه برای رفع

اکثر مرورگرهای وب یا سیستم های مدیریت محتوا دارای پشتیبانی داخلی برای فشرده سازی دانلودها در صورت پیکربندی صحیح هستند.

6. مدت زمان کش مناسب را برای کد جاوا اسکریپت تنظیم کنید

بررسی کنید که فایل‌های جاوا اسکریپت شما با هدرهای زمان انقضای کش مناسب برگردانده شده باشند.

این به مرورگرها کمک می‌کند تا از سربار بررسی اینکه آیا فایل‌های جاوا اسکریپت در حافظه پنهان آن قدیمی هستند، اجتناب کنند، که باعث بهبود عملکرد می‌شود.

چگونه تشخیص دهیم

در شبکه سازی برگه از ابزارهای توسعه دهنده کروم می توانید سرصفحه های پاسخ HTTP را برای فایل های جاوا اسکریپتی که دانلود شده اند بررسی کنید. به دنبال هدرهایی مانند کنترل کش.

در PageSpeed ​​Insights به دنبال فرصتی با عنوان باشید دارایی های ایستا را با خط مشی کش کارآمد ارائه دهید. با کلیک بر روی آن، فهرستی از منابع، از جمله فایل‌های جاوا اسکریپت، که ممکن است از هدرهای کش مناسب بهره مند شوند، به شما نشان می‌دهد.

چگونه رفع کنیم

یک راه برای افزایش حافظه پنهان فایل های رایج جاوا اسکریپت، ارجاع فایل ها از یک مکان عمومی مشترک است.

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

برای جزئیات بیشتر در مورد هر یک از توصیه های بالا برای بهینه سازی جاوا اسکریپت، ویدیوی کامل گوگل را در زیر ببینید:


تصویر ویژه: Visual Generation/Shutterstock