כיצד לבצע פחות בקשות HTTP ב- WordPress ו- GTmetrix YSlow

03.06.2020
ปลั๊กอินแคช 'כיצד לבצע פחות בקשות HTTP ב- WordPress ו- GTmetrix YSlow
0 42 мин.

צריך לבצע פחות בקשות HTTP באתר וורדפרס שלך?


פירוש הדבר רק שעליך לצמצם את מספר האלמנטים (הבקשות) העומסים באתר שלך.

בצע פחות בקשות HTTP

שילוב קבצי CSS ו- JavaScript יכול לעזור, אך ישנם אופטימיזציות אחרות שיכולות להפחית בקשות HTTP, כמו השבתה של סלקציות של תוספים שלא צריכים להיטען בדפים ספציפיים, השבתת סקריפטים וסגנונות WooCommerce בדפים שאינם מסחר אלקטרוני או הימנעות מעבד גבוה תוספים שמייצרים מספר גבוה של בקשות ומאטים את האתר שלך.

ביצוע פחות בקשות HTTP היא המלצה בכלי GTmetrix, Pingdom, וכלים אחרים לבדיקת מהירות. ההמלצות שלהלן יעזרו להפחית בקשות ולהפוך את האתר שלכם למהיר יותר.

1. שלב גיליונות סגנונות CSS + JavaScript

שילוב גיליונות סגנונות CSS + JavaScript פירושו שאתה צריך להעתיק / להדביק את כל מה שקובצי CSS שלך לקובץ יחיד. זה מאפשר לדפדפנים לבקש בקשה אחת יחידה לקובץ CSS במקום בקשות מרובות. לרוב תוספי המטמון יש אפשרות לשלב את קבצי ה- CSS + JavaScript שלך.

שלב 1: בהגדרות תוסף המטמון שלך, מצא את האפשרות לשלב ולהמעיט CSS + JavaScript.

שלב 2: אפשר כל הגדרה אחת בכל פעם ואת תוצאות הבדיקה ב- GTmetrix.

צמצם שילוב קבצי CSS

צמצם שילוב קבצי JavaScript

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

לחלופין, תוכלו לשלב ידנית את קבצי ה- CSS בוורדפרס תחת מראה > עורך נושאים. תוכלו פשוט להעתיק ולהדביק את התוכן בכל הקבצים לקובץ CSS יחיד.

קבצי CSS של וורדפרס

2. השבתת תוספים באופן סלקטיבי

תוספים רבים רצים בכל האתר שלך, אפילו בדפים שבהם הם אינם נחוצים.

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

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

שלב 1התקן ניקוי נכסים או פרפמטרים (שתיהן מאפשרות לך להשבית את התוספים באופן סלקטיבי).

שלב 2: ערוך עמוד או פוסט, גלול למטה לקטע ניקוי נכסים ובדוק אילו קבצי CSS + JavaScript טוענים בדף. אלה יכולים להיות מתוספים, ערכות נושא או סקריפטים חיצוניים.

השבת סקריפטים חיצוניים של וורדפרס

שלב 3: השבת את כל התוספים והבקשות שאינך צריך בדף זה. אתה יכול להשבית אותם בעמוד אחד, בכל האתר שלך, לפי סוג הודעה, או להשתמש ב- RegEx (ביטויים רגילים) כדי להשבית אותם על דפוסי URL ספציפיים.. RegEx כלול רק עם Perfmatters או Asset CleanUp Pro.

3. השבת תסריטים, סגנונות, שברי עגלה של WooCommerce

אתרי WooCommerce מייצרים באופן טבעי יותר בקשות HTTP.

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

באמצעות CleanUp או Perfmatters של נכסים, השבת אותם בדפים שבהם הם לא צריכים לטעון:

ניקוי נכסים WooCommerce

לחלופין, Perfmatters מאפשרת לך להשבית את אלה בלחיצה אחת:

מיטוב אופטימיזציה של ווה-מסחר

4. הימנע מתוספי מעבד גבוהים

תוספי מעבד גבוהים יכולים לייצר המון בקשות HTTP.

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

שלב 1: בדוק אם ישנם תוספים איטיים במפל GTmetrix או מוניטור שאילתה.

איטי וורדפרס-תוסף

שלב 2: הימנע מתוספי CPU גבוהה ידועים.

  1. הוסף זאת
  2. ניטור הונאות של קליקים של AdSense
  3. לוח אירועים של כל אחד
  4. גיבוי באדי
  5. בונה בונה
  6. מפות WordML של גוגל XML טובות יותר
  7. בודק קישור שבור (השתמש בדק קישור של ד”ר)
  8. קשר קבוע עבור וורדפרס
  9. טופס יצירת קשר 7
  10. הצג את כל 65 התוספים האיטיים

