תקציר של DevTools – רצועת סרט ובית חדש לויסות נתונים

פול באקאס
פול באקאוס

החדשות העדכניות ביותר של כלי הפיתוח

הידיעה החדשותית הראשונה בפוסט הזה היא חלק קטן מהמטא – זה העדכון הזה בעצמו! מדי פעם, אבל לפחות פעם בחודש, אסכם את מה שקורה בעולם של כלי הפיתוח ל-Chrome בעיתונות.

ואם אני אומר 'רענן', אני מתכוון לכך: אני אדבר על תכונות חדשות שצו לאחרונה ב-Chrome Canary, כך שאם אתם מעדיפים להישאר בסביבה יציבה, זה גם בסדר. אם אתם הרפתקנים ורוצים להישאר בעניינים, הפוסטים האלה מיועדים לכם. בנוסף לתכונות ותיקוני הבאגים האחרונים, בסוף כל פוסט יופיע קטע בשם פעימת הלב של הקהילה, שבו מודגשים האנשים הטובים ביותר שאתם, המשתמשים האהובים שלנו, תרמתם.

בואו נצלול לעניין החדשות האמיתיות, בלי הקדשות נוספות.


חדש בכלי הפיתוח

צילומי מסך דמויי רצועת תמונות ברשת ובציר הזמן

רק לפני שבוע העברנו ניסוי חדש של תכונה חשובה: היכולת לצלם צילומי מסך של הדף בכרטיסייה 'רשת' ו'ציר זמן'.

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

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

בחלונית ציר הזמן, אפשר להפעיל צילום מסך על ידי סימון התיבה 'צילומי מסך' בסרגל הכלים העליון. כאן אופן הפעולה שונה מעט, בהשוואה לחלונית 'רשת': במקרה זה, אנחנו מנסים לצלם בתדירות גבוהה ככל האפשר – ללא קשר לכמות הצבעים בפועל – כדי לשחרר את צילומי המסך האלה בטווח זמן לינארי שתואם לשורות האחרות בציר הזמן. במקום ללחוץ פעמיים כדי להציג תצוגה מקדימה, המסגרות המוגדלות מופיעות כשמעבירים את העכבר מעליהן.

מכיוון ששני סוגי התכונות לא מסונכרנים מבחינת הפונקציונליות והחוויית המשתמש, אנחנו ממליצים לנסות את התכונות ולשלוח לנו משוב על הפיצ'ר בכתובת crbug.com/new או דרך ציוץ אל @ChromeDevTools.

הגבלת רוחב פס בחלונית 'רשת'

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

הגבלת רוחב פס בפעולה

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

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

פרטים שונים


פעימת הלב של הקהילה

מלוכלך או מלוכלך עם כלי הפיתוח ל-Chrome

הגבלת רוחב פס בפעולה

Bret Little פרסמה קורס הדרכה קצר ונחמד שמכיר את הפונקציונליות הבסיסית של כלי הפיתוח, אבל כולל הרבה טיפים וטריקים מעמיקים. שם בהחלט מידע שימושי, ומסמכים נוספים של כלי פיתוח אף פעם לא מזיקים!

סביבת פיתוח משולבת (IDE) של כלי פיתוח...?

קנת אוכנברג, מפתח אתרים וחובב כלי פיתוח, פיתח לפני כמה חודשים אפליקציה עצמאית להוכחת קונספט של DevTools, ואיכשהו פוסט בבלוג שלו שפרסם שוב השבוע חדשות (האקר).

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


מה דעתך? האם סביבת הפיתוח המשולבת של כלי הפיתוח (IDE) היא חלום או שאתם יכולים לנסות לפתור את הבעיה? איך הוא אמור להיראות? ספרו לנו על זה בתגובות!

נתראה בקרוב!
פול באקאוס וצוות כלי הפיתוח