אינטרנט ישראל
  • ראשי
  • אודות רן בר-זיק ואינטרנט ישראל
  • ערוץ טלגרם
  • מסטודון
  • התחברו אלי בטוויטר
  • התחברו אלי בלינקדאין
  • ספר ג'אווהסקריפט
  • ראשי
  • אודות רן בר-זיק ואינטרנט ישראל
  • ערוץ טלגרם
  • מסטודון
  • התחברו אלי בטוויטר
  • התחברו אלי בלינקדאין
  • ספר ג'אווהסקריפט
ראשי » פיתוח אינטרנט » פתרונות ומאמרים על פיתוח אינטרנט » העולם המופלא של לשונית הנטוורק

העולם המופלא של לשונית הנטוורק

רן בר-זיק יוני 2, 2019 9:17 am 2 תגובות

כמה תוספות מעניינות ללשונית ה-network של כלי המפתחים של כרום שיש סיכוי שאתם לא מכירים

כדאי תמיד להשאר מעודכנים! אם יש לכם טלגרם, בדקו את ערוץ הטלגרם של האתר שבו אני מעדכן על פוסטים חדשים 🙂 אם אתם רוצים ללמוד תכנות באופן מקיף ומסודר, הצטרפו לאלפי הלומדים בפרויקט "ללמוד ג'אווהסקריפט בעברית" שמלמד לתכנת בג'אווהסקריפט, ב-Node.js ובריאקט וגם מלמד על תרומה לקוד פתוח. גם ספרים דיגיטליים וגם ספרים מודפסים. בשיתוף הקריה האקדמית אונו ובתמיכת חברות מובילות כגון Wix, Outbrain, Elementor, Iron Source, Chegg, Really Good ועוד.

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

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

למנוע טעינה של משאבים

זה שימושי מאוד אם למשל אתם מפתחים תוסף צד שלישי במחשב שלכם ולא רוצים שהתוסף של הפרודקשן ייטען. או אם אתם רוצים לחסום בקשת XHR כדי לראות איך הסקריפט שלכם מטפל בתקלות או כל בעיה אחרת. לחיצה על Block request URL תחסום את הבקשה הזו בכל ריפרש מעכשיו ועד עולם.

לחיצה על כפתור ימני על הבקשה ובחירה ב-Block request URL תחסום את הבקשה לתמיד.
לחיצה על כפתור ימני על הבקשה ובחירה ב-Block request URL תחסום את הבקשה לתמיד.

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

לשונית הבקשות החסומות.
לשונית הבקשות החסומות.

לקבוע מהירות אינטרנט

אם יש לכם לקוחות במדינת עולם שלישי (כמו למשל לקוחות פרטנר בישראל שעובדים עם 3G כל הזמן כמו בימי הביניים) ואתם רוצים לראות איך האתר עובד בשבילם – אפשר לקבוע את מהירות האינטרנט באמצעות Throttling. לחיצה על No Throttling תראה לכם תפריט שבו אפשר לקבוע את מהירות החיבור. ריפרוש יגרום לכם להרגיש כמו לקוחות אורנג' מייד.

No Throttling
No Throttling

Disable cache

אין דבר שאנחנו אוהבים יותר מ-cache בפיתוח. אם אנו רוצים להמנע מזה – יש לנו אפשרות ללחוץ על disable cache וייגמרו ימי ctrl + F5 או command + F5.

Disable cache + Offline
Disable cache + Offline

ממש ליד יש לחצן שמאפשר לכם לדמות offline – שזה סופר שימושי לאפליקציות שאמורות לעבוד גם באופליין.

יריה מחדש של בקשת XHR

אם יש לכם בקשות AJAX שאתם רוצים לירות מחדש – כפתור ימני ובחירה ב'replay' – הבקשה נשלחת בדיוק כפי שהיא. מאוד שימושי לדיבאגינג.

לחיצה ימנית על בקשת Replay XHR

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

כדאי תמיד להשאר מעודכנים! אם יש לכם טלגרם, בדקו את ערוץ הטלגרם של האתר שבו אני מעדכן על פוסטים חדשים 🙂 אם אתם רוצים ללמוד תכנות באופן מקיף ומסודר, הצטרפו לאלפי הלומדים בפרויקט "ללמוד ג'אווהסקריפט בעברית" שמלמד לתכנת בג'אווהסקריפט, ב-Node.js ובריאקט וגם מלמד על תרומה לקוד פתוח. גם ספרים דיגיטליים וגם ספרים מודפסים. בשיתוף הקריה האקדמית אונו ובתמיכת חברות מובילות כגון Wix, Outbrain, Elementor, Iron Source, Chegg, Really Good ועוד.
כלים למפתחים

2 תגובות

  1. עומר הגב יוני 2, 2019 בשעה 9:39 am

    Copy as fetch
    מאפשר את להעתיק את הקריאה כפונקציית javascript שניתן להריץ בלולאה ולשנות את הפרמטרים שלה

  2. אורן הגב יוני 2, 2019 בשעה 12:16 pm

    זה גם נחמד מאוד.
    באופן כללי כל ה dev tools זה כיף גדול.
    https://developers.google.com/web/tools/chrome-devtools/device-mode/geolocation

השארת תגובה

ביטול

ללמוד ג'אווהסקריפט בעברית

ללמוד לתכנת ג'אווהסקריפט בעברית שגייס יותר משלוש מאות אלף שקל ולמעלה מ-2000 תומכים - בואו ללמוד עכשיו איך לתכנת.

רשימת הנושאים
  • מדריכים
    • ריאקט
    • טייפסקריפט
    • ECMAScript 6
    • ES20XX
    • Node.js
    • Express
    • רספברי פיי
    • Babel
    • docker
    • MongoDB
    • Git
    • לימוד MySQL
    • SASS
    • jQuery
    • CSS3
    • HTML 5
    • SVN
    • LESS
  • פיתוח אינטרנט
    • פתרונות ומאמרים על פיתוח אינטרנט
    • jQuery Scripts
    • jQuery למתקדמים
    • יסודות בתכנות
    • נגישות אינטרנט
  • חדשות אינטרנט
  • מידע כללי על אינטרנט
    • רשת האינטרנט
    • בניית אתרי אינטרנט
  • rss logo

    לכל המאמרים

    לכל המאמרים שפורסמו באינטרנט ישראל משנת 2008 ועד עכשיו.
  • rss logo

    RSS Feed

    משתמשים בקורא RSS? אם כן, עקבו אחרי אינטרנט ישראל באמצעות פיד ה-RSS!
    מה זה RSS?
  • Twitter logo

    עקבו אחרי בטוויטר

    בחשבון הטוויטר שלי אני מפרסם עדכונים מהירים על חדשות בתחום התכנות והיזמות, התרעות על מצבי חירום ורכילות בוערת על תחום הווב.
    מה זה טוויטר?
  • facebook like image

    ערוץ הטלגרם של אינטרנט ישראל

    בערוץ הטלגרם של אינטרנט ישראל אני מפרסם את הפוסטים של באתר וכן עדכונים טכנולוגיים נוספים.
    מה זה טלגרם?
  • github logo

    הפרויקטים שלי בגיטהאב

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

כל הזכויות שמורות לרן בר-זיק ולאינטרנט ישראל | מדיניות הפרטיות של אתר אינטרנט ישראל | אתר אינטרנט ישראל נגיש לפי תקן WCAG 2.0 AA | הצהרת הנגישות של האתר | אבטחת מידע ודיווח על בעיית אבטחת מידע

גלילה לראש העמוד