עיבוד עבור אפליקציות אינטרנט מבוססות תוכן

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

רינדור בצד השרת (SSR)

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

מידע על HTML באתר web.dev

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

יצירת אתרים סטטיים (SSG)

יצירה של אתרים סטטיים (SSG) יוצרת קובצי HTML סטטיים בזמן ה-build ומעבירים אותם למשתמשים ללא רינדור בצד השרת או בצד הלקוח. תוכן האינטרנט נכתב, בדרך כלל בפורמט מובנה כמו Markdown , JSON או YAML, והוא כולל טקסט, תמונות ונכסים אחרים. כלי סטטי ליצירת אתרים, כמו Hugo או Jekyll, מעבד את התוכן ויוצר קובצי HTML, CSS ו-JavaScript. הפלט הסטטי הוא האתר כולו, והקבצים הסטטיים האלה פרוסים בשרת אינטרנט, ברשת CDN או בשירות אירוח.

למידע נוסף על CSS ו-HTML, אפשר להיכנס לאתר web.dev.

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

עיבוד בצד הלקוח (CSR)

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

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