Flutter لتطوير الويب: الفوائد والتهديدات والتطبيقات

في عام 2022 ، تفوقت Flutter ، مجموعة أدوات تطوير البرامج التي أنشأتها Google ، رسميًا على منافستها الشرسة ، React Native ، لتصبح الشركة الرائدة الجديدة في مجال التكنولوجيا عبر الأنظمة الأساسية. وفقًا لتقارير Google ، تم طرح أكثر من 100000 تطبيق قائم على Flutter للجمهور. على الرغم من شعبيتها المتزايدة ، إلا أن Flutter لا تزال معروفة كأداة لتطوير الأجهزة المحمولة متعددة المنصات (Android و iOS). وفي الوقت نفسه ، يعرف عدد قليل فقط من خبراء الصناعة أنه يمكن أيضًا استخدام Flutter في تطبيقات الويب! اكتشف الاحتمالات والتطبيقات والمخاطر المرتبطة بـ Flutter لتطوير الويب واكتشف القيمة التي يمكن أن تضيفها إلى عملك.

أصبح Flutter أحد أكثر الحلول إثارة المتاحة في السوق ليس فقط بسبب فعاليته من حيث التكلفة وكفاءة الوقت. مع كل تحديث ، يقترب أداء Flutter من الحلول الأصلية. بالطبع ، تختار العديد من الشركات Flutter للويب كإضافة إلى منتجها المحمول ، مع تركيز قوي على زيادة عدد نقاط الاتصال بالعملاء. ولكن هل يستحق التفكير في Flutter للويب لميزاته الفردية فقط؟

بالطبع هو كذلك! يتيح Flutter التطوير السريع لتطبيقات الويب مع واجهات معقدة وفريدة من نوعها ولا يعلى عليها عندما يتعلق الأمر بتقديم تجارب شبيهة بالهواتف المحمولة. تحتاج أمثلة؟ ما عليك سوى التحقق من أداة PAJO لإشراك العملاء ، والتي تم إنشاؤها باستخدام Flutter للويب بواسطة فريقنا.

دعنا ننتقل مباشرة إلى النقطة المهمة: ما هي فوائد وتطبيقات ومخاطر Flutter للويب؟ هل Flutter جيد لتطوير الويب؟ أقرأ أكثر لتكتشف!

Flutter للويب: لنبدأ بالأساسيات

لنبدأ بالمعلومات الأساسية:

ماذا: Flutter هو إطار عمل Google يسمح للمطورين بإنشاء تطبيقات للجوال والويب وسطح المكتب والتطبيقات المضمنة باستخدام قاعدة شفرة مشتركة واحدة.

متى: تم إصدار أول نسخة مستقرة من Flutter في نهاية عام 2018.

والسبب في ذلك: أنشأت Google Flutter كاستجابة لانصهار الميزانيات لتطبيقات الأجهزة المحمولة والشعبية المتزايدة لـ React Native ، لتصبح المنافس الرئيسي لها.

الآن دعنا ننتقل إلى بعض المعلومات الفنية المحددة.

يلفت Flutter الانتباه إلى Dart ، وهي لغة موجهة من Google والتي ، وفقًا للعديد من المتخصصين في المجال ، هي مستقبل تطوير جميع الأجهزة المحمولة والويب وسطح المكتب. مقارنةً بجافا سكريبت (المستخدمة من قبل منافسها الرئيسي ، React Native) ، فإن Dart موجهة بالكامل للكائنات ومكتوبة بقوة. ماذا يعني هذا لعملك؟ الكود الذي يتم تسليمه في Dart أكثر مقاومة للأخطاء ويسهل الحفاظ عليه ، حتى لسنوات عديدة في فريق متغير. لا شك أن لغة البرمجة Flutter هي واحدة من أعظم مزاياها.

Flutter لتطوير الويب

