סיוע מבוסס-AI

כאן תוכלו לקרוא על תרחישים לדוגמה לשימוש בתכונות של AI Assistance ב-Chrome DevTools, ולגלות איך הן יכולות לתמוך בתהליך ניפוי הבאגים בכל הנוגע לעיצוב, לביצועים ועוד.

קריאת מסמכים

… לעיצוב

תוכלו לקבל הסבר מפורט על הפריסה של הרכיב ואיך לשנות אותה באמצעות הנחיות כמו זו:

How is this element laid out?

האם מדובר בפריט גמישות? האם הוא ממוקם באופן מוחלט? האם הוא חלק מרשת? בעזרת AI אפשר לסכם את הפריסה של עצי הרכיבים ולספק דוגמאות קוד כדי להדגים איך לשנות אותה.

יש לכם אנימציה שלא פועלת? אפשר לבקש עזרה מ-AI לגבי הרכיב האנימציה:

Why is my animation not working?

התכונה 'עזרה מבוססת-AI' תבדוק מאפייני CSS רלוונטיים, פונקציות מעקב אירועים ועוד כדי לברר מה הבעיה ולספק דוגמאות לקוד לתיקון.

DEMO

אין לכם פרויקט זמין לבדיקה של התכונה 'סיוע מבוסס-AI לעיצוב'? כדאי לנסות את התכונה הזו ב-DevTools Hangar.

איך מוצאים את ההנחיות הנכונות לתיקון גלגלים מלבניים, נוריות מיקום שבורות ומנוע שמפיק עשן כדי שהמטוס של DevTools יוכל שוב לעוף?

הדגמה של

… עבור רשת

לרוב, כותרות הבקשה והתגובה מכילות מידע חשוב שלא ברור במבט מהיר. אתם יכולים לבקש מהסיוע של ה-AI להסביר אותם: 

Does this request have any notable headers?

האם אי פעם הרגשת שהטיפול בבקשה מסוימת נמשך יותר מדי זמן, אבל לא הבנת למה? אפשר לבקש מ-AI Assistant לבדוק את הנושא בשבילכם:

Why is this request taking so long?

בעזרת ה-AI, המערכת תבדוק את הזמנים שתועדו ותודיע לכם אם יש בעיה.

… לביצועים

לפעמים קשה למצוא את שורש הבעיה של אתר איטי. לא מצליחים להבין את הגורמים לעליות חדות בנתוני הביצועים? בעזרת AI תוכלו לצמצם את עצי השיחות:

Anything to improve in this call tree?

… למקורות

בדרך כלל לא כותבים את כל הקוד שבו האתר משתמש. לא מבינים למה משאב מסוים נטען ומה הוא משמש? כלים מבוססי-AI יכולים לעזור:

What is this file used for?

לא משנה אם מדובר בסקריפט לניתוח נתונים, בווידג'ט חברתי או בספרייה לבדיקות A/B – התמיכה של AI תבדוק לעומק ותגלה.