AJAX (תכנות)

AJAX (ראשי תיבות של Asynchronous JavaScript And XML) היא טכניקה ליצירת יישומי רשת אינטראקטיביים המבוססים על קוד המורץ במסגרת דף HTML בודד, ולא כיישום מרובה דפים, כמקובל בסביבת ה-Web. מטרתה העיקרית של הטכניקה היא שיפור חוויית המשתמש והאצת מהירות הטעינה של דפי האינטרנט, מאחר שהיא מאפשרת לעדכן רק חלקים מבוקשים בדף האינטרנט, ללא צורך לטעון את הדף כולו מחדש במחשבו של המשתמש.

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

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

== מרכיביה של טכניקת AJAX ==

טכניקת AJAX משתמשת בשילוב של טכנולוגיות קיימות:
* XHTML (או HTML) ו-CSS לסימון ועיצוב מידע.
* שפת JavaScript למימוש הלוגיקה של היישום, לגישה אל השרת ולאינטראקציה עם המשתמש על ידי מניפולציה של ה-DOM.
** אובייקט XMLHttpRequest להחלפת נתונים עם השרת באופן אסינכרוני. בסביבות עבודה אחדות של AJAX ובסיטואציות מסוימות, נעשה שימוש בתגית iframe במקום באובייקט XMLHttpRequest להחלפת מידע עם שרת האינטרנט.
* JSON ו-XML משמשים לרוב כפורמט להעברת נתונים מהשרת, ולעיתים גם אליו. כל פורמט אחר יפעל גם כן, כולל HTML או CSV ("טבלאות" טקסט המופרדות על ידי פסיקים).

כמו DHTML, LAMP, או SPA, גם AJAX אינה טכנולוגיה כשלעצמה, אלא מונח שמתייחס לשימוש בקבוצת טכנולוגיות יחדיו. למעשה, כבר מופיעות טכנולוגיות נגזרות/מורכבות שמבוססות באופן ממשי על AJAX. כגון AFLAX.

== דפדפנים תומכים ==

{| border="1" cellspacing="0" style="border-collapse:collapse;" class="wikitable"
|-
! bgcolor="#FFCBCB" | שם
! bgcolor="#FFCBCB" | גרסה ראשונה שתמכה ב Ajax
! bgcolor="#FFCBCB" | תמיכה מובנית
! bgcolor="#FFCBCB" | תמיכה באמצעות תוסף
! bgcolor="#FFCBCB" | הערות
|-
| אינטרנט אקספלורר
| 5.0
| החל מגרסה 7.0
| כן באמצעות ActiveX
| -
|-
| Mozilla Firefox
| 1.0
| כן
| -
| בנוסף כל דפדפן אחר המבוסס מנוע הרנדור "גיקו"
|-
| Google Chrome
| 1.0
| כן
| -
| -
|-
| דפדפן אופרה
| 8.0
| כן
| -
| -
|-
| ספארי
| 1.2
| כן
| -
| -
|-
| Netscape
| 7.1
| כן
| -
| -
|-
| Konqueror
| ?
| כן
| -
| רינדור ה-HTML מושג באמצעות KHTML.
|-
| iCab
| 3.0 Beta
| כן
| -
| -
|}

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

== יתרונות וחסרונות ==

יתרונות השיטה:

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

חסרונות השיטה: 

* תפקוד לחצן ה-Back של הדפדפן יכול להיפגע
* קושי בשמירת דפים במועדפים
* השהיית הרשת (network delay) יכולה לגרום לבעיית שימושיות
* יש צורך לאפשר JavaScript
* קושי בתאימות לתקני נגישות (כגון WAI)
* עומס על בסיס הנתונים (במקום שאילתה אחת, תבוצע שאילתה על כל גישת AJAX)

== ראו גם ==
* יישום רשת
* Dynamic HTML
* דף אינטרנט דינמי
* jQuery

== קישורים חיצוניים ==

* [https://web.archive.org/web/20120430060945/http://www.w3schools.com/ajax/default.asp מדריך בסיסי ל-AJAX] באתר W3Schools (באנגלית)
* [http://scc.sela.co.il/SCC/Pages/Search/Search.aspx?lang=he-IL&FreeText=ajax סרטים מלאים להסברת AJAX]
* [https://web.archive.org/web/20101102214017/http://blogs.microsoft.co.il/blogs/shlomo/archive/2010/10/27/the-complete-guide-of-asp-net-ajax.aspx מדריך מלא בעברית] על AJAX עם ASP.NET
* [http://www.internet-israel.com/internet/בניית-אתרים/בניית-אתרי-אינטרנט-למפתחים/מדריך-ל-ajax/ מדריך בסיסי ל-AJAX] באתר אינטרנט ישראל (בעברית)
* [http://developer.mozilla.org/en/docs/AJAX:Getting_Started Ajax:Getting Started] מרכז פיתוח מוזילה
* [http://www.xul.fr/en-xml-ajax.html Ajax Tutorial] עם דוגמאות get, post, text XML .
*[https://www.appweb.technology/ajax-and-wordpress/ מה זה AJAX וכיצד ניתן להשתמש בו בוורדפרס]

קטגוריה:ערכים שבהם תבנית בריטניקה אינה מתאימה
קטגוריה:פיתוח יישומי ווב
קטגוריה:XML
קטגוריה:עיצוב אתרי אינטרנט