هل تستخدم Class أم Helper Method عند إنشاء Reusable Widgets؟
خلال مرحلة تعلمك لبرمجة تطبيقات الهواتف الذكية باستخدام Flutter يمكن أن تجد نفسك في حيرة من أمرك: هل أستخدم Class أم Helper Method؟ في إنشاء Reusable Widgets.
نحن في فريق باتريك تكنولوجي ومن خلال تجربتنا أدركنا أن هناك فروق جوهرية بين الطريقتين وكما يقول (REMI ROUSSELET) : “يعتبر استخدام Class أفضل لأنه يوفر سلوك أفضل و الميزة الوحيدة لاستخدام Method كتابة أكواد برمجية أقل بقليل من Class “
Classes have a better default behavior. The only be benefit of methods is having to write a tiny bit less code. There’s no functional benefit
REMI ROUSSELET –
The Creator of Provider, Freezed, and many other packages
و بحسب فريق Flutter فإن تفضيل استخدام Class على Method يرجع لعدة أسباب يمكن تلخيصها كما يلي:
- إطار العمل(framework)لا يدرك Method لكن يرى Class .
بالنظر إلى الاكواد التالية:
باستخدام Method
باستخدام Class
يبدو أن كلاهما يفعل نفس الشيء تمامًا لكن في حقيقة الأمر فإن widget tree مختلفة في كل منهما، كما هو موضح في الصورة التالية:
و هذا الامر مهم لأنه يغير طريقة عمل إطار العمل (framework) عند تحديث widget حيث ليس هناك ما يضمن عدم حدوث أخطاء عند استخدام Helper Method لكن باستخدام Class نضمن عدم مواجهة هذه المشكلات.
- يسمح Class بتحسين الأداء حيث يمكن استخدام (const constructor) مع Class و بالتالي نضمن إعادة بناء أكثر دقة.
- يضمن Class عملhot-reload بشكل صحيح بعكس Helper Method التي يمكن أن تؤدي إلى تعطيل hot-reload.
- أيضًا Class متكامل (integrated) مع widget inspector حيث على سبيل المثال يمكننا مشاهدة ClassWidget التي تم فصلها باستخدام Class عند استخدام devtool، مما يساعدنا على فهم ما هو معروض على الشاشة.
- كما أن استخدام Helper Method قد يفقد widget بعض خصائصها مثل استخدامها مع AnimatedSwitcher و يمكنك النقر هنا حتى تشاهد مثال تفاعلي لمشاهدة الفرق.
- رسائل خطأ مع Class أفضل من Helper Method، إذا حدث خطأ سيظهر إطار العمل اسم widget الذي تم بناؤه حاليًا ولكن إذا قمنا باستخدام Helper Method لعملية الفصل فلن يكون اسم الخطأ واضح لمساعدتنا في معرفة مكان الخطأ.
- بخلاف أن Class يمكنها تعريف keys.
- أما Helper Method يمكنها أن تمنحنا كود أقل من Class.
وفيما يلي بعض الأمثلة التفاعلية من فريق Flutter على Dartpad لتوضيح الأمر أكثر: