ב-Chrome 144, הצוות השיק תכונה שהייתה צפויה מאוד בשרת ה-MCP של כלי הפיתוח של Chrome, החלונית החדשה Request conditions (תנאי בקשה) ושיפורים לניפוי באגים בגופנים ובגיליונות סגנון שאומצו.
בזה מסתיימת רשימת התכונות המדהימה שהשקנו במהלך שנת 2025. רוצה לראות אם פספסת משהו? אחרי זה אפשר לעיין בנקודות העיקריות שבהמשך או לעיין במהדורות קודמות של מה חדש בכלי הפיתוח.
עדכונים בשרת ה-MCP בכלי הפיתוח
ביצענו תיקונים שונים בשרת MCP של כלי הפיתוח ופרסמנו את גרסה v0.12.1. בגרסה הזו אנחנו מציגים תכונה חדשה וחשובה – חיבור אוטומטי. התכונה הזו מאפשרת שימוש חוזר בסשן דפדפן קיים. בעזרת חיבור אוטומטי, אתם יכולים להתחיל בניפוי באגים ב-Chrome, ואז להפנות את כלי הפיתוח MCP לאותו מופע של Chrome כדי להמשיך מהמקום שבו הפסקתם.
בפוסט בבלוג שקשור לנושא אפשר לקרוא מידע נוסף על חיבור אוטומטי של DevTools MCP. הרשימה המלאה של השינויים ותיקוני הבאגים מופיעה ביומן השינויים הציבורי ב-GitHub.
הגבלת רוחב פס של בקשות רשת ספציפיות
החלונית 'חסימה של בקשות רשת' נקראת עכשיו תנאי בקשה. בנוסף לחסימת בקשות, בחלונית הזו אפשר עכשיו גם להגביל את קצב השליחה של בקשות נפרדות.
פותחים את החלונית דרך ⋮ > כלים נוספים > תנאי בקשה. מסמנים את תיבת הסימון הפעלת ויסות נתונים (throttle) וחסימה כדי להפעיל את חסימת הבקשות. לוחצים על הלחצן + כדי להוסיף תבנית טקסט חדשה. לוחצים על הסמל כדי למחוק את כל הכללים.
במסמכים המעודכנים מוסבר איך להגביל את קצב הבקשות של רשתות נפרדות.
עריכת כללי @font-face ו- @font-feature-values
הלחצנים @font-face ו-@font-feature-values מוצגים עכשיו בחלונית סגנונות ואפשר לערוך אותם משם.
גיליונות סגנונות שאומצו בחלונית 'רכיבים'
בחלונית Elements מוצגים עכשיו גיליונות סגנונות שאומצו מתחת לשורשי צל ולשורשי מסמכים. כך קל יותר לאנשים שעובדים עם גיליונות סגנונות שנבנו למצוא גיליונות סגנונות שמשפיעים על הרכיבים שלהם ולנפות באגים בסגנונות, במיוחד כשהם לא מוחלים באופן לא צפוי.
מה חדש בכלי הפיתוח בשנת 2025
חידושים מבוססי-AI
החידושים בתחום ה-AI, שהתחילו עם תובנות לגבי המסוף, הפכו לחלק בלתי נפרד מכלי הפיתוח ל-Chrome. החלונית AI assistance היא המרכז העיקרי לניפוי באגים בעזרת AI שמודע להקשר. עם הצעות לקוד בחלוניות Console ו-Sources, והערות אוטומטיות מ-Gemini בנתוני המעקב של Performance, כלי הפיתוח מציעים סט מקיף של כלים מבוססי-AI לייעול תהליכי העבודה.
- תיקוני סגנון מקצה לקצה: אפשר לבקש מ-Gemini לתקן בעיות ב-CSS, ובשילוב עם Workspaces, לשמור את השינויים האלה ישירות בקובצי המקור בדיסק.
- שאלות לגבי ביצועים: עכשיו אפשר לדון במעקב מלא אחר ביצועים בעזרת AI, או להתעמק בתובנות לגבי ביצועים, או להשתמש ב-Gemini כדי להוסיף הערות למעקב.
- ניפוי באגים חזותי: חלונית העזרה מבוססת ה-AI הפכה למולטימודלית, ועכשיו אפשר להעלות תמונות או לצלם מסך כדי לעזור ל-Gemini להבין ולנפות באגים חזותיים.
ביצועים
עיצבנו מחדש את החלונית ביצועים כדי שהניפוי של בעיות בביצועים יהיה פחות מורכב ויותר פרקטי. לדוגמה, עכשיו אפשר לראות בתרשים מעקב מוקלט תובנות שנאספו במיוחד כדי לעזור לכם לזהות צווארי בקבוק מהר יותר ולנווט בתרשימי מעקב מהר יותר. שיפורים נוספים:
- תובנות פרקטיות: הוספנו קבוצה חזקה של תובנות לגבי ביצועים, שמאפשרות לזהות בעיות ספציפיות כמו LCP לפי שלב, גורמים לתזוזת פריסה וחביון של בקשת מסמך.
- הקשר בעולם האמיתי: שילבנו נתוני שטח ונתוני CrUX ישירות בחלונית 'ביצועים', כדי שתוכלו לאמת את תוצאות המעבדה מול חוויות של משתמשים אמיתיים.
- הקשר של המסגרת: Angular v20 ו-React v19.2 משתמשות עכשיו ב-Extensibility API. קל יותר להבין את צווארי הבקבוק בשרשור הראשי כשרואים את עץ הרכיבים. תודה רבה על השותפות עם צוות Angular ו-React!
- שיתוף פעולה משופר: השיתוף של עקבות הפך לקל יותר בזכות האפשרות להוסיף הערות לעקבות, ואפשרויות לייצא תוכן של משאבים ומפות מקור. כך אפשר לוודא שלקולגות או לעצמכם בעתיד יהיה את כל ההקשר שאתם צריכים.
פלטפורמת אינטרנט
הוספנו ל-DevTools כלים ייעודיים למפרטי ה-CSS העדכניים ביותר, ושיפרנו את חוויית המפתחים בתכונות הקיימות.
הוספנו מעקב מעמיק אחר שרשראות מורכבות של משתני CSS, זמינות של Baseline בתיאורי הכלים של מאפיינים, ולאחרונה השקנו תמיכה בניפוי באגים באנימציות מורכבות של כניסה באמצעות הכלל @starting-style ועורך חזותי לפריסת display: masonry החדשה.
הורדת ערוצי התצוגה המקדימה
מומלץ להשתמש ב-Chrome Canary, Dev או Beta כדפדפן ברירת המחדל לפיתוח. ערוצי התצוגה המקדימה האלה מאפשרים לכם לגשת לתכונות העדכניות ביותר של DevTools, לבדוק ממשקי API מתקדמים של פלטפורמות אינטרנט ולמצוא בעיות באתר לפני שהמשתמשים שלכם ייתקלו בהן.
יצירת קשר עם הצוות של כלי הפיתוח ל-Chrome
אתם יכולים להשתמש באפשרויות הבאות כדי לדון בתכונות החדשות, בעדכונים או בכל דבר אחר שקשור לכלי הפיתוח.
- אתם מוזמנים לשלוח לנו משוב ובקשות להוספת תכונות בכתובת crbug.com.
- אפשר לדווח על בעיה בכלי פיתוח באמצעות הסמל אפשרויות נוספות > עזרה > דיווח על בעיה בכלי פיתוח בכלי הפיתוח.
- שולחים ציוץ אל @ChromeDevTools.
- להשאיר תגובות בסרטונים What's new in DevTools YouTube videos או DevTools Tips YouTube videos.