تعداد درخواست‌ها کم و اندازه‌های انتقال کوچک است

Lighthouse گزارش می دهد که در هنگام بارگیری صفحه شما، چه تعداد درخواست شبکه انجام شده و چه مقدار داده منتقل شده است:

• مقادیر Requests و Transfer Size برای ردیف Total با افزودن مقادیر برای ردیف های Image ، Script ، Font ، Stylesheet ، Other ، Document و Media محاسبه می شود.
• ستون شخص ثالث در مقادیر سطر مجموع فاکتور نمی گیرد. هدف آن این است که شما را از تعداد کل درخواست ها و مقدار کل حجم انتقال از دامنه های شخص ثالث آگاه کند. درخواست های شخص ثالث می تواند ترکیبی از هر یک از انواع منابع دیگر باشد.

نحوه کاهش تعداد منابع و اندازه انتقال

تأثیر تعداد منابع زیاد یا اندازه های انتقال بزرگ بر عملکرد بار بستگی به نوع منبعی دارد که درخواست می شود.

CSS و جاوا اسکریپت

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

معیارهای تحت تأثیر: همه

تصاویر

درخواست‌ها برای تصاویر مانند CSS و جاوا اسکریپت رندر مسدود نمی‌شوند، اما همچنان می‌توانند بر عملکرد بارگذاری تأثیر منفی بگذارند. یک مشکل رایج زمانی است که یک کاربر تلفن همراه صفحه ای را بارگیری می کند و می بیند که تصاویر شروع به بارگیری کرده اند اما اتمام آن مدتی طول می کشد. برای یادگیری نحوه بارگیری سریعتر تصاویر، به Optimize your images مراجعه کنید.

معیارهای تحت تأثیر: اولین رنگ محتوایی ، اولین رنگ معنادار ، شاخص سرعت

فونت ها

بارگذاری ناکارآمد فایل های فونت می تواند باعث ایجاد متن نامرئی در حین بارگذاری صفحه شود. به Optimize your fonts مراجعه کنید تا یاد بگیرید چگونه فونتی را که در دستگاه کاربر در دسترس است به‌طور پیش‌فرض تنظیم کنید و پس از پایان دانلود فونت سفارشی خود را تغییر دهید.

معیارهای تحت تأثیر: اولین رنگ محتوایی

اسناد

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

معیارهای تحت تأثیر: اولین رنگ محتوایی

رسانه ها

فایل های متحرک GIF اغلب بسیار بزرگ هستند. برای یادگیری نحوه بارگذاری سریع‌تر انیمیشن‌ها ، به جایگزین کردن GIF با ویدیوها مراجعه کنید.

معیارهای تحت تأثیر: اولین رنگ محتوایی

از بودجه عملکرد برای جلوگیری از رگرسیون استفاده کنید

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

منابع

کد منبع برای درخواست Keep کم است و اندازه های انتقال حسابرسی کوچک است