המדריך המלא לתוסף הקאש WP Rocket

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

מהירות טעינת האתר שלכם היא היום אחד הפרמטרים החשובים לשיפור ההמרות אתר שלכם, לא גוגל ולא הגולשים אוהבים אתרים איטיים וכבדים שלוקח להם המון זמן להיטען. 40% מהגולשים נוטשים אתרים שלוקח להם יותר מ-3 שניות להטען! 

לצד שימוש ב-CDN של Cloudflare, אחד הדברים החשובים והמומלצים שאתם יכולים להשתמש בהם כדי לשפר את מהירות האתר, הוא תוסף WP Rocket לוורדפרס.

ל-Cloudways יש תוסף מטמון חינמי בשם Breeze שמותאם לפלטפורמה שלה, אך הביצועים שלו פחות טובים משל WP Rocket.

מה זה זכרון מטמון?

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

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

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

התקנת התוסף WP Rocket

שלב 1: הורדת תוסף WP Rocket

היכנסו לאתר WP Rocket ובחרו את התוכנית המתאימה לכם. מלאו את הטופס והורידו את קובץ ה-zip למחשב שלכם

שלב 2: היכנסו לממשק הניהול של וורדפרס

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

כניסה ממשק הניהול של וורדפרס

שלב 3: הסירו תוספי מטמון אחרים

עליכם למחוק תוספי מטמון אחרים שיש לכם (W3 Total Cache מותקן כברירת מחדל ב-Cloudways) באתר הוורדפרס כדי למנוע התנגשויות.

שלב 4: התקנת WP Rocket

בטאב Add Plugins, לחץ על האפשרות Upload Plugin. לאחר מכן בחרו את הקובץ הרלוונטי כדי לעלות את הקובץ zip של WP Rocket שהורדתם ולחצו על Install Now

התקנת WP Rocket

לאחר ההתקנה, הפעילו את התוסף מחלק Installed Plugins. הפעלת הרישיון תחל כשתפעילו את התוסף ולכן אין צורך להזין מפתח API.

מה WP Rocket עושה?

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

  • שמירה של גרסת קאש לכל דף באתר
  • עדכון אוטומטי של תכנים חדשים ושינויים – כדי שתמיד תישמר הגרסה העדכנית בזכרון המטמון
  • הפעלת אפשרות שימוש בזיכרון מטמון פנימי של הדפדפן ממנו הגולש מגיע
  • עיכוב פריסת קבצי ג'אווה-סקריפט
  • ביצוע כיווץ ואיחוד של אלמנטים ב-CSS וג'אווה-סקריפט כדי לשפר זמני טעינה והצגה
  • שיפור וייעול התפקוד של פונטים של גוגל
  • עיכוב מכוון להצגת קבצי התמונה בדף הנטען (LazyLoad)
  • הפעלת דחיסה של המידע מהאתר לגולש (GZIP)

הגדרת התוסף WP Rocket

לוח הבקרה של התוסף

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

  • נקה זכרון מטמון (Clear Cache): מחיקה של כל הנתונים שהתוסף שמר בזיכרון הקאש שלו לגבי האתר שלכם.
  • טען זיכרון מטמון מראש (Preload Cache): טעינה מקדימה של כל או חלק מזיכרון המטמון של האתר שלכם
לוח הבקרה של התוסף

תפריט ה-Cache

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

Mobile Cache – מאפשר שמירת זיכרון מטמון למכשירי מובייל, מומלץ להפעיל. אם ההגדרה של "Separate cache files for mobile devices" מסומנת, התוסף ישמור קאש מיוחד למכשירי מובייל, שונה מהקובץ למשתמשים המגיעים מחשבים או טאבלטים. זה בעיקר רלוונטי לאתרים המציגים תוכן שונה או עם הגדרות תצוגה שונות למשתמשי מובייל.

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

Mobile Cache

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

Cache Lifespan

אופטימיזציית קבצים – File Optimization

כאן נמצאות הגדרות הקשורות לאופטימיזציה של קבצי Java Script וקבצי CSS. חשוב לבצע בדיקה ויזואלית של האתר בשביל לראות שהתצוגה של האתר לא נפגעה.

