שלום אורח התחבר

הבלוג של ינון פרק

טיפים קצרים וחדשות למתכנתים

הזינו את כתובת המייל וקבלו את הפוסט היומי בכל בוקר אליכם לתיבה:

יש שתי בעיות למתכנתים שצריכים לכתוב יישומי Web יעילים: הראשונה שאנחנו לא יודעים שיש ליישום שלנו בעיית ביצועים והשניה שעד שאנחנו מזהים בעיה זה עשוי להיות מאוחר מדי בשביל לתקן.

הסיבה שאין לנו מושג שהיישום שלנו פועל לאט היא שהמחשב שלנו הרבה יותר מהיר מזה של המשתמשים שלנו. מתכנתים מעדיפים Dell XPS או Macbook Pro ונשמח גם לקבל איזה סרפייס בוק תודה שהצעתם. המשתמשים לעומת זאת בדרך כלל ישמחו לשלם חצי מהמחיר שמחשבים אלה עולים כדי לקבל מחשב נייד שעושה בדיוק את אותה עבודה. אז ברור שכשאתם טוענים את האתר שלכם מהמחשב הסופר מתקדם שיש לכם בסביבת הפיתוח אתם לא מרגישים את האיטיות שהמשתמשים אולי מרגישים.

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

ביום חמישי בעשר בבוקר אני ממשיך את המסורת של וובינרים בחמישי והשבוע נשקיע שעה בללמוד על ביצועים ב React. התוכנית בגדול:

המשך קריאה...

שתי צורות של תקשורת בריאקט מאוד ברורות מהתיעוד: הראשונה היא העברת מידע מהורה לילד באמצעות Properties, והשניה היא שליחת פקודות מילד להורה באמצעות העברת Callback בתור Property. פוסט זה יעסוק בבעיה שלישית שפחות מדברים עליה: איך לשלוח פקודה מהורה לילד.

המשך קריאה...

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

המשך קריאה...

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

המשך קריאה...

רידאקס הוא אחלה אבל כמות הקוד מסביב שצריך לכתוב רק בשביל שדברים יעבדו יכולה להעיק, במיוחד בעת פיתוח פיצ'רים חדשים. בצד הטוב עם קצת יצירתיות ו JavaScript אפשר לצמצם אותה משמעותית.

המשך קריאה...

ה Trade Off של Redux הוא די ברור: ״שלמו״ בפיתוח מסורבל של ה Actions וה Reducers וקבלו בתמורה פיתוח מהיר ויעיל של קוד React. בשביל להנות מהיתרונות בצד של React מומלץ להקפיד לפחות על שלושת הכללים הבאים.

המשך קריאה...

ל React יש את React.Children שאמור לעזור לנו לעבוד עם פקדים שמכילים פקדים אחרים. אז למה הוא לא סופר כמו שהיינו מצפים?

המשך קריאה...

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

המשך קריאה...

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

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

המשך קריאה...

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

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

המשך קריאה...