هل تعلم أن ميزة تطوير الويب في Flutter جديدة نسبيًا؟ قبل عامين ، أجرت Google مشروعًا بحثيًا يسمى Hummingbird. كانت مجموعة مطوري Google المشاركين في Hummingbird تحاول إيجاد طريقة لإنشاء تطبيقات الويب من نفس كود Flutter الذي تم استخدامه في تطبيقات iOS و Android.

ساهمت آثار هذا المشروع إلى حد كبير في تطوير الإطار. على الرغم من أن الأمر استغرق بعض الوقت ، في مارس 2021 ، أعلنت Google أن Flutter للويب كان مستقرًا تمامًا وجاهزًا للاستخدام في المشاريع التجارية. كود واحد ، تكنولوجيا واحدة ، عدة طيور بحجر واحد.

كيف يعمل Flutter للويب ، أحد أحدث مشاريع Google؟ باختصار ، منذ إصدار 2021 ، يمكن للمطورين تجميع كود Dart الحالي في منتج ويب - باستخدام نفس إطار عمل Flutter الذي يستخدمونه لتطوير تطبيقات الأجهزة المحمولة عبر الأنظمة الأساسية. في هذا السياق ، يعد الويب مجرد هدف جهاز آخر لتطبيق الهاتف المحمول - وليست هناك حاجة لإشراك أي مطور ويب آخر.

فوائد Flutter للويب

ما هي الفوائد الرئيسية لـ Flutter للويب؟ الأهم من ذلك ، تعمل Google على زيادة مشاركتها في مشروع SDK ، كما يتضح من التحسينات والإصدارات المنهجية (ما يقرب من 20 إصدارًا في عام 2022!). على الرغم من تاريخها القصير نسبيًا ، فقد تغلب Flutter بالفعل على العديد من مشاكل النضج المبكر. ما هي أهم مزايا Flutter Web الأخرى؟

هل تريد البقاء على اطلاع دائم بأهم تحديثات Flutter؟

اشترك في نشرتنا الإخبارية

1. Flutter للويب يقلل من تكاليف التطوير

باستخدام Flutter للويب ، يتم إنشاء ثلاثة تطبيقات باستخدام قاعدة بيانات واحدة ، ضمن فريق واحد متصل تقنيًا ، بوتيرة واحدة. لا يتعين على العملاء الذين يطورون تطبيقاتهم باستخدام Flutter البحث عن بائعين لثلاث تقنيات مختلفة ثم مزامنة عملهم. ليست هناك حاجة لتكرار ، على سبيل المثال ، نفس وظيفة الدفع أو إذن وسائل التواصل الاجتماعي. هل هذا يعني مباشرة المدخرات الثلاثية؟ ليس تماما!

بالطبع ، Flutter يقلل بشكل كبير من تكاليف التطوير. ومع ذلك ، هذا لا يعني أن تطوير التطبيقات عبر الأنظمة الأساسية هو نفس تطوير التطبيقات الأصلية. غالبًا ما يكون تقديم وظيفة معينة للمنصات المشتركة أكثر تعقيدًا بعض الشيء. عادةً ما يكون هناك عامل مضاعف عبر الأنظمة الأساسية يبلغ حوالي 1.2-1.5. ماذا يعني ذلك؟ إذا كانت الوظيفة تستغرق X ساعة من التطوير لمنصة واحدة ، فإنها تستغرق (1.2-1.5) * X عندما يتعلق الأمر بالمنصة المشتركة. ومع ذلك ، يمكن أن تكون x1.5 مقارنة بـ x3 حالة رابحة لميزانيتك.

2. التحجيم السهل والتحقق من الفكرة من حيث التكلفة