שלב 3: החלף תוספים איטיים בתוספים מהירים וקלים יותר. יש צורך במחקר ובדיקה.

5. החלף תוספים בקוד

אתה יכול להימנע מתוספים רבים על ידי החלפתם בקוד.

דוגמאות:

  • גופנים של גוגל: מארחים את הגופנים באופן מקומי
  • קוד מעקב של Google Analytics: הוסף ידנית
  • תוכן עניינים: תכנן אותו באופן ידני ב- HTML + CSS
  • ציוצים משובצים או מפות Google: קח במקום זאת צילום מסך
  • יישומון פייסבוק משובץ: החלף באמצעות יישומון פייסבוק בפועל

איחוד תוספים גם עוזר. דוגמה אחת קלאסית היא שימוש ב- WP Rocket שמגיע עם אירוח גופנים, אנליטיקס ופייסבוק פיקסל באופן מקומי, טעינת תמונות + קטעי וידאו עצלנים, ניקוי בסיסי נתונים, טעינה מוקדמת, בקרת פעימות לב ושילוב של Cloudflare ומספר CDN מרובים. עם יישומי פלאגין אחרים למטמון (מכיוון שלרובם אין את התכונות האלו), יהיה עליכם להתקין 6-7 תוספים נוספים בכדי לקבל אופטימיזציות מהירות אלו, כאשר הם מובנים ב- WP Rocket..

6. ביטול סקריפטים חיצוניים

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

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

  • גופנים של גוגל: לשלב גופנים ולארח אותם באופן מקומי באמצעות תוספים כמו WP Rocket, אוטומציה אוטומטית, OMGF, גופני מארח עצמי של Google וניקוי נכסים..
  • גוגל ניתוח נתונים: קוד מעקב מארח באופן מקומי ב- WP Rocket / CAOS Analytics.
  • גוגל אדסנס: טען באופן אסינכרוני ונסה את Loader Rocket Loader.
  • גוגל מפות: צלם תמונה ממפה של Google וכולל קישור להוראות נסיעה כאשר אנשים לוחצים על התמונה (זה נראה טוב כמו מפה)!
  • מנהל התגים של גוגל: בדרך כלל עושה יותר נזק מתועלת כאשר מנסים לשלב מספר סקריפטים. יש להשתמש רק באתרים גדולים ובלתי ממומנים.
  • סרטונים משובצים: השתמש ב- WP Rocket או ב- WP YouTube Lyte כדי לטעון קטעי וידאו ולהחליף את iframe בתמונת תצוגה מקדימה (סרטונים הם אלמנט כבד מאוד).
  • יישומונים משובצים + פוסטים: צלם צילומי מסך במקום להטמיע אותם.
  • פיקסל בפייסבוק: WP Rocket יכול להוסיף מטמון דפדפן לפיקסלים בפייסבוק.
  • Gravatars: שום דבר לא עבד בשבילי מלבד השבתת Gravatars (WP Rocket גם לא משתמש בהם בבלוג שלהם). אבל, אתה יכול לנסות את הארי, FV או את מטמון Gravatar האופטימלי, או לנסות לשבור או להסתיר הערות הניתנות להרחבה.
  • תוספים לשיתוף חברתי: לייצר לשמצה בקשות מפייסבוק, טוויטר ורשתות חברתיות לרענון כמו ספירות. נסה תוסף מהיר יותר כמו פאג חברתי, Mashsharer, הצמד חברתיAddToAny, שיתוף חברתי WP, או נתח חברתי קל

7. שלב גופנים של גוגל

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

Google-Fonts-GTmetrix

לתוספים הבאים אפשרויות למיטוב גופני גוגל:

  • רקטת WP
  • ניקוי נכסים
  • אוטומציה אוטומטית
  • OMGF

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

Transfonter-Google-Font-Conversion

7. צמצם HTML, CSS, JavaScript

צמצום קבצים מתבצע בדרך כלל על ידי תוסף המטמון שלך (ראה שלב 1).

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

8. אופטימיזציה למסירת CSS

זה אמור לתקן את משאבים חסימת עיבוד פריט בתובנות PageSpeed.

ל- WP Rocket, Autotimize ותוספים דומים אחרים צריכים להיות אפשרות לייעל את מסירת CSS. פשוט היכנס להגדרות שלך וודא שהפעלת את זה, והיא צריכה לתקן את זה.

