PWA (تطبيق الويب التقدمي) لمواقع WordPress – بدون تشفير

PWA (تطبيق الويب التقدمي) هو تحول هائل أحدث موجات عملاقة عبر عالم التكنولوجيا

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

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

في هذا المنشور ، سأقدم لك ملخصًا سريعًا وسهلاً لـ PWA حتى تتمكن من بدء عملية التعلم دون الشعور بالإرهاق.

ما هو PWA؟

باختصار ، PWA هي الويب … فقط بطريقة أفضل.

يستخدم تطبيق الويب التقدمي (PWA) إمكانات الويب الحديثة لتقديم تجارب شبيهة بالتطبيقات للمستخدمين. لتحقيق ذلك ، يجب أن تفي PWAs بمتطلبات معينة (انظر أدناه) ، ويتم نشرها على الخوادم ، وفهرستها بواسطة محركات البحث ، ويمكن الوصول إليها من خلال عناوين URL.

ما هو المطلوب لـ PWA؟

• يحتاج موقع WordPress الخاص بك إلى تأمين HTTPS.
• يجب أن يكون موقع WordPress الخاص بك سريع الاستجابة – يعمل بشكل جيد باستمرار على الهاتف المحمول وسطح المكتب والجهاز اللوحي.
• يجب أن يحتوي موقع WordPress الخاص بك على عنوان URL فريد لكل صفحة بداخله.

PWAs – من الماركات الشهيرة؟

بصرف النظر عن Apple و Microsoft و Google الذين يضيفون دعم PWA داخل متصفحاتهم ، لكن تعمل العديد من الشركات على تكوين مواقع WordPress الخاصة بهم لتكون صديقة لـ PWA. في ما يلي عدد قليل من العلامات التجارية الرئيسية التي تم تمكين PWA الآن:

• خرائط جوجل ( maps.google.com )
• Tinder ( tinder.com )
• Instagram ( Instagram.com )
• بينتيريست ( pinterest.com )
• Twitter Lite ( lite.twitter.com )
• أوبر ( m.uber.com )
• Lyft ( ride.lyft.com )
• ستاربكس (الولايات المتحدة) ( starbucks.com )

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

بالإضافة إلى المواقع المذكورة أعلاه ، إليك بعض مواقع الويب الأكثر شيوعًا التي تدعم PWA:

• علي بابا
• متوسط
• Flipboard
• سنابديل
• تريفاجو
• قناة الطقس
• الأوقات المالية
• Pokedex.org
• مستكشف جيثب
• فليبكارت
• ويكيبيديا غير متصل
• فوربس

كيف يمكنك إنشاء PWA لموقع WordPress الخاص بك؟

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

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

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

في هذا المنشور ، لكن سنناقش خمسة من أكثرها شيوعًا للنظر فيها.

الآن ، قبل أن نبدأ الحديث عن المكونات الإضافية ، لكن يرجى تأكيد أن لديك HTTPS. للتكرار ، HTTPS هي تقنية مطلوبة لتعمل PWAs.

في ما يلي إضافات PWAs التي ستحول موقع WordPress الخاص بك بجهد ضئيل أو معدوم:

1. تطبيقات الويب التقدمية الفائقة

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

• التقييمات – 5
• التثبيت النشط – 20000 +
• آخر تحديث – منذ شهرين
• تم الاختبار حتى – 5.1.1

2. WordPress التدريجي (PWA)

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

• التقييمات – 5
• التثبيت النشط – 1000 +
• آخر تحديث – منذ 3 أشهر
• تم الاختبار حتى – 5.0.4

3. WP-AppKit

الميزة الرئيسية لـ WP-AppKit هي أنه يدعم PWA المستندة إلى JavaScript ، بالإضافة إلى سمات التطبيق. يوفر المكون الإضافي نسختين افتراضيتين شقيقتين – أحدهما لنظام iOS والآخر لنظام Android. لكن يمكن تثبيتها مباشرة مع البرنامج المساعد. باستخدام هذه السمات ، يمكنك إنشاء تطبيقات يمكن الوصول إليها كمواقع ويب ، والتي يمكن تثبيتها والوصول إليها بشكل مشابه لتطبيق الهاتف المحمول التقليدي.

• التقييمات – 4
• التثبيت النشط – 1000 +
• آخر تحديث – منذ 3 أشهر
• تم الاختبار حتى – 5.0.4

4. PWA

يعمل هذا المكون الإضافي كمنصة لتنفيذ الدعم في WordPress بهدف اقتراحه للدمج الأساسي ، قطعة تلو الأخرى. يهدف البرنامج المساعد PWA هذا إلى تزويد النظام الأساسي الخاص بك بآليات الأساس والتنسيق لتجنب “إعادة اختراع العجلة” والتعارض مع بعضها البعض.

• التقييمات – 4
• التثبيت النشط – 10000 +
• آخر تحديث – منذ 3 أسابيع
• تم اختباره حتى 5.2

5. WordPress Mobile Pack

يعمل هذا المكون الإضافي كمنصة لتنفيذ الدعم في WordPress بهدف اقتراحه للدمج الأساسي ، قطعة تلو الأخرى. يهدف البرنامج المساعد PWA هذا إلى تزويد النظام الأساسي الخاص بك بآليات الأساس والتنسيق لتجنب “إعادة اختراع العجلة” والتعارض مع بعضها البعض.

• التقييمات – 3.5
• التثبيت النشط – 10000 +
• آخر تحديث – منذ 8 أشهر
• تم الاختبار حتى 4.9.10

إيجابيات وسلبيات PWA

الايجابيات:

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

سلبيات:

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

الاختيار الواقع:

عند فحص مفهوم الدعم عبر المتصفحات ، يدعم متصفح Chrome و Opera و Samsung Android PWA.

ومع ذلك ، فإن Internet Explorer و Edge و Safari لا يوسعون دعمهم حتى كتابة هذه السطور.

تغليف

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

إذا كنت تأمل في تطوير PWA احترافي لموقع عملك على الويب دون استخدام أي مكونات إضافية ، فافعل لنفسك معروفًا وقم بتعيين شركة PWA Development.

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