كفاءة التكلفة والوقت تجعل Flutter خيارًا ممتازًا للتحقق من فكرة المنتج وتحديد الهوية (PoC). في غضون أسابيع قليلة ، يمكنك تطوير تطبيق كامل التشغيل يمكنك إصداره بسهولة في متاجر التطبيقات وتوزيعه عبر الويب. بعد النجاح المحتمل ، يمكنك التفكير في توسيع نطاق تطبيقات الهاتف المحمول والويب ، على سبيل المثال ، من خلال توسيع تطبيقات الأجهزة المحمولة عبر الأنظمة الأساسية لتشمل التطبيقات الأصلية.

وقد اتبعت العديد من عمالقة الصناعة ، مثل Airbnb ، هذا المسار. بعد نجاح تطبيقات الأجهزة المحمولة عبر الأنظمة الأساسية ، قررت Airbnb التحول إلى الحلول الأصلية ، والتي تتيح مزيدًا من الحرية في تكييف المنتج مع المجموعة المستهدفة.

3. عملية صيانة مبسطة

ماذا يحدث عندما ينجح طلبك أخيرًا؟ يذهب إلى الصيانة! والتعاون مع متخصص Dart / Flutter أسهل بكثير وفعال من حيث التكلفة من توظيف ثلاثة مطورين فقط للحفاظ على الكود. ناهيك عن أن أي اختلال في مهارات المطورين يولد اختلافات في وتيرة العمل.

تعد مهارات فريق التطوير مهمة أيضًا ، مع الأخذ في الاعتبار الشكل والمظهر المشتركين على منصات مختلفة. عندما تقرر تطوير ثلاثة مشاريع ، فإن شكلها النهائي يعتمد بشدة على مهارات المطور وسلوك واجهة المستخدم. عندما يفضل الشخص الذي يعمل بنظام iOS الزوايا المستديرة ، ولا يكون نظام التشغيل Android حريصًا عليها ، فقد يتضح أن هذين التطبيقين سيختلفان في كيفية تأثيرهما على استراتيجية منتجك.

4. تجارب مذهلة تتمحور حول التطبيق

وفقًا لمؤسسي الويب Flutter ، في هذا الوقت ، يعد Flutter أداة مثالية لتضمين التجارب التفاعلية. كإطار عمل لواجهة المستخدم ، يمكن أن يوفر Flutter خدمات تتمحور حول التطبيقات لمواقع الويب - وبالتالي فهو حل مثالي لتطبيقات الويب التقدمية وتطبيقات الصفحة الواحدة وتحسين تطبيقات Flutter للأجهزة المحمولة الحالية. يمكنك قراءة المزيد عنها في قسم الفرص أدناه. لكن أولاً ، دعنا نناقش أخيرًا أهم مخاطر الويب Flutter.

تهديدات Flutter للويب

كما ذكرنا سابقًا ، يعد Flutter Web مشروعًا جديدًا نسبيًا ، يتم تحسينه باستمرار بواسطة خبراء عبر الأنظمة الأساسية. عندما قام فريق Flutter بتجميع قائمة بالمخاطر المحتملة المتعلقة بتطوير الويب Flutter في عام 2021 ، لاحظنا 14 مشكلة. اليوم ، انخفضت قائمة مخاطر الويب الخاصة بـ Flutter بمقدار الثلث. ومع ذلك ، لا تزال هناك بعض المشكلات ، مثل مشكلات تحسين محركات البحث أو نقص الدعم لبعض المتصفحات ، بحاجة إلى المعالجة. ما أهم عيوب Flutter للويب في عام 2022؟

1. استثناءات تطبيقات الويب من Flutter للويب

ربما لا يكون هذا عيبًا مباشرًا لـ Flutter Web ، ولكنه أكثر إخلاء مسؤولية جدير بالذكر. عوالم تطبيقات Android و iOS متشابهة جدًا ، وقاعدة الرموز في معظم الحالات هي 95-100٪ متماثلة. ومع ذلك ، قد لا ينطبق هذا على إصدار المتصفح!