קבצי CSS

כווץ קבצי CSS – התוסף מוריד את המשקל של קבצי ה-CSS על ידי הורדת רווחים והערות בקבצים (חובה לבדוק את האתר לאחר הפעלת האפשרות הזו). מומלץ להפעיל.

Combine CSS files – התוסף מאחד את כל קבצי ה-CSS לקובץ אחד, מה שמוריד את הקריאות לשרת ומשפר משמעותית את המהירות של האתר (חובה לבדוק את האתר לאחר הפעלת האפשרות הזו). מומלץ להפעיל.

Excluded CSS Files – אם יש בעיות תצוגה באתר לאחר שאיחדתם את קבצי ה-CSS, צריך למצוא איזה קובץ CSS גורם לכך, הפתרון הוא להכניס רשימה של כל קבצי ה-CSS לכאן אחד אחד, עד שתמצאו את הקובץ שעושה את הבעיות תצוגה ורק אותו תשאירו והוא לא יכנס לקובץ המאוחד

קבצי CSS

קבצי Java Script

Minify JavaScript Files – התוסף מוריד את המשקל של קבצי ה-Java Script על ידי הורדת רווחים והערות בקבצים (חובה לבדוק את האתר לאחר הפעלת האפשרות הזו). מומלץ להפעיל.

Combine JavaScript files – התוסף מאחד את כל קבצי ה-Java Script לקובץ אחד, מה שמוריד את הקריאות לשרת ומשפר משמעותית את המהירות של האתר (חובה לבדוק את האתר לאחר הפעלת האפשרות הזו). מומלץ להפעיל.

Excluded Inline JavaScript – אם יש בעיות תצוגה באתר לאחר שאיחדתם את קבצי ה-Java Script, צריך למצוא איזה קובץ Java Script גורם לכך, יכול להיות שהבעיה היא ב-Java Script שנמצא בתוך קבצי האתר, כדי להוציא את כל קבצי ה-JS שכתובים בקבצי האתר הכניסו לתיבה הזו את הסימנים הבאים: ";" , ",", "=". במידה וזה לא פותר את הבעיות תצוגה, כנראה שהבעיה באחד מקבצי ה-JS החיצונים

Excluded JavaScript Files – אם יש בעיות תצוגה באתר לאחר שאיחדתם את קבצי ה-Java Script, צריך למצוא איזה קובץ Java Script גורם לכך, הפתרון הוא להכניס רשימה של כל קבצי ה-Java Script לכאן אחד אחד, עד שתמצאו את הקובץ שעושה את הבעיות תצוגה ורק אותו תשאירו והוא לא יכנס לקובץ המאוחד

קבצי Java Script

Load Javascript deferred – העלאת קבצי JavaScript במקביל לשאר התוכן שנטען באתר, האפשרות הזו תשפר את מהירות טעינת האתר בכך שהיא לא תחכה לטעינת קבצי ה-JavaScript לפני טעינת שאר התוכן באתר. 

Excluded Javascript files – כאן ניתן למנוע עליה של קבצי JavaScript במקביל לשאר התוכן שנטען באתר, לדוגמא קבצי JQuery שאם הם לא יפעלו לפני קבצים אחרים תפגע התצוגה של האתר

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

Load Javascript deferred

Media – הגדרות לקבצי מדיה​

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

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

LazyLoad

Image Dimensions – התוסף יגדיר בעצמו נתונים חסרים של רוחב וגובה לתמונות, מה שישפר את מהירות אתר, ואת התוצאות בבדיקות המהירות של גוגל. מומלץ להפעיל.

Image Dimensions

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

Embeds

WebP compatibility – התוסף יגיש ויצור קבצי WebP לדפדפנים תומכים, קבצי תמונות שקטנים ב-30% מקבצי תמונות רגילים כמו JPEG. אני משתמש בתוסף Imagify שמייצר לי את הקבצים ולכן האופציה הזו לא פועלת אצלי.

WebP compatibility

טעינה מראש - טעינת קאש מקדימה

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

Active Preloading – מפעיל יצירה מראש של קאש באתר. מומלץ להפעיל.

