אופטימיזציית וורדפרס – PHP ותחזוקת קוד

אחד הדברים הכי נחמדים בוורדפרס זה העושר בתוספים וערכות עיצוב. במשך ארבע וחצי השנים שאני עם וורדפרס אני לא חושב שנתקלתי במצב שבו רציתי לעשות משהו ולא היו כבר לפחות 3 תוספים שעשו משהו דומה למה שרציתי. מי שמשתתף בקבוצת הדיון של וורדפרס בעברית בוודאי שם לב שהתגובה הכמעט אינסטנקטיבית לשאלה איך עושים את זה היא – מורידים תוסף מהאתר. ואכן, השימוש בתוספים הוא פשוט ונוח אבל אחרי זמן מה של פעילות אתה מציץ בלוח התוספים בפאנל הניהול ומגלה שמותקנים 40 תוספים, מתוכם 20 פעילים, 9 זקוקים לעידכון ואין לך מושג מה עושים 50% מתוכם.

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

תוספים שאין בהם צורך

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

זללני משאבים

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

פונקציות שעושות רעש מיותר.

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

דוגמא אחרת היא תבנית העיצוב בה אני משתמש. כפי שניתן לראות מדובר בתבנית מגזינית שמציגה את הכתבה הראשית כגדולה ועוד 5 כתבות אחרונות כקטנות. מי שכתב את התבנית הזו (מימבו) חשב על נוחיות המשתמש והכניס פה פונקציה שמחפשת עבור כל פוסט האם משוייכת לו תמונה ואם כן – מציגה את התמונה מוקטנת ליד הפוסט. כעיקרון, זה טריק מאוד שימושי ולא קשה כלל לישום אבל בכל הרצה שלו ניגשת הפונקציה למסד הנתונים, שולפת את התוכן של הפוסט הספציפי ואז עוברת על הקוד שלו כדי לחפש img src. אם היא מוצאת – מוחזרת תגית תמונה. אם בכל טעינה של הדף הראשי מוצגות 6 תמונות הרי שוורדפרס מריצה את הפונקציה הזו 6 פעמים. בעבור אתר עם 500 דפים נצפים ביום אנחנו מדברים על 3000 הרצות של הסקריפט – קצת מטופש בהתחשב בעובדה שהתמונה הזו היא תמונה קבועה.

הפיתרון המהיר ביותר היה להשתמש בשדות המותאמים אישית ולשייך עבור כל פוסט תמונה רלוונטית בעזרת התגית מטא lead-image. את התמונה מעלים כרגיל בעזרת העורך (או מעתיקים קישור של כל תמונה ברחבי האינטרנט) וורדפרס יודעת למשוך אותה בקלות כחלק מהמעבר על הלופ. (קישור למדריך: http://n2b.org/archives/551)
למעשה, בשיטה הזו החלפנו 6 קריאות למסד הנתונים וסריקות קוד מיגעות בשימוש בפונקציה מובנית של וורדפרס שנטענת כחלק מהלופ – כמות העבודה שנחסכה פה מהשרת היא משמעותית.

הזרקות קוד לערכה

מי שטרח לנסות לפתח ערכה לוורדפרס בוודאי מכיר את שתי הפונקציות wp_head ו wp_footer. שתי הפונקציות הללו הן עוגנים עבור תוספים שצריכים להכניס מידע להדר או לפוטר ולרוב משמשות כדי להכניס סקריפטים ותבניות עיצוביות נדרשות לתוספים. כך למשל תוספים של צביעת קוד טוענים קובץ CSS המכיל את הגדרות הצבעים ואילו תוסף הלייטבוקס לתמונות דוחף פנימה ג'אווה סקריפט שאחראי לטיפול בתצוגת התמונה בשכבה עילית.
אחת הבעיות העיקריות עם פיתוח תוספים לוורדרפס היא שכל מפתח משתמש במה שאהוב עליו ומכניס קריאה עבורו לקוד. לכן, אם מפתח א' יצר תוסף המבוסס על Jquery בעוד שהשני השתמש ב prototype והשלישי ב scriptaculous, תגלו שטענתם אל הערכה שלכם שלוש סביבות עבודה של JS, ומי שיציץ בקוד של האתר שלי יגלה שגם שם יש כפילויות כי מפתחים שונים עבדו עם גירסאות שונות של סביבות הפיתוח.
לצערי, עדיין לא סיימתי עם הטיפול הזה ב JS אבל הנה דברים שאפשר (וצריך) לעשות אבל באמת מומלץ שרק מי שבקי בנושא יטפל בהם.

1. לבחור רק תוספים שמשתמשים באותה סביבת הפיתוח (רק scriptaculous או רק jquery) האמת שזה יותר קל להגיד מלעשות.
2. לבטל את הזרקת הקוד ע"י התוספים אל תוך ההדר וקריאה אל סביבת ה JS רק פעם אחת ידנית דרך הערכה (גוגל אגב מאכסנת אצלה עותקים ממוזערים של הסביבות).
3. את הסקריפטים הקטנים שמכילים בעצם רק את הפונצקיות הרלוונטיות לתוסף הספציפי אפשר לרכז אל תוך קובץ JS אחד ולטעון אותו בסוף הקובץ.

הסבר מצוין באנגלית ניתן למצוא כאן אם תעלה דרישה אני אתרגם.

להעביר פונקציונאליות לדפדפן המשתמש

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

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

לסיכום

1. היפטרו מתוספים מיותרים – ורצוי על ידי מחיקה שלהם מתיקיית התוספים.
2. הימנעו מקטעי קוד שרצים שוב ושוב בלי סיבה מיותרת.
3. העבירו פונקציונאליות אל מחשב המשתמש.
4. השתמשו בפונקציות מובנות של וורדפרס במקום בתוספים כשאפשר.

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