PWA چیست؟ آینده طراحی وب

PWA چیست؟ سوالی که شاید چندین و چندبار دیده باشید اما آشنایی کافی را با آن ندارید در این مقاله این تکنولوژی جدید رو کامل مورد بررسی قرار میدیم. در جهان دو سوم جمعیت از طریق تلفن های همراه به یکدیگر متصل می شوند. حضور پررنگ موبایل برای هر شخص و شرکتی که بخواهد مورد توجه قرار بگیرد امری ضروری است. سوال اساسی این است که چگونه می توانید کاربران تلفن های همراه و دکستاپ را مانند وب سایت های responsive بدون توسعه و نگهداری اپلیکیشن های مجزا برای android و ios مورد هدف قرار دهید؟ در سال های اخیر بسیاری از توسعه دنده گان متقاعد شده اند که PWA یا همان Progressive Web Apps بهترین راه کار برای رسیدن به این هدف است.
PWA چیست؟
عبارت Progressive web app در سال ۲۰۱۵ ابدا شد. اساسا PWA یک اپلیکیشن مشابه وب سایت است که از ترکیب بهترین فناوری های وب و محیط بومی استفاده می کند. به صورت کلی از سه بخش زیر تشکیل شده است :
Website :
Pwa اساسا در هسته خود کم و بیش وب سایت های هستند که با HTML, CSS و جاوااسکریپت نوشته شده اند. زیرا pwa منحصرا به جاوااسکریپت برای ایجاد یک تعامل متکی است و دیگر شما نیازی به نصب محیط توسعه مجزا برای ساخت آن ها را ندارید و تمامی مرورگرهای پیشرفته از آن ها پشتیبانی می کنند.
Web manifest :
PWA ها با یک فایل JSON ارائه می شوند که به مرورگر وب و دستگاه اطلاع می دهد که با یک PWA و نه یک وب سایت معمولی سر و کار دارند. پرونده JSON شامل نام PWA ، نماد ، توضیحات و اطلاعاتی در مورد دسترسی مورد نیاز دستگاه برای کارکرد صحیح از جمله موارد دیگر است.
Service worker :
PWA ها برای ایجاد پایه فنی برای کارایی که معمولاً فقط با برنامه های تلفن همراه بومی همراه هستند ، مانند اعلان ها ، تجربیات آفلاین و همگام سازی دوره ای پس زمینه ، از یک اسکریپت JavaScript استفاده می کنند که به صورت مستقل از خود وب سایت در پس زمینه اجرا می شود.
توسعه دهنده گان وب گوگل و ماکروسافت در رابطه با Progressive web app این نظریه را دارند که این ساختار یک تکامل طبیعی در نحوه توزیع و مصرف نرم افزار است و از آنجایی که مبتنی بر فناوری های وب است پس از هر سیستم عامل و یا محیط توسعه مستقل می باشد.
آیا PWA آینده طراحی رسپانسیو است ؟
نزدیک به دو دهه است که (اولین وب سایت طراحی شده به صورت رسپانسیو توسط آئودی در حدود سال 2002 منتشر شده است) ، توسعه دهندگان وب به رویکرد طراحی وب رسپانسیو پایبند هستند تا وب سایت ها را به خوبی در دستگاه های دارای صفحه نمایش بزرگ و کوچک بدون نیاز به نگهداری نسخه مخصوص موبایل از همان وب سایت نمایش دهند. مشکل در طراحی وب رسپانسیو این است که به اندازه کافی برای انتظارات کاربران از دستگاه های مختلف با اندازه های مختلف پنجره یا صفحه نمایش برآورده نمی کند، به همین دلیل بسیاری از طراحان وب اکنون می پرسند ، “آیا PWA آینده رسپانسیو است؟ به طور خاص ، طراحی وب رسپانسیو هنگام مشاهده در هر دستگاهی ، از پیشرفت های تدریجی برای ارائه ویژگی های بومی استفاده نمی کند. PWA با استفاده از Service workers این مشکل را حل می کنند ، علاوه بر پاسخگویی ، مجموعه ای از ملاحظات اساسی طراحی را ایجاد می کنند که همه توسعه دهندگان و طراحان وب باید در ذهن داشته باشند:
Dealing with change :
جنبه مترقی PWA به این معنی است که در بازدیدهای بعدی (یا حتی در زمان واقعی) قابلیت های بیشتری در دسترس است و کاربران باید با استفاده از اعلان های وضعیت و سایر روش ها ، از همه تغییرات به درستی مطلع شوند.
Push notifications :
یکی از ویژگی های اصلی PWA نوتیفیکیشن است. توانایی نوتیفیکیشن برای افزایش تعامل کاربر در این مرحله کاملاً مستند است ، اما در صورت عدم مدیریت صحیح ، نوتیفیکیشن نیز می توانند کاربران را سردرگم کنند.
Different states :
PWA ها باید با در نظر گرفتن حالت های مختلف طراحی شوند و به همان اندازه آنلاین و آفلاین کار کنند. سایر بخش ها شامل مشکلات شبکه ، بارگیری مجدد محتوا یا بارگیری محتوا جز موارد جزئی است.
Perceived performance :
در بازارهای در حال توسعه مانند هند، که بیشتر افراد از طریق دستگاه های سطح پایین به وب دسترسی پیدا می کنند ، استفاده از صفحه هایی در حال بارگذاری و انیمیشن های انتقالی مهم است تا به کاربران اطلاع دهید که در حال پیشرفت هستند و بنابراین عملکرد قابل درک را بهبود می بخشند.
Accessibillity :
ناگفته نماند که PWA ها باید از دستورالعمل های دسترسی به محتوای وب WCAG پیروی کنند، که نحوه دسترسی بیشتر به محتوای وب را برای افراد معلول تعریف می کند.
بسیاری از شرکت های بزرگ ، از جمله توییتر و علی بابا ، از قبل پاسخ این سوال را می دانند ، “آیا PWA آینده طراحی وب است؟” آنها از PWA در استراتژی های دیجیتالی خود استفاده می کنند و از مزایای این فصل بعدی طراحی وب بهره می برند.
Twitter Lite Progressive Web App به غول رسانه های اجتماعی این امکان را می دهد تا با ارائه سریعتر ، قابل اطمینان تر و جذاب تر شدن تجربه وب تلفن همراه ، 65 درصد افزایش صفحات در هر جلسه ، 75 درصد افزایش توییت های ارسالی و 20 درصد کاهش نرخ پرش را بدست آورند.
نیکولاس گالاگر ، سرپرست مهندسی Twitter Lite می گوید: “Twitter Lite اکنون سریعترین ، کم هزینه ترین و مطمئن ترین روش برای استفاده از Twitter است.” “برنامه وب رقابت با عملکرد برنامه های بومی ما دارد اما در مقایسه با Twitter برای Android به کمتر از 3٪ فضای ذخیره سازی دستگاه نیاز دارد.
AliExpress ، خدمات خرده فروشی آنلاین Alibaba ، گزارش داد که زمان صرف شده در هر جلسه پس از انتشار PWA خود به طور متوسط 74٪ در تمام مرورگرها افزایش یافته است ، در حالی که کاربران اکنون دو برابر صفحات هر جلسه را مشاهده می کنند. وقتی Alibaba برای سیستم عامل تجارت B2B خود PWA منتشر کرد، همین اتفاق رخ داد، که نشان می دهد مزایای PW به بازار محدود نمی شود.
نتیجه گیری :
تا به اینجای مقاله احتمالا متوجه پاسخ این سوال که PWA چیست؟ شده اید. PWA آینده طراحی وب است، به توسعه دهندگان برنامه های وب این امکان را می دهد تا تجارب کاربری را ایجاد کنندکه دامنه وب و عملکرد برنامه های بومی را داشته باشد. همانند هر فناوری جدید، با ملاحظات اساسی طراحی خاص خود همراه هستند، اما مزایای فراوان آن را به جایگاه مناسبی برای سرمایه گذاری تبدیل می کند.
اپلیکیشن های پیشرفته وب یا PWA چیست؟
منبع:
مطالب زیر را حتما مطالعه کنید
چگونه از ماژول های نیتیو Android و IOS در React Native استفاده کنیم؟
تفاوت توسعه برنامه های android و ios
بهترین زبان های برنامه نویسی برای هوش مصنوعی
تفاوت زبان های برنامه نویسی و اسکریپت نویسی
تفاوت for in و for of
بهترین فریمورک های UI برای استفاده در 2021
2 دیدگاه
به گفتگوی ما بپیوندید و دیدگاه خود را با ما در میان بگذارید.
سلام
ممنون از پست جالبتون
این طور که من تحقیق کردم برای ران کردن یه برنامه pwa نیاز هستش که حتما روی یک دامین با ssl certificate برنامه قرار بگیره. ( هر چند مطمئن نیستم )
از طرفی از طریق سایتی که ابتدای دامینش https باشه نمیشه با استفاده از وب سرویس روی api های http درخواست داد. اگه درخواست بدیم با خطای mixed content روی مرورگر مواجه میشیم.
من میخوام از طریق اپلیکیشن pwa طراحی شده توسط خودم، موجود روی دامین https، به یک وب سرویس که فقط http رو پشتیبانی میکنه درخواست بدم .
راه حلش چیه ؟
سلام
فکر نمیکنم همچین راه حلی وجود داشته باشه البته شایدم من ندیدم تا حالا
ولی جمله ای که من دیدن اینه : HTTPS is a core requirement for running a PWA.