כדי לנהל מידע בצד לקוח באפליקציות, אנחנו יכולים להשתמש בשני כלים בולטים שהם Context API שעובד ב-React.js ו-Redux שהיא סיפריה כללית לניהול state ב-JavaScript. שניהם מספקים גישה ואפשרות לעדכון נתונים, אך כל אחד מציע גישה שונה ועובד באופן שונה. אז בואו נבין איך Context API ו-Redux עובדות באפליקציות, ומתי עדיף להשתמש בכל אחד מהם.
באפליקציות שבהן יש הרבה מידע (state) שמשותף למספר רב של קומפוננטות (נניח, מעל 30 קומפוננטות), והמידע מתעדכן לעיתים קרובות, שינוי בקומפוננטה אחת יכול לגרום לרינדור של כל הקומפוננטות המשתמשות באותו Context, גם אם המידע ביניהן אינו קשור ישירות (כמו במקרה של `setName` לעומת `setCounter`).
אפשר לנסות לחלק את האפליקציה למספר Contexts כדי שכל עדכון יתבצע רק על Context מסוים, מה שימנע רינדורים מיותרים. אבל הפיצול הזה עלול להוביל למבנה מסובך יותר של האפליקציה ולאבד את הקונספט של 'single source of truth', שבמילים פשוטות מתאר מקום המרכזי והאמין שבו נשמר המידע של האפליקציה.
לעומת זאת, Redux מאפשר לאחסן את כל המידע במקום מרכזי אחד, הנקרא "single source of truth". המידע הזה מחולק לבלוקים קטנים ונפרדים, כאשר כל בלוק מכיל רק את המידע הרלוונטי לו. כך, ניתן להעביר לקומפוננטות באפליקציה רק את המידע שהן צריכות בפועל.
כאשר מתבצע עדכון בבלוק מסוים, רק הקומפוננטות שמשתמשות באותו בלוק מתרנדרות מחדש. זה עוזר לשמור על סדר באפליקציה ולשפר ביצועים, מכיוון שהעדכונים משפיעים רק על החלקים הרלוונטיים, מבלי לגרום לרינדורים מיותרים בשאר חלקי האפליקציה.
עבור אפליקציות קטנות עד בינוניות, עם עץ קומפוננטות שאינו מאוד עמוק או מורכב (לדוגמא, פחות מ-30 קומפוננטות), Context API יהיה בחירה טובה. עבור אפליקציות בינוניות עד גדולות, עם עץ קומפוננטות שגדול ועמוק או מורכב (לדוגמא, מעל מ-30 קומפוננטות) שחולקות מידע משותף, Redux יהיה מתאים יותר.
כאשר הנתונים שלנו אינם רבים והשימוש בהם הוא מוגבל לכמה קומפוננטות בלבד, Context API יכול להיות מספיק טוב ויעיל, כי גם אם חלק או כל הקומפוננטות יתרנדרו, זה לא יכביד יותר מידי על התוכנה שלנו כי מספר הנתונים מצומצם. כאשר יש לנו לא מעט נתונים והשימוש בהם משותף להרבה קומפוננטות, כאן אנחנו כנראה צריכים לתעדף את Redux כדי לשמור על אופטימיזציה טובה.
אם עדכוני הנתונים באפליקציה שלנו אינם תדירים ומורכבים, השימוש ב-Context API יכול להיות פשוט יותר. כי רק מדי פעם נעדכן את הנתונים וזה לא כזה נורא. אבל אם עדכוני הנתונים הם כן תדירים ומורכבים, השימוש ב-Redux יהיה טוב יותר כדי למנוע רנדורים מיותרים, במיוחד באפליקציות שמשותף להם הרבה נתונים.
אז לסיכום, כמו שאתם רואים, אין תשובה אחת נכונה מתי להשתמש ב-Redux ומתי להשתמש ב-Context API. בהתאם להנחיות שאנחנו כתבנו במאמר הזה, אתם צריכים להחליט מה טוב יותר לאפליקציה שלכם.