میرا فٹ بال ایپ میچ ڈے شروع ہونے تک بالکل ٹھیک کام کر رہا تھا

شروع میں فٹ بال ایپ بنانا آسان معلوم ہوتا تھا۔

میرا منصوبہ میچز حاصل کرنے، ٹیمیں دکھانے، اسکور دکھانے اور ہر چند سیکنڈ بعد ریفریش کرنے کا تھا۔ ٹیسٹنگ کے دوران یہ ٹھیک کام کر رہا تھا۔ میں نے دو ٹیبز اور چند نمونہ میچز استعمال کیے تھے۔ سب کچھ ٹھیک لگ رہا تھا۔

پھر پہلا مصروف میچ ڈے آیا۔

سینکڑوں صارفین نے ایک ساتھ ایپ کھولی۔ درخواستیں (Requests) ایک دوسرے کے اوپر آ گئیں۔ کچھ اسکورز پیچھے کی طرف جاتے ہوئے محسوس ہوئے۔ ایپ ہر ایک وزیٹر کے لیے الگ الگ وہی ڈیٹا حاصل کر رہی تھی۔

میں نے سیکھا کہ ایک لائیو ایپ صرف ایک ویب سائٹ نہیں ہے جو کسی API سے جڑی ہو، بلکہ یہ ڈیٹا سنکرونائزیشن (data synchronization) کا ایک نظام ہے۔

یہاں وہ غلطیاں ہیں جو میں نے کیں اور میں نے انہیں کیسے ٹھیک کیا:

  • صرف کلائنٹ سائیڈ پولنگ (client-side polling) سے بچیں میرے پہلے ورژن میں ہر براؤزر ہر پانچ سیکنڈ بعد ڈیٹا کی درخواست کر رہا تھا۔ 1 صارف = فی منٹ 12 درخواستیں۔ 1,000 صارفین = فی منٹ 12,000 درخواستیں۔ زیادہ تر درخواستیں بالکل ایک جیسا ڈیٹا مانگ رہی تھیں۔

  • سرور سائیڈ درخواستیں (server-side requests) استعمال کریں میں نے API کالز کو سرور پر منتقل کر دیا۔ اس سے آپ کو ان چیزوں پر کنٹرول ملتا ہے: • API credentials • Caching • Rate limiting • Error handling • Response formatting

کلائنٹ سائیڈ کوڈ میں کبھی بھی کیز (keys) استعمال نہ کریں۔ اگر کوئی آپ کی کی (key) چرا لے تو یہ غیر محفوظ اور مہنگا پڑ سکتا ہے۔

  • میپنگ لیئر (mapping layer) بنائیں میں نے اپنے کمپوننٹس (components) کو براہ راست خام API ڈیٹا بھیجنا بند کر دیا۔ اگر فراہم کنندہ (provider) کسی فیلڈ کا نام تبدیل کر دیتا، تو میرا UI خراب ہو جاتا۔ اب، میں فراہم کنندہ کے ڈیٹا کو پہلے اپنے اندرونی فارمیٹ میں میپ کرتا ہوں۔ اس سے میرا UI مستحکم رہتا ہے۔

  • رفتار کے لیے سرور کمپوننٹس (Server Components) استعمال کریں لوڈنگ اسکرین دکھانے کے بجائے، میں ابتدائی میچز سرور پر لوڈ کرتا ہوں۔ صارف کو مواد فوری طور پر نظر آتا ہے۔

  • اسمارٹ پولنگ (smart polling) نافذ کریں اگر کوئی میچ لائیو نہ ہو تو ایپ کو ریفریش نہیں ہونا چاہیے۔ میں نے میچز ختم ہونے پر پولنگ روکنے کے لیے ایک چیک شامل کیا۔ اس سے سرور کے وسائل کی بڑی بچت ہوتی ہے۔

  • ریس کنڈیشنز (race conditions) کو ٹھیک کریں کبھی کبھی درخواست B، درخواست A سے پہلے واپس آتی ہے۔ اس سے اسکور ایسے لگتے ہیں جیسے وہ پیچھے کی طرف جا رہے ہوں۔ میں نئی درخواستیں شروع کرنے سے پہلے پرانی درخواستوں کو منسوخ کرنے کے لیے AbortController استعمال کرتا ہوں۔

  • غلطیوں کو بہتر طریقے سے سنبھالیں (Handle errors gracefully) اگر ریفریش ناکام ہو جائے تو خالی اسکرین نہ دکھائیں۔ آخری کامیاب ڈیٹا کو نظر آنے دیں۔ پندرہ سیکنڈ پرانا اسکور نہ ہونے والے اسکور سے بہتر ہے۔

ایک ڈیمو کو صرف ڈیٹا دکھانے کی ضرورت ہوتی ہے۔ ایک حقیقی پروڈکٹ کو کیشنگ (caching)، سیکیورٹی اور اسٹیٹ (state) کو مینیج کرنا چاہیے۔

کیا آپ نے کوئی لائیو ایپ بنائی ہے؟ جب حقیقی صارفین آئے تو کیا چیز خراب ہوئی؟

ماخذ: https://dev.to/mihailove123/my-football-app-worked-perfectly-until-matchday-started-3i59