يعد درج الورقة السفلية أو قائمة علامة التبويب السفلية أو الدوارات الأفقية أنماطًا رائعة لتجربة المستخدم المحمولة لا تنطبق على الويب جيدًا. غالبًا ما تحتاج إلى إنشاء استثناءات لتطبيق الويب فقط. غالبًا ما يحتاج التصميم المعماري إلى أن يكون مختلفًا تمامًا على الهاتف المحمول والويب. في بداية العمل ، من الجيد إجراء مناقشة مائدة مستديرة بين المصممين والمطورين. اسمح لهم بمشاركة وجهة نظرهم وحاول الوصول إلى توافق في الآراء ، خاصة إذا كنت تهتم بميزانيتك وجدولك الزمني.

2. مشاكل تحسين محركات البحث (SEO)

بصراحة ، لا يدعم Flutter Web تحسين محركات البحث. كيف يشرح منشئو إطار العمل عدم توافق تحسين محركات البحث لتطبيقات الويب التي تم إنشاؤها باستخدام Flutter؟

يعطي Flutter Web الأولوية للأداء والإخلاص والاتساق. هذا يعني أن مخرجات التطبيق لا تتوافق مع ما تحتاجه محركات البحث للفهرسة بشكل صحيح. بالنسبة لمحتوى الويب الثابت أو الذي يشبه المستندات ، نوصي باستخدام HTML — تمامًا كما نفعل في flutter.dev و dart.dev و pub.dev. يجب أن تفكر أيضًا في فصل تجربة التطبيق الأساسية - التي تم إنشاؤها في Flutter - عن الصفحة المقصودة والمحتوى التسويقي ومحتوى المساعدة - التي تم إنشاؤها باستخدام HTML المحسَّن لمحرك البحث.

المصدر: الأسئلة الشائعة على الويب بواسطة Flutter.dev

وفقًا لـ Stack Overflow ، فإن سهولة تحسين محركات البحث هي أحد الأهداف التالية لفريق Flutter. ومع ذلك ، في هذه المرحلة ، يجب على المطورين الذين يرغبون في تحسين تطبيق الويب من حيث تحسين محركات البحث استخدام مكتبات إضافية.

3. لا يتم إعادة التحميل الساخن في Flutter للويب

يعد إعادة التحميل السريع أحد أكثر مزايا Flutter لتطوير الأجهزة المحمولة التي يمكن التعرف عليها. باستخدام هذه الميزة ، يمكن للمطورين معاينة التغييرات الأمامية والخلفية على الفور - وإجراء الإصلاحات اللازمة في مرحلة مبكرة من الإنتاج. لسوء الحظ ، لا تتوافق إعادة التحميل الساخن مع Flutter Web بعد.

لحسن الحظ ، هناك بديل معين لإعادة التحميل السريع في Flutter للويب: إعادة التشغيل السريع. تتيح إعادة التشغيل السريع معاينة التغييرات دون الحاجة إلى إعادة تشغيل تطبيق الويب. الاختلاف الوحيد (والأكثر إيلامًا) هو أن إعادة التشغيل السريع ، على عكس إعادة التحميل السريع ، تفقد حالة التطبيق - مما قد يقلل من المرونة في إدخال تغييرات التطوير.

4. التوافق المحدود مع بعض المتصفحات

وفقًا لمطوري Flutter ، يمكن تشغيل تطبيقات الويب Flutter على أربعة متصفحات شائعة:

• كروم
• سفاري
• حافة
• ثعلب النار

نظريًا ، يجب أن تتأكد من أن تطبيق الويب الخاص بك سيعمل بكفاءة بغض النظر عن المتصفح الذي يختاره المستخدمون. لكن كيف يتم ذلك عمليًا؟ يقوم بعض مطوري Flutter بالإبلاغ عن مشكلات في Safari ، ويشكون من الحاجة إلى إجراء حلول تستغرق وقتًا طويلاً للعديد من الميزات.

