הבטחות לעתיד: תכנות אסינכרוני ב- JavaScript עם Promises

יום שני, דצמבר 12, 2011

תכנות אסינכרוני הופך פופולרי יותר ויותר באפליקציות ה- Web, אך מצד שני, ב- JavaScript הוא אינו קל לביצוע כיום. ספריות ה- JavaScript הפופולריות (כמו jQuery, Dojo ועוד) הוסיפו רמת אבסטרקציה בשם Promise (לפעמים נקראת deferred) כדי להפוך את התכנות האסינכרוני ב- JavaScript לפשוט יותר. בפוסט זה נראה איך להשתמש ב- Promises באפליקציות Web. נדגים את השימוש ב- Promisses עם XMLHttpRequest2 (בקיצור XHR2). תכנות אסינכרוני: למה זה כ”כ קשה? די ברור שאפליקציה שמבצעת חלק מהעבודה ברקע מגיבה טוב יותר למשתמש ויכולה לבצע יותר משימות. אך...
no comments

בניית אפליקציות Offline ב- HTML5: שימוש ב- Application Cache (בקיצור AppCache)

יום ראשון, אוקטובר 2, 2011

עם עליית הפופולריות של התקנים ניידים (טלפונים חכמים, מחשבי לוח ועוד), אפליקציות Web התומכות בעבודה Offline הופכות נפוצות יותר ויותר. HTML5 מגדיר דרך סטנדרטית לשמירת משאבים (קבצים, תמונות וכו’) ב- Cache מקומי ע”י ה- Application Cache (בקיצור AppCache). עם ה- HTML5 Application Cache ניתן לשפר את ביצועי האפליקציות ע”י הורדת כמות הפניות לרשת ולתמוך בעבודה Offline כאשר האתר או החיבור לרשת לא זמינים. הכירות עם HTML5 AppCache HTML5 Application Cache מאפשר לדפים לשמור משאבים (קבצים, תמונות) באופן מקומי. את המשאבים שנרצה לשמור נגדיר בתוך קובץ manifest...
no comments

HTML5: מבוא ל- HTML5 Web Workers ותכנות מקבילי ב- JavaScript

יום ראשון, אוגוסט 7, 2011

פיתוח ב- JavaScript, בהשוואה לסביבות פיתוח אחרות, סבל עד לאחרונה ממגבלה קשה: ביצוע של קוד ה- JavaScript היה מוגבל ל- Thread בודד בדפדפן. לאור העובדה שמשתמשים דורשים כיום אפליקציות עשירות עם חווית משתמש טובה, וכן רוב המחשבים כוללים יותר ממעבד אחד – נדרשת כיום גישה שונה לפיתוח אפליקציות ב- JavaScript, העושה שימוש ביותר מ- Thead בודד. לפני עידן ה- HTML5 Web Workers משום שריצת קוד JavaScript מוגבלת ל- Thread בודד, סקריפט שרץ במשך זמן רב גורם לדף להתקע מבלי אפשרות להגיב לפעולות המשתמש ומביא...
tags: , , , ,
3 comments

HTML5: הוספת מידע חופשי לאלנטים עם data- attributes ו- datasets

יום שבת, יולי 30, 2011

מאפייני ה- *-data החדשים ב- HTML5 מאפשרים לנו לשמור מידע חופשי על אלמנטים ב- HTML ולעשות בהם שימוש בלוגיקה של האתר (לרוב ה- JavaScript). בפוסט הזה נראה איך עשינו את זה עד היום, נבין למה זה לא היה מוצלח ונבין לעומק את הפיתרון ב- HTML5. איך אנחנו עושים את זה היום? את האמת – נכון שיצא לכם פעם להשתמש ב- CSS Classes או במאפיינים לא סטנדרטים של אלמנטים כדי לשמור עליהם מידע ולהשתמש בו בקוד JavaScript? לדוגמא, נניח שאנחנו רוצים להציג מאפיינים של...
tags: , , ,
one comment

מיקרוסופט מבטלת את התמיכה ב- Conditional Comments החל מאינטרנט אקספלורר 10

יום שלישי, יולי 26, 2011

בפוסט בבלוג צוות הפיתוח של אינטרנט אקספלורר, נכתב השבוע כי במסגרת השיפורים במנוע הדפדפן תוסר התמיכה ב- Conditional Comments החל מאינטרנט אקספלורר 10. לוודא שאתרי אינטרנט נראים טוב ומתפקדים טוב בכל הדפדפנים זו משימה לא קלה בכלל, והיא הופכת עוד יותר קשה כאשר קצב שחרור גירסאות הדפדפנים הולך ומתגבר מצד אחד, בעוד משתמשים עדיין משתמשים בגירסאות ישנות של דפדפנים. אינטרנט אקספלורר 6 שוחרר ב- 2001, אינטרנט אקספלורר 7 ב- 2006, כאשר האינטרנט היה שונה מאד ממה שהוא היום, ואי אפשר לצפות שדפדפן בן 10 שנים יציג אתרים באותו אופן...
tags: , , , , , ,
one comment

פיתוח אתרי HTML5 מודרניים עם Modernizr

יום שני, יולי 25, 2011

בזמן שפיתוח אתרים מודרניים העושים שימוש במגוון יכולות של HTML5, CSS3 ו- JavaScript API’s חדשים הולך וצובר תאוצה, עלינו להתמודד עם בעיית התאימות למגוון גירסאות הדפדפנים שנמצאים בשימוש אצל המשתמשים. כיוון שכל דפדפן תומך באלמנטים אחרים של הסטנדרטים המתקדמים באופן טיפה שונה וקצב שונה, עלינו לדעת אילו יכולות עומדות לרשות המשתמש שלנו בדפדפן בו הוא משתמש כדי להציג לו את האתר ולאפשר לו להינות ממנו. Feature Detection במקום Browser Detection במשך שנים הדרך לזהות אילו יכולות נתמכות בדפדפן המשתמש הייתה לבדוק את ה- user agent של...
4 comments

HTML5: טעינה וביצוע של JavaScript באופן אסינכרוני

יום חמישי, יולי 14, 2011

טעינת קבצי JavaScript היא אחד הגורמים הפופולרים לבעיות ביצועים של אפליקציות באינטרנט. כאשר הדפדפן נתקל בתגית script, הוא עוצר את תהליך הרינדור, טוען את קובץ ה- script ומריץ את הקוד. באותו זמן, הדפדפן לא ממשיך את תהליך הרינדור של הדף או מבצע שום דבר שימושי אחר, כיוון שהסקריפט יכול לכתוב לדף, לשנות אלמנטים קיימים או אפילו לנתב את הגולש לדף אחר. פיתרון נפוץ – סקריפט בסוף הדף פיתרון נפוץ, הוא לשים את תגי ה- script בסוף עמוד ה- HTML, ממש לפני התגית <body/>. אמנם זה לא יפתור את העובדה שהדפדפן...
no comments