בכלי הפיתוח יש חלונית עזרה מבוססת-AI שמאפשרת לכם להבין את האתר ולפתור בעיות באמצעות צ'אט עם סוכן AI.
בעזרת כלים מבוססי-AI, אתם יכולים לנפות באגים בעיצוב, ברשת, בביצועים ובמקורות של האתר.
כדי להתכתב בצ'אט עם Gemini בחלונית עזרה מ-AI בצורה יעילה, כדאי ללמוד איך לפתוח את החלונית, לכתוב הנחיות ולשלוט במהלך השיחה.
פתיחת החלונית של כלים מבוססי-AI
החלונית עזרה מ-AI נפתחת במגירה.
כדי לפתוח את החלונית, לוחצים על הלחצן עזרה מ-AI שנמצא בנקודת הכניסה הגלובלית בצד שמאל של סרגל הכלים הראשי בחלק העליון.
אפשר גם לפתוח את החלונית ישירות מהחלוניות Elements (רכיבים), Network (רשת), Sources (מקורות) או Performance (ביצועים). לשם כך, לוחצים לחיצה ימנית על רכיב או על בקשה ובוחרים באפשרות Ask AI (שאילתת AI).
מתפריט הפקודות
כדי לפתוח את כלים מבוססי-AI מתפריט הפקודות, מקלידים AI ואז מריצים את הפקודה הצגת כלים מבוססי-AI, שמופיע לידה התג חלונית הזזה.
בתפריט 'כלים נוספים'
אפשרות נוספת: בפינה השמאלית העליונה, בוחרים באפשרות אפשרויות נוספות > כלים נוספים > עזרה מ-AI.
הנחיות
כשמתחילים שיחה חדשה, עזרה מבוססת-AI מציעה הנחיות לדוגמה שיעזרו לכם להתחיל במהירות.
לוחצים על אחת ההנחיות כדי למלא מראש את שדה ההנחיה להזנת קלט בתחתית החלונית.
אפשרות אחרת היא להקליד הנחיה או שאלה בשדה להזנת קלט.
כדי לשלוח הנחיה, מקישים על Enter או לוחצים על החץ בצד ימין של שדה להזנת קלט.
בתיבת הצ'אט החינמית אתם יכולים לשאול שאלות ברמה גבוהה יותר, כמו "איך משתמשים בכלי הפיתוח כדי לנפות באגים בנגישות?" או "אילו בקשות רשת איטיות?", וגם להעתיק חלקים מקובץ, למשל מהחלונית מקורות, ולהדביק אותם בצ'אט כדי לשאול מה הם עושים.
עזרה מ-AI בעיצוב
אפשר להשתמש בחלונית כלי סיוע מבוססי-AI לעיצוב כדי להבין את הפריסה הכללית של אתר, סגנונות של רכיבים ספציפיים ולקבל תיקונים שנוצרו על ידי AI לבאגים ב-CSS.
פתיחת כלים מבוססי-AI מחלונית הרכיבים
כדי לפתוח את העזרה מ-AI מתוך החלונית רכיבים, כשבודקים צומת DOM, לוחצים לחיצה ימנית על הצומת ובוחרים באפשרות שאילתת AI.
כשפותחים את העזרה מ-AI בצורה הזו, רכיב ה-DOM שנבדק כבר נבחר מראש כרכיב הקשר לשיחה.
אפשר גם ללחוץ על הלחצן הצף שמצורף לצומת DOM שמעבירים מעליו את העכבר.
הקשר השיחה
הצ'אטים עם עזרה מ-AI תמיד קשורים לרכיב שנבדק כרגע, שהוא הרכיב האחרון שנבחר בעץ ה-DOM בחלונית Elements. הפניה לרכיב הזה מוצגת בפינה הימנית התחתונה של החלונית.
אפשר לשנות את ההקשר באמצעות הכלי לבחירת רכיבים שנמצא ליד הרכיב הנוכחי או באמצעות בחירה מתוך עץ ה-DOM בחלונית Elements.
אחרי שבוחרים את ההקשר, אפשר לצלם את אזור התצוגה ולשלוח אותו בצ'אט. לוחצים על הלחצן צילום מסך לצד שדה להזנת קלט של הצ'אט.
אתם יכולים להשתמש בצילומי מסך כדי לספק הקשר חזותי נוסף להנחיות שלכם, למשל, כדי לבדוק אם יש מרווחים זהים בין כל הכפתורים שמוצגים.
האלמנט שנבדק כרגע הוא הבסיס לשיחה, אבל לעזרה מ-AI יש גישה לכל ממשקי ה-API של האינטרנט כדי לאסוף מידע נוסף מהדף שנבדק. זה כולל שליחת שאילתות לגבי רכיבים אחרים באמצעות document.querySelector או הערכה של סגנונות מחושבים.
עזרה מ-AI ברשת
אפשר להשתמש בחלונית AI Assistance (עזרה מ-AI) כדי להבין את הבקשות שנשלחות מהאתר שלכם לרשת.
פתיחת החלונית של כלים מבוססי-AI מחלונית הרשת
כדי לפתוח את העזרה מ-AI מתוך החלונית רשת, לוחצים לחיצה ימנית על בקשה ובוחרים באפשרות שאלה ל-AI.
כשפותחים את העזרה מ-AI בצורה הזו, בקשת הרשת שנבחרה מראש משמשת כהקשר לשיחה.
אפשר גם ללחוץ על הלחצן הצף ליד בקשת הרשת שמעבירים מעליה את העכבר.
הקשר השיחה
הצ'אטים עם עזרה מ-AI קשורים לבקשת הרשת שנבחרה כרגע ברשימת הבקשות בחלונית Network. הפניה לבקשה הזו מוצגת בפינה הימנית התחתונה של החלונית.
כדי לשנות את ההקשר, לוחצים על בקשה אחרת בחלונית רשת.
העזרה מ-AI משתמשת בכתובת ה-URL של הבקשה, בכותרות, בתזמונים ובשרשרת של יוזם הבקשה כדי לענות על השאלות שלכם.
חשוב לדעת: כותרות שעשויות להכיל מידע רגיש מצונזרות אוטומטית.
אחרי שמתחילים שיחה, לוחצים על הלחצן הרחבה בצ'יפ Analyzing network data כדי לראות את הנתונים הגולמיים שבהם נעשה שימוש בעזרה מ-AI.
עזרה מ-AI לשיפור הביצועים
אפשר להשתמש בחלונית כלים מבוססי-AI כדי להבין את פרופילי הביצועים שתועדו בחלונית הביצועים.
פתיחת החלונית של כלים מבוססי-AI מתוך חלונית הביצועים
כדי לפתוח את הכלים מבוססי-AI מהחלונית ביצועים, קודם צריך לתעד פרופיל ביצועים.
בהתאם למה שרוצים לבדוק, אפשר לפתוח את החלונית **עזרה מ-AI** מתוך תובנות לגבי ביצועים ספציפיים או מתוך פעילויות בתצוגת מעקב הביצועים.
תובנות לגבי הביצועים
בכרטיסייה תובנות, פותחים תובנה, למשל **LCP by phase, ואז לוחצים על הלחצן Ask AI** (שאלת AI).
החלונית כלים מבוססי-AI נפתחת בכלי הפיתוח עם תובנת הביצועים הזו שנבחרה מראש כהקשר לשיחה.
תצוגת נתוני מעקב אחר ביצועים
כדי לפתוח את העזרה מ-AI מתצוגת המעקב, לוחצים לחיצה ימנית על פעילות מסוימת ובוחרים באפשרות שאילתת AI.
במקרה כזה, הפעילות הזו נבחרת מראש כהקשר לשיחה.
הקשר השיחה
הפעילות שנבחרה משמשת כהקשר לשיחה עם עזרה מ-AI. הפניה לפעילות הזו מופיעה בפינה הימנית התחתונה של החלונית.
תובנות לגבי הביצועים
אם לחצתם על Ask AI (שאלת AI) כדי לקבל תובנה ספציפית לגבי הביצועים, התובנה הזו תוצג כהקשר שנבחר. כדי לשנות את הבחירה, לוחצים על שאלת שאלות ל-AI בקטע 'תובנות אחרות'.
אחרי שמתחילים שיחה, מרחיבים את הקטע Analyzing insight: ... כדי לראות את הנתונים הגולמיים שמשמשים את העזרה מ-AI.
תצוגת מעקב
אפשר לבחור פריטים שונים בנתוני מעקב הביצועים, וההקשר ישתנה בהתאם.
העזרה מ-AI משתמשת בתזמונים מעץ השיחות שנבחר כדי לענות על ההנחיה.
אחרי שמתחילים שיחה, לוחצים על הכפתור
בצ'יפ Analyzing call tree כדי לראות את הנתונים הגולמיים שבהם נעשה שימוש בעזרה מ-AI.
עזרה מ-AI לגבי מקורות
אפשר להשתמש בחלונית עזרה מ-AI למקורות כדי להבין אילו קבצים נטענים ומשמשים באתר.
פתיחת חלונית העזרה מבוססת-AI מהחלונית 'מקורות'
כדי לפתוח את העזרה מ-AI מתוך החלונית 'מקורות', לוחצים לחיצה ימנית על קובץ ובוחרים באפשרות שאלת AI.
כשפותחים את העזרה מ-AI בדרך הזו, הקובץ שנבחר מסומן מראש כהקשר לשיחה.
אפשר גם להעביר את העכבר מעל קובץ וללחוץ על הכפתור הצף.
הקשר השיחה
הקובץ שנבחר משמש כהקשר לשיחה עם עזרה מ-AI. הפניה לקובץ הזה מוצגת בפינה הימנית התחתונה של החלונית.
כדי לשנות את ההקשר, לוחצים על קובץ אחר בחלונית Sources (מקורות).
העזרה מ-AI משתמשת בשם הקובץ שנבחר, בכתובת ה-URL, במפת המקור (אם זמינה) ובתוכן כדי לענות על השאלות שלכם.
אחרי שמתחילים שיחה, לוחצים על הלחצן בצ'יפ Analyzing file כדי לראות את הנתונים הגולמיים שבהם נעשה שימוש בעזרה מ-AI.
מהלך השיחה
שליחת הנחיה מתחילה את השיחה עם סוכן העיצוב. כדי לקבל את המידע שנדרש כדי לתת את התשובה הכי טובה להנחיה שלכם, הסוכן יוצר ומריץ JavaScript שמפעיל ממשקי API של אתרים. ההתקדמות של הנציג מוצגת בשלבים. סטטוס השלב הראשוני הוא Investigating….
התווית של השלב מתעדכנת כשהנציג מבצע פעולות ספציפיות יותר כדי לענות על השאלה.
כשהסוכן מגיע לתשובה סופית, התשובה מוצגת מתחת לשלבי הבדיקה, כולל הצעות להנחיות המשך.
כדי להמשיך את השיחה, לוחצים על אחת מההצעות לבקשות. לוחצים על
של שלב בחקירה כדי להבין טוב יותר מה עזרה ה-AI לעשות מאחורי הקלעים.
כשמרחיבים את צ'יפ ההתקדמות, רואים את הקוד שהסוכן ביצע, יחד עם ערך ההחזרה שלו. מעתיקים את הקוד שהופעל לשימוש נוסף, למשל להפעלה באמצעות החלונית Console.
שיחות מושהות
עזרה מבוססת-AI עשויה ליצור קוד עם תופעות לוואי. במקרה כזה, השיחה מושהית לפני שהקוד מופעל.
כשהשיחה מושהית, בודקים את הקוד שהנציג הציע. לוחצים על המשך כדי להמשיך או על ביטול כדי למנוע את ההפעלה.
שמירת השינויים בסביבת העבודה
בעזרת תיקייה מקושרת בסביבת העבודה, אתם יכולים לשמור שינויים בסגנון שהוצעו על ידי כלים מבוססי-AI בחזרה לקובצי המקור של CSS במחשב.
לשם כך:
קודם צריך ליצור קובץ מטא-נתונים ולקשר תיקייה ב-Workspace.
אפשר גם להוסיף תיקייה באופן ידני.
מתחילים צ'אט מהחלונית Elements.
מבקשים מעזרה מבוססת-AI לשנות את ה-CSS.
עזרה מבוססת-AI עשויה ליצור קוד ולהשהות את ההרצה. בודקים את הקוד ולוחצים על המשך כדי לבדוק את השינויים באתר הפעיל.
מרחיבים את הקטע שינויים שלא נשמרו ולוחצים על החלה על סביבת העבודה.
בודקים את השינויים ב
diffולוחצים על שמירת הכל.
כדי להבין את תהליך העבודה הזה, אפשר לעיין במאמרים הבאים:
לא ניתנה תשובה
יכולות להיות סיבות שונות לכך שעזרה מ-AI לא מספקת תשובות.
אם לדעתכם ההנחיה שלכם היא משהו שהעזרה מ-AI צריכה להיות מסוגלת לדון בו, אתם יכולים לדווח על באג.
היסטוריית השיחה
אחרי שמתחילים שיחה, כל תשובה שמתקבלת בהמשך מבוססת על האינטראקציות הקודמות ביניכם לבין ה-AI.
העזרה מבוססת-AI שומרת את היסטוריית השיחות בין סשנים, כך שתוכלו לגשת לצ'אטים הקודמים גם אחרי טעינה מחדש של כלי הפיתוח או של Chrome.
משתמשים באמצעי הבקרה בפינה הימנית העליונה של החלונית כדי לשלוט בהיסטוריית השיחות.
התחלת מדידה חדשה
כדי להתחיל שיחה חדשה עם ההקשר של השיחה שנבחרה כרגע, לוחצים על הכפתור .
המשך
כדי להמשיך שיחה קודמת, לוחצים על לחצן ובוחרים אותה מהתפריט.
מחיקה
כדי למחוק שיחה מההיסטוריה, לוחצים על לחצן .
דירוג תשובות ומתן משוב
עזרה מבוססת-AI היא תכונה ניסיונית. לכן אנחנו מחפשים באופן פעיל משוב כדי ללמוד איך לשפר את איכות התשובות ואת החוויה הכוללת.
הצבעה לתשובות
כדי לדרג תשובה, לוחצים על הלחצנים אהבתי ו- לא אהבתי שמתחת לתשובה.
דיווח על תשובות
כדי לדווח על תוכן בלתי הולם, לוחצים על לחצן לצד לחצני ההצבעה.