لا يزال Flutter Web يواجه بعض الصعوبات البسيطة ، مثل مشكلات تحسين محركات البحث أو التوافق المحدود مع Safari أو المكتبات المفقودة. ولكن في الوقت نفسه ، ليس هناك شك في أن Flutter يصبح أكثر كفاءة وقريبًا من الوظائف الكاملة مع كل تحديث. وليس من المبالغة أن نقول إنه في غضون عام ، قد تصبح كل هذه المشاكل شيئًا من الماضي!

تطبيقات Flutter لتطوير الويب

الآن دعنا نصل إلى النقطة: من يمكنه الاستفادة أكثر من Flutter لتطوير الويب؟ يشير منشئو Flutter إلى ثلاث حالات استخدام مثالية لـ Flutter Web:

تطبيقات الويب التقدمية

منذ إطلاق الإصدار الثابت Flutter 2 في عام 2021 ، تمكن مطورو Flutter من إنشاء تطبيقات الويب التقدمية (PWA): تطبيقات الويب ليست قادرة على العمل في وضع عدم الاتصال فحسب ، بل تحاكي أيضًا وظائف الهاتف المحمول أثناء التشغيل من خلال المتصفح.

ببساطة ، PWAs هي صفحات ويب يمكن تثبيتها على أي جهاز لتوفير تجربة مماثلة للأصليين - وعلى العكس من تطبيقات iOS و Android المخصصة ، يمكن استخدامها على أي جهاز.

غالبًا ما تستخدم PWAs من قبل الشركات التي تقدم منتجات لجماهير مستهدفة واسعة ، وترغب في تقديم تجربة مستخدم لا تشوبها شائبة في جميع نقاط اتصال المستهلك ، ويجب أن تستفيد من كل فرصة للتفاعل مع مستخدم محتمل. أمثلة؟ Starbucks ، Flipboard ، اللعبة 2048. أراهن أنك استخدمت واحدًا على الأقل من هذه التطبيقات الجذابة!

تطبيقات صفحة واحدة

Facebook و Gmail و Google Maps و Spotify - تشترك كل هذه التطبيقات الشائعة في شيء واحد مهم على الأقل. تعمل بدون إعادة تحميل الصفحة. أثناء التفاعل مع تطبيق صفحة واحدة ، لا يتعين على المستخدمين الانتظار حتى يتم تحميل صفحة جديدة - فهي موجودة منذ البداية مع المحتوى ذي الصلة.

إن SPAs سريعة الاستجابة ، ومن السهل نسبيًا ترميزها وتحسينها وصيانتها. أخيرًا وليس آخرًا ، يمكن تطويرها بسرعة باستخدام Flutter - وتكون بمثابة منتج قابل للتطبيق بجودة ممتازة.

هل ترغب في قراءة المزيد عن الويب التقدمي وتطبيقات الصفحة الواحدة؟ تأكد من قراءة مقالتنا حول اختيار نوع التطبيق المناسب لعملك!

يمكن تحويل تطبيقات Flutter الموجودة على الأجهزة المحمولة بسهولة إلى Flutter للويب

تعد إضافة دعم الويب إلى مشروع محمول قائم على Flutter أمرًا سريعًا وسهلاً: فهو يتطلب إنشاء دليل ويب و ... الضغط على زر التشغيل! بالطبع ، لضمان أداء لا تشوبه شائبة ، من الضروري جعل تطبيق الويب سريع الاستجابة وسهل التنقل. ولكن بالمقارنة مع إنشاء تطبيق من البداية ، فإن إضافة إصدار الويب إلى تطبيق الهاتف المحمول الحالي في Flutter يتطلب جزءًا بسيطًا من الجهد.

هل يستحق Flutter للويب المحاولة؟

هل يستحق Flutter للويب المحاولة؟ من الواضح أنك يجب أن تجيب على هذا السؤال بنفسك. يعتمد اختيار الإطار المناسب لمنتجك على العديد من العوامل التجارية والتكنولوجية ، مثل مهمة الشركة أو رؤيتها أو ميزانيتها أو حجمها أو مجموعة التقنيات. ومع ذلك ، في بعض الحالات المحددة ، يجدر التفكير على الأقل في استخدام Flutter Web.

