Cordova/next steps

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

أفضل ممارسات التطوير في كوردوفا

التطبيقات أحادية الصفحة (SPA) هي صديقك المفضل

من المهم أن تُصمّم تطبيقات كوردوفا وفق مقاربة التطبيقات أحادية الصفحة (SPA، اختصار للعبارة Single Page Application). هذه التطبيقات من جانب العميل (client-side application) تُشغّل عبر طلبية (request) واحدة من صفحة إلكترونية، إذ يحمِّل المستخدم في البداية مجموعة أولية من الموارد (ملفات HTML و CSS و JavaScript)، أمَّا التحديثات الأخرى (إظهار عارض [view] جديد، وتحميل البيانات...) فتُجرَى عبر طلبات XHR.

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

يمكن أن تساعدك مقاربة SPA على تنظيم تطبيقك بطريقة أكثر كفاءة، ولكن لها أيضًا بعض الفوائد الخاصة لتطبيقات كوردوفا. فمثلًا، تطبيقات كوردوفا تنتظر إطلاق الحدث deviceready قبل استخدام أية إضافة. لذلك إن لم تستخدم SPA، وقام المستخدم بالنقر للانتقال من صفحة إلى أخرى، فسيتعين عليك الانتظار حتى يُفعّل الحدثdeviceready مرة أخرى قبل أن تستطيع استخدام الإضافات.

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

إليك بعض الأمثلة عن مكتبات SPA التي يمكنك استخدامها في تطبيقات كوردوفا:

• AngularJS
• EmberJS
• Backbone
• Kendo UI
• ReactJS
• Sencha Touch
• Vue
• Onsen UI

وغيرها كثير.

اعتبارات متعلقة بالأداء

في هذا القسم، سنتكلم عن بعض الأساليب المُتبعة لتحسين أداء تطبيقاتك:

النقر مقابل اللمس (Click versus Touch)

الكثير من الأجهزة تفرض تاخيرُا على النقرات يقارب 300 ميلي ثانية للتمييز بين الحدث touch والحدث hold. وهذا قد يبطئ تطبيقك ويجعله غير متجاوب. تجنب هذا التأخير هو أحد أفضل أساليب تحسين الأداء. لمعرفة المزيد عن مشكلة التأخير، راجع هذا المقال على مدونة جوجل.

لم تعد معظم إصدارات Android تفرض هذا التأخير، لكن منصة iOS لا تزال تفعل ذلك افتراضيا. في منصة iOS، يمكنك التخلص من هذا التأخير عبر استخدام WkWebView بدلاً من UIWebView الافتراضي. وفي Android و iOS، يجب عليك التأكد من أن يكون للوسم الوصفي للعارضعلى الأقل width=device-width، وإلا فسيظل التأخير باقيا. إذا كنت بحاجة إلى دعم أجهزة قديمة (Android 4.4 أو iOS 8) ، فيمكنك استخدام FastClick، أو استخدام touchstart و touchend بدلاً من click.

تحويلات CSS مقابل التعديل على DOM

استخدام تحويلات CSS المُسرّعة (accelerated CSS transitions) للأجهزة أفضل بكثير من استخدام JavaScript لإنشاء الرسوميات (animations). انظر في قائمة الموارد في نهاية هذا القسم للاطلاع على أمثلة.

بطء الشبكة (Networks Suck)

قد لا تكون الشبكات سيئة دائمًا، ولكن زمن الانتظار في شبكات الجوّال، مهما كانت جيدة، أسوأ بكثير مما تعتقد. فتطبيق على سطح المكتب يعمل على إفراغ 500 صف من بيانات JSON كل 30 ثانية، سيكون بطيئا جدًّا على جهاز الجوّال، كما سيستنزف البطارية. ضع في اعتبارك أنَّ لتطبيقات كوردوفا عدة طرق لحفظ البيانات في التطبيق (مثل التخزين المحلي والواجهة البرمجية FileSystem). استخدم ذاكرة التخزين المؤقت لحفظ البيانات محليًّا، ولكن انتبه لكمية البيانات التي ترسلها ذهابًا وإيابًا. خصوصًا إن كان تطبيقك متصلًا بشبكة جوال محلية.

إليك المصادر والمراجع التالية التي يمكن أن تستفيد منها في هذا الخصوص:

• "أفضل عشرة نصائح بخصوص الأداء في PhoneGap  والتطبيقات الهجينة"
• "تطبيقات ومواقع سريعة بلغة جافاسريبت"

رصد انقطاع الاتصال (Offline) والتعامل معه

قد لا يكون تطبيقك على شبكة بطيئة وحسب، بل من الممكن أن يكون منقطعًا بالكامل عنها. يجب أن يتعامل تطبيقك مع هذا الوضع بطريقة ذكية وصحيحة. أو قد يعتقد الناس أن تطبيقك معطل. نظرًا لسهولة التعامل مع هذا الأمر (كوردوفا توفر أحداثًا ترصد حالة الاتصال [online] أو انقطاع الاتصال [offline] بشبكة الإنترنت)، فلا يوجد أي سبب على الإطلاق لئلًا يتجاوب تطبيقك بالشكل الصحيح مع حالات انقطاع الاتصال. تأكد من اختبار تطبيقك (راجع قسم الاختبار أدناه) وتأكد من اختبار كيفية تعامله مع الحالات التي يبدء فيها من حالة ثم ينتقل إلى أخرى.

لاحظ أن الحدثين online و offline، وكذلك الواجهة البرمجية للاتصال بالشبكة (Network Connection API) ليست مثالية. لذلك قد تحتاج إلى استخدام طلبية XHR للتحقق مما إن كان الجهاز متصلًا أو منقطعًا عن الإنترنت.

حاول إضافة الدعم للمسائل المتعلق بالشبكة. فمتجر Apple (وربما متاجر أخرى) سيرفض التطبيقات التي لا تعالج بشكل صحيح حالات الاتصال/الانقطاع عن الشبكة. لمزيد من المناقشات حول هذا الموضوع، راجع صفحة "هل هذا الشيء متصل؟"

إدارة الترقيات

ترقية مشاريع كوردوفا

لا يوجد أمر خاص بترقية مشاريع كوردوفا. بدلاً من ذلك ، أزل المنصة من مشروعك، ثمّ أعد إضافتها للترقية إلى أحدث إصدار:

cordova platform rm android
cordova platform add android

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

ملاحظة: قد لا تتوافق بعض الإضافات مع الإصدار الجديد من كوردوفا. في هذه الحالة حاول البحث عن إضافةٍ بديلةٍ تؤدي العمل الذي تحتاجه، وإلا فربما عليك تأخير ترقية المشروع. أو يمكنك تعديل الإضافة بحيث تعمل ضمن الإصدار الجديد، وتنشرها لمساعدة المطورين الآخرين.

ترقية الإضافات

لا توجد حاليًا آلية لترقية الإضافات المُعدّلة عبر أمرٍ واحد. بدلًا من ذلك، أزل الإضافة ثم أضفها مجددًا إلى مشروعك، وسيُثبّت الإصدار الجديد:

cordova plugin rm some-plugin
cordova plugin add some-plugin

ارجع إلى صفحة إدارة إصدارات المنصات والإضافات لمزيد من التفاصيل.

تأكد من مراجعة توثيق الإضافة المحدّثة، حيث قد تحتاج إلى تعديل شيفرتك لتعمل مع الإصدار الجديد. تأكد أيضًا من أن الإصدار الجديد من الإضافة يعمل دون مشاكل مع إصدار مشروع كوردوفا خاصتك.

اختبر تطبيقاتك على الدوام للتأكد من أن تثبيت الإضافة الجديدة لم يؤدي إلى كسر أو تعطيل شيء ما.

إن كان مشروعك يحتوي على الكثير من الإضافات التي تحتاج إلى التحديث، فيمكنك ربح الوقت بإنشاء نص برمجي shell أو رُقعة (batch script) تضيف وتزيل الإضافات عبر أمرِ واحدِ.

اختبار تطبيقات كوردوفا

يعد اختبار تطبيقاتك أمرًا بالغ الأهمية. يستخدم فريق كوردوفا أداة Jasmine، ولكن يمكنك استخدام ما يناسبك من الحلول.

الاختبار على المحاكيات مقابل الاختبار على جهاز حقيقي

من الشائع استخدام متصفحات سطح المكتب ومحاكيات برمجية (simulators) أو محاكيات عتادية (emulators) عند تطوير تطبيقات كوردوفا. لكنّ ذلك لا يُعفيك من ضرورة اختبار تطبيقك على أكبر عدد ممكن من الأجهزة الفعلية:

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

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

تنقيح تطبيقات كوردوفا

في أغلب الأحوال، التنقيح (debugging) في كوردوفا واضح ومباشر.

تنقيح تطبيقات iOS

Xcode

يمكنك استخدام بيئة التطوير Xcode لتصحيح الجانب الأصلي (native side) من تطبيقات كوردوفا في منصة iOS. تأكد من إظهار منطقة التصحيح ‎(View -> Debug Area)‎. بمجرد تشغيل التطبيق على الجهاز (أو المُحاكي)، فيمكنك مطالعة مُخرجات السجل (log output) في منطقة التصحيح. فهو المكان الذي ستُطبع فيه الأخطاء والتنبيهات. يمكنك أيضًا وضع نقاط توقف (breakpoints) داخل الشيفرات المصدرية. هذا سيسمح لك بالمرور عبر الشيفرة البرمجية سطرًا سطرًا، واستعراض حالة المتغيرات في كل خطوة. إذ يتم إظهار حالة المتغيرات في منطقة التصحيح عند كل نقطة توقف.

بمجرد تشغيل تطبيقك على الجهاز، يمكنك إظهار مفتش Safari (كما هو موضح أدناه) لتصحيح العارض وملفات JavaScript الخاصة بالتطبيق. لمزيد من التفاصيل، راجع صفحة التنقيح في Apple Support.

التنقيح عند بعد عبر مفتش Safari

باستخدام مفتش Safari ‏(Safari's web inspector‏)‏، يمكنك تصحيح أخطاء العارض و ملفات JavaScript الخاصة بتطبيقك. هذه الأداة تعمل فقط على منصات macOS.

يُستخدم متصفح Safari للاتصال بالجهاز (أو المحاكي)، إذ يربط بين أدوات المطورين الخاصة بالمتصفح وبين تطبيق كوردوفا. هكذا يمكنك الاستفادة من الخدمات التي تقدمها أدوات التطوير ، مثل فحص ومعالجة DOM، وتصحيح أخطاء JavaScript، وفحص الشبكة، ووحدة التحكم والمزيد.

مثل بيئة التطوير Xcode، يُمكِّنك مفتش Safari من تعيين نقاط توقف في شيفرة JavaScript، وعرض حالة المتغيرات عند تلك النقاط. يمكنك الاطلاع على الأخطاء والتنبيهات والرسائل المطبوعة على وحدة التحكم. ويمكنك أيضًا تشغيل أوامر JavaScript مباشرة من وحدة التحكم أثناء تشغيل التطبيق.

لتبدأ الفحص، عليك تمكينه أولاً على الجهاز من Settings > Safari > Advanced > Web Inspector. أما على على سطح المكتب ، قم بتمكين أدوات المطور من Safari > Preferences > Advanced > Show Develop menu في شريط القائمة. ستتمكن عقب ذلك من اختيار الجهاز المتصل والتطبيق الذي تريد فحصه من القائمة Develop.

التنقيح عن بعد عبر Chrome

مثل Safari، يعمل Chrome مع أندرويد فقط، ولكن يمكن استخدامه من أي منصة مكتبية. بمجرد ربط الاتصال، ستحصل على نفس أدوات المطورين (Chrome Dev) المُستخدمة مع تطبيقات سطح المكتب لأجل استخدامها مع تطبيقات الجوال. والأفضل من ذلك، أن أدوات Chrome Dev تعطيك خيار المرآة، والذي يعرض تطبيقك على محاكي هاتفي. ولكنه أكثر من مجرد معرِض، إذ يمكنك التمرير (scroll) والنقر في أدوات التطوير، وسترى التحديثات على جهاز الهاتف.

لتبدأ الفحص، عليك فتح العنوان chrome://inspect في Chrome على سطح المكتب. سترى قائمة بالأجهزة المتصلة والتطبيقات التي يمكنك فحصها. لكن من الضروري إعداد جهازك لأجل التنقيح عبر USB وإلا فلن تعمل هذه الطريقة. يمكن الاطلاع على مزيد من التفاصيل حول التصحيح عن بُعد عبر Chrome من هنا.

إن كان بإمكانك رؤية جهازك في قسم فحص الأجهزة (inspect devices section)، ولكن لم تستطع مشاهدة عارض كوردوفا، فقد تحتاج إلى إضافة android:debuggable="true"‎ إلى العقدة <application> في الملف AndroidManifest.xml.

من الممكن استخدام أدوات Chrome Dev لفحص تطبيقات iOS، من خلال خادم WebKit وسيط (WebKit proxy)‏، يمكنك زيارة صفحته على مستودع git من هنا.

خيارات أخرى

لمزيد من الأمثلة والشروحات حول نصائح التصحيح أعلاه، انتقل إلى هذا الرابط.

واجهة المستخدم

ليس من السهل على المطورين بناء تطبيقات جميلة وأنيقة بكوردوفا. العديد من الناس يختارون استخدام بيئة عمل لواجهة المستخدمين (UI framework) لتسهيل ذلك. فيما يلي قائمة مختصرة بالخيارات الممكنة:

• ionic - يملك هذا الإطار المُتميّز واجهة سطر أوامر خاصة به لمعالجة إنشاء المشاريع.
• Ratchet - مُطوّر من قبل نفس الأشخاص الذين طوروا Bootstrap.
• Kendo UI - واجهة مستخدم وإطار تطبيقات مفتوح المصدر من Telerik.
• Onsen UI - واجهة مستخدم مفتوحة المصدر للمواقع وتطبيقات كوردوفا.

• Topcoat
• ReactJS

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

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

• iOS
• Android
• Windows Phone

اعتبارات خاصة

على الرغم من أن كوردوفا تسهّل عملية التطوير العابر للمنصات، فلا تتوقع أبدًا أن تعزِلك بشكل كامل عن المنصة الأصلية. لذلك يجب أن تكون على وعي بالقيود الموجودة.

الملاحظات الخاصة بالمنصات

أثناء قراءة التوثيق، ابحث عن الأقسام التي تحدد سلوكيات أو متطلبات خاصة بمنصات معينة. إن وجدتها، فستكون ذلك في قسم بعنوان "ملاحظة خاصة بأندرويد" أو "ملاحظة خاصة بمنصة iOS "، اقرأ تلك الملاحظات بحرص، وتذكرها أثناء عملك مع كوردوفا.

تحميل المحتوى عن بعد

استدعاء دوال JavaScript (في كوردوفا) من صفحة HTML محملة عن بُعد (أي صفحة HTML غير مُخزّنة محليًا على الجهاز) ليس مدعومًا. هذا لأنَّ كوردوفا لم تُصمّم لأجل ذلك، كما لم يقم مجتمع كوردوفا باختبار هذا الإعداد. وفي حين أن هذا الأمر قد يعمل في بعض الظروف، إلا أنه غير موصى به وغير مدعوم. لأنه يطرح عدة تحديات، مثل الحفاظ على التزامن بين الأجزاء المكتوبة بلغة JavaScript والأجزاء الأصلية من كوردوفا (نظرًا لأنها موصولة بواجهات برمجية خاصة قابلة للتغيير)، إضافة إلى موثوقية المحتويات البعيدة (remote content) التي تستدعي دوال محلية أصلية (native local functions)، وكذلك احتمال الرفض من متجر التطبيقات.

عرض محتويات HTML المُحمّلة عن بعد في العارض يجب أن يحدث باستخدام InAppBrowser. فقد صُمِّم InAppBrowser بحيث يمنع شيفرات JavaScript المُنفّدة في المحتويات الخارجية من الوصول إلى الواجهة البرمجية لتطبيقات جافاسكريبت-كوردوفا للأسباب المذكورة أعلاه.

يرجى الرجوع إلى صفحة الأمن في كوردوفا.

الاستمرار قُدمًا

فيما يلي بعض الطرق التي ستساعدك على مواكبة مستجدات كوردوفا وهي:

• اشترك في مدونة كوردوفا.
• اشترك في البريد الإلكتروني للمطورين. لكن تذكر أنه ليس مجموعة دعم، ولكنه مكان مُخصص لمناقشة كل ما يتعلق بتطوير كوردوفا.

الحصول على المساعدة

الروابط التالية هي أفضل الأماكن التي يمكن أن تحصل منها على المساعدة حول كل ما يتعلق بكوردوفا:

• Slack: يعد هذا أحد أفضل الأمكنة للحصول على مساعدة من مجتمع كوردوفا، وتحصل على أجوبة لتساؤلاتك.
• StackOverflow: باستخدام الوسم Cordova، يمكنك استعراض وتصفح جميع الأسئلة المتعلقة بكوردوفا. لاحظ أن الموقع StackOverflow يحوّل تلقائيًا الوسم"Phonegap" إلى الوسم "Cordova"، وبذلك ستتمكن من الوصول إلى الأسئلة القديمة أيضًا.
• PhoneGap Google Group: هذه كانت صفحة منتدى الدعم القديم لمّا كانت كوردوفا تحمل الاسم PhoneGap صحيح أنه لا يزال هناك الكثير من مستخدمي كوردوفا الذين يترددون على هذه المجموعة، إلا أنّ مجتمع كوردوفا قد أعرب عن اهتمامه بالتركيز بشكل أكبر على استخدام StackOverflow للحصول على الدعم.
• الملتقيات: للأسف لا توجد ملتقيات محلية لكوردوفا أو PhoneGap في عالمنا العربي. لكن مع تزايد شعبية هذه المنصة نأمل أن نرى ذلك قريبًا، إلى ذلك الحين، سيكون عليك أن تكتفي بالمنتديات والمواقع المذكورة في الأعلى.
• قسم الأسئلة في أكاديمية حسوب: إن أشكل عليك شيء فاطرح أسئلتك هنا لتحصل على مساعدة مباشرة من المستقلين والمبرمجين على الأكاديمية.

انظر أيضًا

• تضمين كوردوفا في تطبيق أصيل
• إدارة إصدارات المنصات والإضافات

مصادر

• صفحة Next Steps في توثيق كوردوفا الرسمي.