سرعت صفحه اندازه گیری سرعت بارگذاری محتوای صفحه شما است.
سرعت صفحه اغلب با "سرعت سایت" اشتباه گرفته می شود، که در واقع سرعت صفحه برای نمونه ای از بازدیدهای صفحه در یک سایت است. سرعت صفحه را می توان در "زمان بارگذاری صفحه" (زمان لازم برای نمایش کامل محتوا در یک صفحه خاص) یا "زمان تا اولین بایت" (مدت زمانی طول می کشد تا مرورگر شما اولین بایت اطلاعات را دریافت کند) توصیف شود. وب سرور).
شما می توانید سرعت صفحه خود را با PageSpeed Insights گوگل ارزیابی کنید. امتیاز سرعت PageSpeed Insights دادههای CrUX (گزارش تجربه کاربر کروم) را در بر میگیرد و دو معیار مهم سرعت را گزارش میدهد: First Contentful Paint (FCP) و DOMContentLoaded (DCL).
گوگل اشاره کرده است که افزایش سرعت سایت وردپرس (و در نتیجه سرعت صفحه) یکی از سیگنال هایی است که الگوریتم آن برای رتبه بندی صفحات استفاده می کند. و تحقیقات نشان داده است که گوگل ممکن است به طور خاص زمان را برای اولین بایت اندازه گیری کند، زمانی که سرعت صفحه را در نظر می گیرد. علاوه بر این، سرعت پایین صفحه به این معنی است که موتورهای جستجو می توانند صفحات کمتری را با استفاده از بودجه خزنده اختصاص داده شده خود بخزند و این می تواند بر نمایه سازی شما تأثیر منفی بگذارد.
سرعت صفحه نیز برای تجربه کاربر مهم است. صفحاتی که زمان بارگذاری طولانیتری دارند، نرخ پرش بالاتر و میانگین زمان کمتری در صفحه دارند. زمان بارگذاری طولانیتر نیز بر تبدیلها تأثیر منفی دارد.
در اینجا چند روش برای کاهش سرعت بارگذاری صفحه وجود دارد:
از Gzip، یک برنامه نرم افزاری برای فشرده سازی فایل، برای کاهش اندازه فایل های CSS، HTML و جاوا اسکریپت خود که بزرگتر از 150 بایت هستند، استفاده کنید.
از gzip در فایل های تصویری استفاده نکنید. در عوض، اینها را در برنامهای مانند فتوشاپ فشرده کنید تا بتوانید کنترل کیفیت تصویر را حفظ کنید. "بهینه سازی تصاویر" را در زیر ببینید.
با بهینه سازی کد خود (از جمله حذف فاصله، کاما و سایر کاراکترهای غیر ضروری)، می توانید سرعت صفحه خود را به طرز چشمگیری افزایش دهید. همچنین نظرات کد، قالب بندی و کدهای استفاده نشده را حذف کنید. گوگل استفاده از CSSNano و UglifyJS را توصیه می کند.
هر بار که صفحه ای به صفحه دیگری هدایت می شود، بازدیدکننده شما با زمان بیشتری در انتظار تکمیل چرخه درخواست-پاسخ HTTP است. به عنوان مثال، اگر الگوی تغییر مسیر تلفن همراه شما به این صورت است:
example.com -> www.example.com -> m.example.com -> m.example.com/home
... هر یک از این دو تغییر مسیر اضافی، بارگذاری صفحه شما را کندتر می کند.
مرورگرها قبل از اینکه بتوانند یک صفحه را ارائه دهند، باید با تجزیه HTML یک درخت DOM بسازند. اگر مرورگر شما در طول این فرآیند با یک اسکریپت مواجه شد، باید آن را متوقف کرده و قبل از ادامه آن اجرا کند.
گوگل پیشنهاد می کند از مسدود کردن جاوا اسکریپت اجتناب کنید و آن را به حداقل برسانید.
مرورگرها اطلاعات زیادی (سبکها، تصاویر، فایلهای جاوا اسکریپت و موارد دیگر) را در حافظه پنهان میکنند تا وقتی بازدیدکننده به سایت شما بازگردد، مرورگر مجبور نباشد کل صفحه را دوباره بارگیری کند. از ابزاری مانند YSlow استفاده کنید تا ببینید آیا از قبل تاریخ انقضا برای کش خود تعیین کرده اید یا خیر. سپس سرصفحه "Epires" خود را برای مدت زمانی که می خواهید آن اطلاعات در حافظه پنهان ذخیره شود، تنظیم کنید. در بسیاری از موارد، مگر اینکه طراحی سایت شما به طور مکرر تغییر کند، یک سال یک دوره زمانی معقول است. گوگل در اینجا اطلاعات بیشتری در مورد استفاده از حافظه پنهان دارد.
زمان پاسخگویی سرور شما تحت تأثیر میزان ترافیک دریافتی، منابعی که هر صفحه استفاده می کند، نرم افزاری که سرور شما استفاده می کند و راه حل میزبانی مورد استفاده شما می باشد. برای بهبود زمان پاسخگویی سرور خود، به دنبال گلوگاه های عملکردی مانند پرس و جوهای کند پایگاه داده، مسیریابی کند یا کمبود حافظه کافی باشید و آنها را برطرف کنید. زمان پاسخگویی بهینه سرور کمتر از 200 میلی ثانیه است. درباره بهینه سازی زمان خود برای بایت اول بیشتر بیاموزید.
شبکههای توزیع محتوا (CDN) که شبکههای تحویل محتوا نیز نامیده میشوند، شبکههایی از سرورها هستند که برای توزیع بار ارائه محتوا استفاده میشوند. اساساً، کپیهایی از سایت شما در چندین مرکز داده با تنوع جغرافیایی ذخیره میشوند تا کاربران دسترسی سریعتر و مطمئنتری به سایت شما داشته باشند.
مطمئن شوید که تصاویر شما بزرگتر از آنچه که نیاز است نیستند، فرمت فایل مناسبی دارند (PNG ها معمولا برای گرافیک های کمتر از 16 رنگ بهتر هستند در حالی که JPEG ها معمولا برای عکس ها بهتر هستند) و برای وب فشرده شده اند. .
از CSS sprites برای ایجاد یک الگو برای تصاویری که اغلب در سایت خود استفاده می کنید مانند دکمه ها و آیکون ها استفاده کنید. sprites های CSS تصاویر شما را در یک تصویر بزرگ ترکیب می کنند که به یکباره بارگیری می شود (که به معنی درخواست های HTTP کمتر است) و سپس تنها بخش هایی را که می خواهید نشان دهید نمایش می دهد. این به این معنی است که شما در زمان بارگذاری صرفه جویی می کنید و کاربران را مجبور نمی کنید تا چندین تصویر بارگذاری شوند.
برچسب های مهم