131 uijet

פרק 131 – שיחה עם יונתן דניב –Freelancer המפתח בעיקר  Client Sideויוצר ספריית uijet

נושא:  UIJet

-         UI Jet – זהו פרוייקט המממש ספריית ג'אווהסקריפט אשר הקוד שלה מורץ בתוך הדפדפן. הפרוייקט נולד מהצורך לבנות ממשקי משתמש ואפליקציות תוך שימוש במגוון רכיבי UI(קומפוננטות) - לדוגמא: רשימות, טבלאות וכו', מתוך מטרה להריץ את האפליקציות הנ"ל על גבי טאבלטים, טלויזיות ומכשירי מובייל. דרישה נוספת היא היכולת לביצוע תחזוקה קלה גם לחסרי נסיון ב-Javascript.

-         תוך כדי חיפוש פתרון הזדמן ליונתן לשמוע הרצאה מעניינת של ניקולאס זאקס (מומחה JS ו-performance מיאהו!) בנושא ארכיטקטורה של אפליקציות Client (ScalableJavascript Application Architecture), הרצאה אשר נתנה השראה למימוש הספריה ושימוש בספריות באחרות.

-         קצרים על ארכיטקטורת אפליקציות קליינט (מתוך ההרצאה):

o       ברובד התחתון של הארכיטקטורה נמצאות ספריות כמו jquery או Prototype אשר עוטפות את ממשק הדפדפן ל-DOM.

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

o       מעל האפליקציה יש שכבה נוספת (לפי NZ) הנקראת Sandbox אשר תפקידה לנהל את הקומפוננטות של האפליקציה מבלי להכיר את השכבות הנמוכות שמתחתיה (מתחת לאפליקציה).

o       – כל קומפוננטה העומדת בפני עצמה ומדברת ישירות מול ה- widgetSandbox. ה-Sandbox מקבל הוראות מהאפליקציה לגבי הפעלת/הפסקת פעולת ה-Widgets ו/או העברת פרמרטים אליהם.

-         מימושים שונים בראיית הארכיטקטורה הנ"ל:

-         XJS ו-Dojo –מיישמים את כל ה-stuck הנ"ל.

-         jQuery – יישום רק של ספריה ומנגנון לבניית Plugins.

-         UIjet זהו ה-sandbox עצמו אשר מגיע יחד עם מספר widgets וכולל:

o       Javascript

o       שימוש ב-css בסיסי – במידה ורוצים לתמוך במגוון רחב של devices יש לשים לב לשילוב עם Javascript שכן לא כל המכשירים תומכים בכל תכונות ה-CSS.

o       הגדרת קבצים ו-dependencies– הנ"ל ייטענו באופן דינמי בזמן הרצת האפליקציה, הקומפוננטות ייטענו ויאותחלו.

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

o       צריך להגדיר ספריה לניהול ההודעות ( pub/sub העובד באופן אסינכרוני)

o       ניתן להוסיף client side router (בחירת ספריה ומימוש Interface) – להגדרת ה-routing בין ה-URL ל-State של הדף

o       ניתן להשתמש ב-Template Engine על ידי מימוש Interface של ה-template.

-         ספריות נוספות שהוזכרו-

o       bonzo-js – ספריה מינימליסטית המממשת ממשק ל-DOM
o       ender-js – מנוע הבונה מספריות נתונות ומיפוי תלויות של מה משתמשים מתוכן ומה לא, ספריה חדשה הכוללת רק את הרכיבים הרלבנטיים.

-         לינקים:

o       https://bitbucket.org/ydaniv
 https://github.com/ydaniv                  -

הקובץ נמצא כאן האזנה נעימה

ותודה רבה לגל כהן על התמלול!