DebugBear לוקח רק כמה שניות להתחיל להשתמש. אתה ממש מכוון אותו לכתובת אתר שאתה רוצה לצפות, והוא יתחיל לצפות בה. אתה לא מתקין כלום.
זה יתחיל להריץ בדיקות, ומיד יש לך טבלאות ביצועים שאתה יכול להתחיל להסתכל עליהם שעוקבים אחריהם לאורך זמן, לא רק חד פעמי.
יש לי דוחות מלאים של Lighthouse שם, שמראים לי דברים שאני באמת צריך לעבוד עליהם.
מכיוון שכל השינויים הללו נבדקים לאורך זמן, אתה יכול לראות בדיוק מה השתנה ומתי. זה די גדול. האם חבילת ה-JavaScript שלך קפצה בגודל? מתי? למה? האם ציון ה-SEO שלך ירד? מתי? למה?
עוד דבר נהדר: DebugBear ישלח לך אימייל (או ישלח הודעת Slack) כשיש לך רגרסיות. אז למרות שהתרשימים מדהימים, זה לא שאתה צריך להיכנס בכל פעם כדי לראות מה קורה. אתה יכול גם להגדיר תקציבי ביצועים ברורים מאוד כדי לבדוק מול:
לשבור תקציב ביצועים? תקבל הודעה:
רוצה להשוות בין אזורים/דפים שונים באתר שלך? (אתה יכול להיכנס אליהם לפני שאתה בודק אותם, אגב.) או להשוות את עצמך למתחרים כדי לוודא שאתה לא מפגר? אין בעיה, עקוב גם אחר אלה:
בדיקת ייצור היא דבר טוב מאוד. זה מודד את המציאות ואתה יכול להתחיל במהירות. אבל זה יכול להיות גם דבר טוב מאוד למדוד דברים לפני הם הופכים לבעיה. אתה יודע איך אתה מקבל פריסה מקדימה בשירותים כמו Netlify ו-Vercel? ובכן, ל-DebugBear יש אינטגרציות שנבנו רק עבור שירותים כמו נטליפיי ו ורסל.
כעת, כאשר יש לך בקשת משיכה עם תצוגה מקדימה של פריסה, אתה יכול לראות ממש ב-GitHub אם המדדים מקושרים.
זה הרבה מאוד ערך עבור מעט מאוד עבודה. אבל אל תלך שולל על ידי הפשטות - יש כל מיני דברים מתקדמים שאתה יכול לעשות. אתה יכול לחמם את המטמון. אתה יכול לבדוק ממיקומים גיאוגרפיים שונים. אתה יכול לכתוב סקריפט לכניסה שלוקח את בוררי ה-CSS לקלט ואת הערכים להכניס בהם. אתה אפילו יכול לגרום לו להפעיל JavaScript משלך כדי לעשות דברים מיוחדים כדי להכין אותו לבדיקה, כמו מודלים פתוחים, הזרקה peformance.mark מדדים, או בצע ניווט אחר. 🎉
מקור: https://css-tricks.com/monitoring-lighthouse-scores-and-core-web-vitals-with-debugbear/
