כלי ביצועים חינמי
בדיקת מהירות אתר
אנחנו טוענים את הדף שלך כמו טלפון בינוני בחיבור 4G איטי, מודדים כמה מהר התוכן הראשי מופיע וכמה הדף קופץ, ומראים מה הופך אותו לכבד. כשיש ל-Google נתוני משתמשים אמיתיים עבור האתר שלך, גם הם מוצגים.
חינם. בדרך כלל מסתיים בפחות מדקה.
מה הכלי בודק
טלפון ברשת 4G איטית
הדף נטען ב-Chromium כטלפון מסוג Moto G Power (412 × 823) עם השהיה של 150 ms, כ-1.6 Mbps בהורדה ו-750 Kbps בהעלאה, ומעבד איטי פי 4. זה הפרופיל ש-Lighthouse משתמש בו לבדיקות מובייל.
Largest Contentful Paint (LCP)
מתי התמונה או גוש הטקסט הגדולים ביותר במסך הראשון סיימו להיות מוצגים, ואיזה רכיב זה היה.
Cumulative Layout Shift (CLS)
כמה תוכן גלוי זז באופן לא צפוי בזמן שהדף נטען.
Total Blocking Time (TBT)
כמה זמן סקריפטים העסיקו את הדפדפן יותר מדי מכדי להגיב להקשה: החלק של כל משימה ארוכה שמעבר ל-50 ms, מסוכם. זהו התחליף במעבדה ל-Interaction to Next Paint.
מה הדף מוריד
סך הבייטים והבקשות, בחלוקה לתמונות, סקריפטים, CSS וגופנים, והחלק שמגיע מצדדים שלישיים.
תמונות כבדות וקבצים שחוסמים רינדור
תמונות מעל 150 KB או רחבות בהרבה מהשטח שבו הן מוצגות, וקובצי ה-CSS והסקריפטים שמעכבים את הרינדור הראשון.
נתוני משתמשים אמיתיים מ-Chrome
דוח Chrome UX Report של Google עבור המקור (origin) שלך בטלפונים, באחוזון ה-75: LCP, INP ו-CLS, כשיש ל-Google מספיק תנועה לאתר.
מה הכלי לא יכול לבדוק
- לתת את אותם מספרים בכל הרצה. תוצאות מעבדה משתנות בהתאם לרשת, לעומס על השרת ולסקריפטים של צד שלישי, ולכן כדאי להשוות מגמות ולא הרצות בודדות.
- להתאים בדיוק ל-PageSpeed Insights. שניהם משתמשים בפרופיל טלפון דומה, אבל רצים על מכונות ורשתות שונות.
- למדוד INP במעבדה. INP דורש אינטראקציות אמיתיות, ולכן בדיקת המעבדה מציגה TBT, ונתוני השטח מציגים INP כשהם קיימים.
- להציג נתוני שטח לכל אתר. Chrome UX Report מכסה את 28 הימים האחרונים, ורק מקורות עם מספיק תנועה מ-Chrome.
- לבדוק יותר מהדף האחד שהזנת. דוח ביצועים בתשלום בודק 3 דפים מרכזיים ומדרג את הגורמים יחד עם התיקונים.
למה זה חשוב
דף שמרגיש מיידי ב-Wi-Fi של המשרד ובמחשב נייד מהיר יכול לקחת כמה שניות בטלפון בינוני עם קליטה חלשה. זה המצב שהבדיקה הזו משחזרת, כי שם תמונות וסקריפטים כבדים גורמים הכי הרבה נזק.
Core Web Vitals הם המדדים של Google לחוויה הזו: טעינה (LCP), תגובתיות (INP) ויציבות חזותית (CLS). Google משתמשת בהם בדירוג, אבל אומרת שחוויית דף טובה לא גוברת על תוכן רלוונטי. ההשפעה הגדולה שלהם היא על אנשים: דף איטי או קופצני מאבד מבקרים עוד לפני שהם קוראים משהו.
הגורמים הם בדרך כלל מוחשיים: תמונה ראשית (hero) לא דחוסה של כמה מגה-בייטים, וידג׳ט צ׳אט שנטען לפני התוכן, גופן אינטרנט שמסתיר טקסט, או באנר שנדחף לראש הדף אחרי שהוא מופיע. הבדיקה מציינת את רכיב ה-LCP ואת הקבצים הכבדים ביותר, כדי שאפשר יהיה לראות איזה מהגורמים האלה רלוונטי.
איך לקרוא את התוצאות
- Largest Contentful Paint (LCP)
- טוב מתחת ל-2.5 s, גרוע מעל 4 s. אם רכיב ה-LCP הוא תמונה, הגודל שלה ועדיפות הטעינה שלה חשובים יותר מכול; אם הוא טקסט, כדאי לבדוק את גופני האינטרנט ואת ה-CSS שחוסם רינדור.
- Cumulative Layout Shift (CLS)
- טוב מתחת ל-0.1, גרוע מעל 0.25. ציון ללא יחידות שמשלב כמה מהמסך זז ועד כמה רחוק.
- Total Blocking Time (TBT)
- טוב מתחת ל-200 ms, גרוע מעל 600 ms. TBT גבוה מנבא תגובה איטית להקשות אצל משתמשים אמיתיים.
- בייטים ובקשות
- אין מגבלה רשמית; כדאי לבדוק איזה סוג קבצים שולט. תמונות הן בדרך כלל החלק הגדול ביותר, וחלק גבוה של צד שלישי מצביע על אפליקציות, תגיות ווידג׳טים.
- תמונות כבדות
- כל תמונה מעל 150 KB, או שהורדה ברוחב גדול בהרבה מזה שבו היא מוצגת, עם גודל הקובץ והמידות שלה.
- קבצים שחוסמים רינדור (Render-blocking files)
- קובצי CSS וסקריפטים סינכרוניים שהדפדפן חייב להוריד לפני שהוא יכול להציג משהו.
- נתוני שטח, אחוזון 75 (Field data)
- משתמשי Chrome אמיתיים בטלפונים ב-28 הימים האחרונים. אחוזון 75 פירושו ששלוש מכל ארבע טעינות דף היו מהירות לפחות כמו הערך הזה. INP טוב מתחת ל-200 ms וגרוע מעל 500 ms.
- אין נתוני שטח
- אין ל-Google מספיק תנועה מ-Chrome למקור שלך. זה לא אומר דבר על המהירות שלך; כדאי להסתמך על תוצאות המעבדה.
איך לתקן את הבעיות הנפוצות ביותר
תמונת LCP איטית
יש להגיש את התמונה הראשית בגודל שבו היא מוצגת, באמצעות srcset, בפורמט WebP או AVIF. אין לטעון אותה בטעינה עצלה (lazy-load), יש להוסיף fetchpriority="high", ולשים אותה ב-HTML כרכיב img במקום לטעון אותה מסקריפט או כרקע CSS.
תוכן שקופץ בזמן הטעינה
יש לתת לתמונות, לסרטונים ולתוכן מוטמע מאפייני width ו-height או aspect-ratio ב-CSS. כדאי לשמור מקום לבאנרים, להודעות עוגיות ולמודעות, או להציג אותם כשכבות עליונות שלא דוחפות את התוכן למטה. לגופני אינטרנט, יש להשתמש ב-font-display: optional או בגופן גיבוי בגודל תואם.
Total Blocking Time גבוה
קודם כול כדאי להסיר אפליקציות, תגיות ותוספים שכבר לא בשימוש; הסקריפטים שלהם נשארים לעיתים קרובות גם אחרי שמפסיקים להשתמש בהם. צ׳אט, ביקורות ואנליטיקס כדאי לטעון עם defer או אחרי שהדף הופך לאינטראקטיבי. ב-Shopify, כדאי לבדוק את Online Store › Themes › Customize › App embeds.
CSS וסקריפטים שחוסמים רינדור
יש להוסיף defer לסקריפטים שלא צריכים לרוץ לפני הציור הראשון, להטמיע ישירות בדף (inline) את כמות ה-CSS הקטנה שהמסך הראשון צריך, ולהסיר גיליונות סגנון של תכונות שהדף לא משתמש בהן.
תמונות כבדות מדי
כדאי לשנות את גודל התמונות לפני ההעלאה (רוחב של כ-2000 px מספיק בהחלט לבאנר ברוחב מלא) ולדחוס אותן. Shopify ו-WordPress יכולות להגיש גרסאות קטנות יותר באופן אוטומטי כשערכת העיצוב מבקשת אותן, ולכן כדאי לוודא שערכת העיצוב משתמשת בגדלי תמונה רספונסיביים.
שאלות על הכלי
למה התוצאות שלי שונות מ-PageSpeed Insights?
בדיקות מעבדה תלויות במכונה, ברשת וברגע. PageSpeed Insights מריץ את Lighthouse על השרתים של Google ומדמה את החיבור האיטי, ואילו אנחנו מפעילים את ההאטה (throttling) בדפדפן אמיתי. אפשר לצפות לטווחים דומים, לא למספרים זהים.
מה נחשב LCP טוב?
2.5 שניות או פחות ב-75% לפחות מטעינות הדף, לפי web.dev. מעל 4 שניות נחשב גרוע.
למה אין נתוני משתמשים אמיתיים לאתר שלי?
Chrome UX Report כולל רק מקורות שאפשר לגלות באופן ציבורי ושמקבלים מספיק ביקורים ממשתמשי Chrome שמשתפים נתוני שימוש. אתרים קטנים רבים לא מגיעים לרמה הזו; בדיקת המעבדה עדיין מראה מה לתקן.
למה לבדוק בטלפון איטי ולא במחשב?
כי שם הבעיות מופיעות ראשונות. מחשב נייד מהיר מסתיר תמונות וסקריפטים כבדים שעולים שניות בטלפון בינוני, ו-Lighthouse משתמש באותו פרופיל טלפון לבדיקות המובייל שלו.
מה קרה ל-First Input Delay?
Interaction to Next Paint (INP) החליף את First Input Delay כמדד Core Web Vital במרץ 2024. INP בוחן את העיכוב של אינטראקציות לאורך כל הביקור, ולא רק של הראשונה.
מקורות
- web.dev: מדדי Web Vitals(נפתח בכרטיסייה חדשה)
- web.dev: המדד Largest Contentful Paint (LCP)(נפתח בכרטיסייה חדשה)
- web.dev: המדד Cumulative Layout Shift (CLS)(נפתח בכרטיסייה חדשה)
- web.dev: המדד Interaction to Next Paint (INP)(נפתח בכרטיסייה חדשה)
- web.dev: המדד Total Blocking Time (TBT)(נפתח בכרטיסייה חדשה)
- Chrome for Developers: הדוח Chrome UX Report(נפתח בכרטיסייה חדשה)
- Lighthouse: האטת רשת(נפתח בכרטיסייה חדשה)
כלים קשורים
- טכניבדיקת אתר מקיפה בחינםסריקה אחת של נגישות, SEO, מהירות, המרות, אבטחה והגדרות דוא״ל, עם הממצאים החשובים ביותר בכל תחום.לפתיחת הכלי
- SEOבדיקת SEO לאתראיתור בעיות SEO טכניות בדפים המרכזיים שלך, שמשאירות דפים מחוץ לחיפוש או גורמות להם להיראות גרוע יותר בתוצאות.לפתיחת הכלי
- SEOבדיקת תגיות מטאתגית ה-title, תיאור המטא, canonical, robots, Open Graph ותגיות head נוספות של כל דף, עם תצוגה מקדימה בחיפוש ובשיתוף.לפתיחת הכלי
צריכים את התיקונים, ולא רק את הממצאים?
דוח ביצועים ($55, תשלום חד-פעמי) מתחיל מהסריקה החינמית המלאה ומוסיף עוד עמודים, את השינוי שצריך לבצע לכל ממצא, קובץ PDF ובדיקות חוזרות לאימות התיקונים.