דילוג לתוכן
בניית אתרים לעסקים

שיפור אתרי וורדפרס עם AI: איך אני מטפל באתר שעובד לאט

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

איור של אתר במחשב ובטלפון לצד כלים לבדיקת ביצועים וקוד

בקצרה: איך AI עוזר לשפר אתר קיים?

AI יכול לעזור לאתר מה מאט אתר וורדפרס, להבין דוחות ביצועים ולעבוד על הקוד והתמונות. אני משתמש ב־Codex וב־Claude Code כדי לבדוק קבצים, להכין תיקונים ולהריץ בדיקות, ובמידת הצורך מתחבר גם לשרת ב־SSH. התהליך מתחיל בבדיקה של האתר, ממשיך בשינויים שמתאימים לו, ומסתיים בבדיקה חוזרת של המהירות ושל מה שהגולשים רואים ועושים בו.

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

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

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

העבודה על דיגיטלר התחילה בבדיקת המהירות

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

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

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

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

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

תמונה קטנה על המסך יכולה להיות קובץ גדול

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

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

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

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

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

איך אני עובד היום עם Codex ו־Claude Code

אני משתמש היום גם ב־Codex וגם ב־Claude Code. העבודה איתם כוללת קריאה של קבצים, מעבר על קוד, הכנת שינויים והרצת בדיקות. כשצריך, אני מתחבר גם לשרת באמצעות SSH, חיבור שמאפשר לעבוד עם הקבצים ולהריץ פקודות בשרת עצמו.

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

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

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

לפני שמשנים משהו, צריך להבין מה הוא עושה

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

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

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

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

משנים, פותחים את האתר ובודקים שוב

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

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

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

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

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

ומה עם הציון ב־PageSpeed?

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

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

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

הציון הוא כלי מועיל. מי שנכנס לאתר מרגיש את זמן ההמתנה ואת הקלות שבה הוא מצליח לעשות את מה שבא לעשות.

לפעמים יש הרבה מה לשפר באתר שכבר יש לכם

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

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

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

שאלות נפוצות

אפשר לשפר אתר וורדפרס בלי לבנות אותו מחדש?

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

האם AI יכול לתקן אתר לבד?

כלים כמו Codex ו־Claude Code יכולים לקרוא קבצים, לערוך קוד ולהריץ בדיקות כשנותנים להם את הגישה המתאימה. עדיין צריך להגדיר מה רוצים לתקן, לבדוק את ההצעות ולעבור על התוצאה באתר. בעבודה שלי אני מכוון את התהליך ובודק שהשינוי מתאים לאתר ולמה שהוא צריך לעשות.

האם מספיק להתקין תוסף מהירות?

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

צריך להגיע לציון 100 ב־PageSpeed?

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

האם שיפור המהירות יעזור גם לקידום בגוגל?

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

רוצים להבין מה נכון לאתר שלכם?

שיחת היכרות קצרה על העסק, הלקוחות ומה האתר צריך לעזור להם לעשות.