jQuery גרסה 1.4 יצאה לאוויר העולם

גרסה חדשה לפרימוורק הפופולרי. מה השתנה?

לפני מספר ימים, ב-14.01, יצאה לאוויר העולם גרסה 1.4 של jQuery מלווה במסע פרסום אגרסיבי ואתר אינטרנט ייעודי שגם חוגג 4 שנים ל-jQuery. קשה להאמין שרק 4 שנים מלאו לפריימוורק הנפלא הזה ל-JavaScript שהצליח יותר מכל פריימוורק אחר וכיום הוא הפריימוורק הפופולרי ביותר שיש.
גרסת 1.4 של jQuery לא טומנת בחובה הפתעות רבות ופריצות דרך, אך היא מקיפה הרבה יותר מהשדרוג הקודם מגרסה 1.26 לגרסה 1.3.

דברים שלא יעבדו לכם בגרסה החדשה

ראשית נראה מה לא השתנה. בעדכון הזה אין כמעט Depreciated functions וכמעט ואין שינוי מהותי בפונקציות קיימות.

השינויים הבולטים בפונקציות קיימות שעלולות לעשות לכם בעיות בשדרוג הן:

1. שינוי בפונקצית add – התוצאות של הפונקציה ממוזגות וממויינות.
2. .clone(true) עושה קלונינג גם למידע ולא רק לאובייקט.
3. אין יותר jQuery.data( element) לא מחזיר id (גם לא החזיר id בגרסה 1.3).
4. jQuery() בלי פרמטרים לא הופך ל jQuery(document).
5. .val(“…”) ב-select box יעבוד לפי ה-value ולא לפי ה-text value.
6. jQuery.browser.version מחזיר עכשיו גם את גרסת המנוע.
7. JSON שנכנס חייב להיות תקין.
8. jQuery.extend לא מבצע הורשה לאובייקטים לא ליטרליים.

המפתחים סיפקו פלאגין שמוודא שלא יהיו depreciated functions לגרסה 1.3. למרות שאני מעריך שלרוב המוחץ של המפתחים לא תהיה בעיה עם שדרוג לגרסת 1.4 לאור מיעוט הפונקציות הקיימות המושפעות מכך.

תוספות בגרסה החדשה

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

אירועים

focusIn ו-focusOut – שני אירועים חדשים שזהים כמעט לחלוטין ל-focus ו-blur רק שהם תומכים בבעבוע ותופסים אירוע דומה של אלמנטים ילדים. עדכון מצוין וחשוב.

אירועים – חלק ב'

Multiple bind – אפשרות לבצע bind לכמה אירועים באמצעות אובייקט של אירועים שמועבר ל-bind.

אנימציות

אפשרות להכנסת סוגי אנימציה (כמו ליניארית ו-swing) לתוך אותו אובייקט המגדיר אנימציה שפונקצית animate מקבלת.
פונקצית delay שמאפשרת לעצור באמצע שרשור של אנימציה.

מניפולציות ב-HTML חלק ב'

פונקצית unwrap שהיא הופכית ל-wrap ומסירה אלמנט אבא עוטף.
פונקצית detach – דומה ל-remove רק שהיא לא מוחקת את האלמנט שנמחק אלא משאירה אותו בזכרון לשימושים נוספים.

מעבר בין אלמנטים

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

מעבר בין אלמנטים ב'

3 פונקציות Traversing חדשות: nextUntil, prevUntil , parentsUntil.

כלים

פונקצית המרת אובייקט jQuery למערך.
שתי פונקציות לבדיקת אובייקטים – isEmptyObject שבודקת אם האובייקט ריק. isPlainObject בודקת אם האובייקט ליטרלי.
proxy – מבחינתי הפונקציה החשובה מכולן. הפונקציה מאפשרת לשנות את הקונטקסט (המשמעות של האופרטור this) באובייקט. סופר שימושי וחשוב. שווה להשקיע 5 דקות בקריאה על הפונקציה הזו. גם למי שלא מתורגל ב-JavaScript מונחה עצמים.
פונקציה ריקה – noop.

ליבה

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

AJAX

פונקצית param לסיריאליזציה מתקדמת של אובייקטים (בעיקר עבור PHP ו-Ruby).

שינויים נוספים בפונקציות

יש עוד כמה שינויים נוספים שלא פירטתי במדריך. כמו למשל אפשרות להכניס לכמה פונקציות פונקציה במקום פרמטר. או אפשרות לשימוש באובייקט לבניית אובייקט DOM באמצעות jQuery. בנוסף הסלקטורים has, first ו-last הפכו גם לפונקציות שאפשר להשתמש בהן.

שינויים בביצועים

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

שינויים נוספים

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

האם לשדרג או לא לשדרג?

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

מדריך ה-jQuery של אתר אינטרנט ישראל שודרג ושוכתב על מנת להתאים לגרסה 1.4.

פוסטים נוספים שכדאי לקרוא

פתרונות ומאמרים על פיתוח אינטרנט

יישום של nonce על מנת להגן מפני התקפות injection

בפוסט הקודם הסברתי על hash עם CSP על משאבי inline – שזה נחמד ומעולה אבל פחות ישים בעולם האמיתי שבו בדרך כלל התוכן ה-inline (בין

פתרונות ומאמרים על פיתוח אינטרנט

המנעו מהעלאת source control לשרת פומבי

לא תאמינו כמה אתרים מעלים את ה-source control שלהם לשרת. ככה תמצאו אותם וגם הסבר למה זה רעיון רע.

תמונת תצוגה של מנעול על מחשב
פתרונות ומאמרים על פיתוח אינטרנט

הגנה מפני XSS עם Trusted Types

תכונה ב-CSP שמאפשרת מניעה כמעט הרמטית להתקפות XSS שכל מפתח ווב צריך להכיר וכדאי שיכיר.

גלילה לראש העמוד