בצע אופטימיזציה למסירת CSS

9. דחה / טען קבצי JavaScript משולבים בצורה אסינכרונית

JavaScript אסינכרוני פירושו טעינת הקבצים לאחר הדף סיים את ההורדה.

ניתן לעשות זאת באמצעות WP Rocket או Async JavaScript וצריך לתקן את הסר פריט Javascript החוסם render. Async JavaScript מעניק לך שליטה מלאה על הסקריפטים להוסיף תכונה ‘אסינכרון’ או ‘דחייה’, בעוד WP Rocket מגנה על JavaScript באופן אוטומטי בלחיצה אחת.

קבצי JavaScript

10. סרטי טעינה עצלנים

סרטונים משובצים הם משאבים חיצוניים המייצרים בקשות HTTP.

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

יש לכם כאן כמה אפשרויות: תוכלו להשתמש ב- WP Rocket כדי לאפשר טעינה עצלה ולהחליף את iframe YouTube בתמונת התצוגה המקדימה. אבל אם אין לך WP Rocket, אתה יכול לנסות את ה- תוסף WP YouTube Lyte או עקוב אחר זה הדרכה על הטבעות YouTube קלות. שניהם עובדים טוב.

הנה דוגמה (וסרטון נהדר בנושא WordPress Speed):

11. הוסף CDN

CDNs יכולים לעזור לבצע פחות בקשות HTTP.

במקום לגרום לשרת המקור שלך להיענות לבקשה, מרכזי הנתונים של CDN יעלו את רוחב הפס תוך הקלת העומס בשרת המקור. Cloudflare הוא בחינם, כך שזה לא מבשר.

CDN מרובים = יותר מרכזי נתונים = מסירת תוכן מהירה יותר ויותר עומס על משאבים. אנשים רבים מתחילים עם Cloudflare ואז בסופו של דבר בודקים StackPath בעת שימוש במספר CDNs (כרגע אני משתמש בשניהם). KeyCDN הוא גם טוב. זה נקרא “שרשרת” של CDNs.

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

CDN מרובים

12. צמצם הפניות מחדש

הפניות מחדש לא נחוצות עלולות לגרום לבקשות HTTP נוספות.

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

צמצם שגיאות ניתוב מחדש

סיבות שכיחות

  • תוספים רעים
  • סקריפטים חיצוניים
  • השתנה ל- WWW לעומת Non-WWW אך לא עדכנו קישורים
  • שונה ל- HTTPS לעומת שאינם HTTPS אך לא עדכנו קישורים

13. אופטימיזציה של תמונות

כדי להפחית בקשות HTTP הנגרמות על ידי תמונות, ישנן שלוש דרכים עיקריות לייעל את התמונות:

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

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

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

עדיין צריך לבצע פחות בקשות HTTP?

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

וורדפרס מזרז את קבוצת הפייסבוק

שאלות נפוצות

&# x1f680; מה גורם לבקשות HTTP?

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

&# x1f680; מהם 5 דברים שתוכלו להפחית בקשות HTTP?

5 דברים פשוטים שאתה יכול לעשות זה לשלב קבצי CSS + JavaScript, לטעון תמונות וסרטוני וידאו עצלנים, להימנע מרשימת התוספים הגבוהים למעבד, להשבית סלקטיבי תוספים מדפים / פוסטים מסוימים עם Perfmatters או Asset CleanUp, ולבצע אופטימיזציה של הגופנים שלך.

&# x1f680; האם תוסף מטמון יעזור בהפחתת בקשות HTTP?

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

&# x1f680; האם תיקון פריטי GTmetrix אחרים יפחית את בקשות HTTP?

כן, במקרים רבים זה במיוחד יעשה צמצום ושילוב קבצים, ביטול שגיאות ניתוב מחדש ושימוש ב- CDN יכול גם לעזור.

&# x1f680; איזה תוסף זיכרון מטמון מצמצם את בקשות HTTP ביותר ואיך להגדיר אותו?

אני ממליץ על WP Rocket שדורג מספר 1 ברוב הסקרים בפייסבוק ובו תכונות אופטימיזציה מהירות יותר מרוב תוספי המטמון, וזו הסיבה שבדרך כלל היא מניבה ציונים וזמני טעינה טובים יותר ב- GTmetrix. עיין במדריך שלי לתצורה של הגדרות WP Rocket.

תודה שקראתם 🙂

לחיים,
טום

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Понравилась статья?
    Комментарии (0)
    Комментариев нет, будьте первым кто его оставит

    Комментарии закрыты.

    Adblock
    detector