أولاً ، يوفر Flutter Web فرصًا غير مسبوقة للشركات الناشئة في مراحلها الأولى. فقط تخيل أنك توصلت للتو إلى فكرة رائعة عن المنتج ، حددت أهداف عملك ، وقمت بإجراء تحليل تنافسي. الآن يجب عليك التحقق من MVP الخاص بك في أقرب وقت ممكن - قبل أن تنتهي اللحظة. في هذا السيناريو ، يعد اختيار Flutter لتطوير الويب بالتأكيد خيارًا آمنًا وموفرًا للوقت ومعقولًا.

ثانيًا ، مرونة لغة برمجة Dart تجعل Flutter Web خيارًا ممتازًا لتحسين منتجك الرقمي. يتيح Flutter التطوير السريع للتطبيقات على العديد من الأنظمة الأساسية المختلفة ، مما يزيد من ظهور منتجك وإمكانية وصول المستخدمين إليه.

إذا وجدت القليل من موقف عملك في أي من السيناريوهات المذكورة أعلاه ، فمن الجدير بالتأكيد الاهتمام بـ Flutter Web.

ومتى لا يستحق التفكير في تطوير تطبيق ويب باستخدام Flutter؟ حتى منشئو إطار العمل يعترفون أنه في هذه المرحلة ، ليست كل صفحة ويب منطقية في Flutter:

(...) Flutter غير مناسب لمواقع الويب الثابتة ذات المحتوى الغني بالنص المستند إلى التدفق. على سبيل المثال ، تستفيد مقالات المدونة من النموذج المرتكز على المستند الذي تم بناء الويب حوله ، بدلاً من الخدمات التي تتمحور حول التطبيق والتي يمكن أن يقدمها إطار عمل واجهة المستخدم مثل Flutter. ومع ذلك ، يمكنك استخدام Flutter لتضمين تجارب تفاعلية في مواقع الويب هذه. يجب أن يسبق البحث عن المكتبات المتاحة كل مشروع هناك.

المصدر: الأسئلة الشائعة على الويب بواسطة Flutter.dev

يجب أن يسبق أي قرار تجاري إجراء بحث شامل واستشارة العديد من خبراء الصناعة.

المستقبل المشرق (المتوقع) لـ Flutter للويب

في هذه المرحلة ، قد لا يكون اختيار Flutter لكل مشروع ويب هو أفضل فكرة. ومع ذلك ، أتوقع مستقبلاً أكثر إشراقًا لهذا الإطار سريع التطور. لماذا ا؟

لم يسبق أن كان المستخدمون منتشرين بين المنصات. الأجهزة المحمولة ومتصفحات الويب ليست سوى غيض من فيض. يستخدم الناس التطبيقات في السيارات والساعات وأجهزة التلفزيون.

لذلك ، هناك حاجة إلى تبسيط العملية وتقليل تكاليف إنتاج البرامج. يعد أحد قواعد البرمجة لتطوير الويب والهاتف المحمول نمطًا شائعًا بالفعل ، ويعد Flutter للويب مثالاً ممتازًا.

لفترة طويلة ، كنت أعتبر Flutter Web تقنية وليدة. لقد جعلني عملي الأخير أغير رأيي. يذكرني Flutter بشاب بالغ يقف أمام مستقبل مشرق. يبدو خيارًا جذابًا للأفكار ذات الميزانيات الصغيرة والمواعيد النهائية القصيرة. يعد Flutter خيارًا مثاليًا لأولئك الذين يرغبون في التحقق من أفكارهم بسرعة وبنفقات منخفضة وأولئك الذين لديهم فكرة ويستجيبون لاحتياجات السوق.