Active sitemap-based cache preloading – כאשר האופציה מופעלת, ברגע שפג תוקף הזמן המוגדר לזיכרון הקאש, המערכת תיצור אוטומטית קאש חדש לכל הדפים הנמצאים במפת האתר. מומלץ להפעיל.

מפת אתר XML של Yoast SEO – שהאופציה מסומנת התוסף לוקח את מפת האתר מהתוסף של יוסט ומייצרת קאש אוטומטית לכל הדפים שנמצאים במפת אתר. מומלץ להפעיל.

Sitemaps for preloading – במידה ויש לכם תוסף אחר שמייצר מפת אתר, תצטרכו להכניס פה את הלינק למפת האתר.

טעינה מראש - טעינת קאש מקדימה

Preload Links – טוען מראש קאש של דף בדפדפן של הגולש ברגע שהוא מעביר את העכבר מעל לינק בדף. מומלץ להפעיל

Preload Links

Preload Fonts – טוען בתחילת הדף את הפונטים שאתם משתמשים בהם. הפונטים צריכים להיות מאוחסנים באתר באופן לוקלי או ב-CDN שהגדרתם בתוסף, אחרת האופציה לא תעבוד. מומלץ אם אתם העלתם פונט לאתר ומשתמשים בו (לדוגמא באלמנטור)

Preload Fonts

מסד נתונים - ניקוי מסד הנתונים

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

מסד נתונים - ניקוי מסד הנתונים

Heartbeat - הקטנת פניות לשרת

Control Heartbeat – מקטין את הפניות לשרת ומשפר את המהירות. מומלץ

Heartbeat - הקטנת פניות לשרת

Add-ons - אפשרויות נוספות

Google Tracking – שומר את הפיקסל של גוגל אנליטיקס בשרת ומשפר את המהירות טעינה. מומלץ להשתמש כל עוד אתם בודקים שזה לא פוגע בתוצאות של גוגל אנליטיקס.

 

Facebook Pixel – שומר את הפיקסל של פייסבוק בשרת ומשפר את המהירות טעינה. מומלץ להשתמש כל עוד אתם בודקים שזה לא פוגע בתוצאות של הנתונים של הפיקסל של פייסבוק

Varnish – מנקה את הקאש ברמת השרת Varnish – במקרה שלי בגלל שאני ב-Cloudways התוסף מתחבר לקאש בשרת אוטומטית. אחרת הייתם צריכים להפעיל את האפשרות Enable the Varnish caching auto-purge כדי להפעיל ניקוין אוטומטי של מטמון Varnish בשרת שלכם. האפשרות מחליפה את הצורך להשתמש בפלאגאין כמו Purge Varnish Cache.

 

Add-ons - אפשרויות נוספות

Cloudflare – התוסף מתחבר לחשבון Cloudflare וככה ניתן לנקות את הקאש בקלאודפלייר דרך ה-WP Rocket. לאחר ההפעלה לחצו על Modify Options

Cloudflare-WP Rocket

תצטרכו להכניס את המפתחות של חשבון ה-Cloudflare שלכם כאן – ניתן למצוא אותם דרך המדריך הבא

Cloudflare credentials

ברגע שתחברו את Cloudflare יופיע לכם בתפריט אפשרות לנקות את הזכרון מטמון גם ב-Cloudflare ישירות מהאתר שלכם:

ישנה אפשרות לנקות את הזכרון מטמון גם ב-Cloudflare ישירות מהאתר שלכם

בתפריט העליון של WP Rocket יש לכם אפשרות לנקות את הזכרון מטמון באתר שלכם, לנקות את הזכרון מטמון ב-Cloudflare, לטעון קבצי זיכרון מראש ולייצר מחדש את הקובץ CSS המאוחר (Regenerate Critical Path CSS) – אופציה מאוד חשובה אם אתם משנים עיצובים או מוסיפים / מורידים תוספים שמשנים את העיצוב באתר:

ייצור מחדש של הקובץ CSS המאוחר Regenerate Critical Path CSS

סיכום

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

על הכותב

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

אור פיאלקוב

מדריכים נוספים