در سال های اخیر، وب اپلیکیشن پیشرو(PWA) طرفداران زیادی در بین توسعه دهندگان پیدا کرده است. اما ممکن است از خود بپرسید که وب اپلیکیشن پیشرو PWA چیست و چه ویژگی هایی آن را محبوب کرده است.
با کمک PWA، کاربران می توانند برنامه تحت وب را همانطور که با یک برنامه تعامل دارند نصب و استفاده کنند. در واقع این فناوری به کاربران اجازه می دهد تا تجربه ای مشابه برنامه های معمولی ایجاد کنند. توجه داشته باشید که امروزه در صورت تمایل می توانید وب اپلیکیشن پیشرو را در اپ استورها نیز منتشر کنید.
اما وب اپلیکیشن سایت هایی هستند که به گونهای بهبود یافتهاند که در پلتفرمهای پشتیبانیکننده خود مانند اپلیکیشن های معمولی رفتار کنند و در سایر مرورگرها مانند سایت های معمولی عمل کنند. در واقع PWA را باید انقلابی در دنیای فناوری دانست.
بد نیست اشاره کنیم که شرکت های بزرگی مانند گوگل و مایکروسافت در حال پیوستن به جنبش اپلیکیشن های وب هستند و هیچ نشانه ای از کنار گذاشتن این فناوری دیده نمی شود. در این مقاله به هر آنچه باید درباره وب اپلیکیشن های پیش رونده (PWA) بدانید پرداخته ایم.
بنابراین، اگر می خواهید با این فناوری انقلابی آشنا شوید، توصیه می کنیم این مقاله را با دقت مطالعه کنید.
وب اپلیکیشن پیشرونده یا PWA چیست؟
شاید ساده ترین پاسخ به این سوال که وب اپلیکیشن پیشرونده چیست این باشد که این اصطلاح به سایتی اشاره می شود که ظاهر و رفتاری شبیه به یک اپلیکیشن موبایل دارد. این فناوری به گونه ای ایجاد شده است که کاربران بتوانند از ویژگی های دستگاه های تلفن همراه لذت ببرند تا دیگر نیازی به استفاده از فروشگاه های نرم افزار، خرید یا دانلود نرم افزار در دستگاه های خود نداشته باشند. برخلاف نرم افزارهای معمولی، کاربران از موتورهای جستجو برای دسترسی به اپلیکیشنها استفاده می کنند.
فناوری PWA نیاز شرکت های تجارت الکترونیک را برای ایجاد و توسعه اپلیکیشن های کاربردی برای چندین سیستم عامل تلفن همراه بی نیاز می کند. محتوای وب اپلیکیشن ها مانند ویدیو های یوتیوب، به صورت پیشرونده دانلود میشوند. بنابراین، کاربران نسبت به وب سایت های سنتی که از طراحی واکنشی استفاده می کنند، تجربه بهتری کسب می کنند.
در اینجا باید این نکته را به پاسخ وب اپلیکیشن پیشرو PWA چیست اضافه کنیم که این فناوری قصد دارد تفاوت بین اپلیکیشنهای معمولی و وب موبایل را کم رنگ کند. برای این منظور، بسیاری از مزایای اپلیکیشنهای موبایل به مرورگرها منتقل می شود. در وب اپلیکیشن، از فناوری های استاندارد استفاده می کنند و در یک ظرف امن و مخصوصی قابل دسترسی از طریق اینترنت اجرا می شوند. آنها از اعلانهای لحظهای وب، قابلیت استفاده آفلاین و دسترسی به صفحه نمایش اصلی برای کار کردن مانند اپلیکیشنهای معمولی موبایل بهره میبرند.
فناوری استفاده شده در ساخت وب اپلیکیشن (Progressive Web Apps)
حقیقت این است که پاسخ دادن به نحوه ساخت وب اپلیکیشن PWA آسان نیست. باید بگوییم که اپلیکیشن های تحت وب تنها با یک تکنولوژی ساخته نمی شوند. همانطور که قبلاً اشاره کردیم، این یک انقلاب فناوری است، به این معنی که ما با فلسفه جدیدی از ساخت اپلیکیشن های وب که از سیستم ها، API ها و سایر ویژگی های خود پیروی می کنند، سر و کار داریم.
هنگامی که با یک PWA روبرو می شوید، ممکن است در ابتدا نتوانید آن را از سایر وب اپلیکیشنها تشخیص دهید. یک اپلیکیشن ساز زمانی پیشرونده در نظر گرفته می شود که از معیارهای خاصی پیروی کند یا بتواند وظایف خاصی را انجام دهد. به عنوان مثال می توان به استفاده خودکار، نصب، تنظیم آسان، امکان ارسال نوتیفیکیشن های آنی (فشار اعلان، push notificatiob) و … اشاره کرد.
در پاسخ به وب اپلیکیشن پیشرو PWA چیست، باید توجه داشته باشید که دو رویکرد برای رندر کردن سایت ها وجود دارد، یعنی رندرینگ سمت سرور (SSR) و رندرینگ سمت مشتری (CSR). اما نتایج بهتر زمانی حاصل می شود که SSR و CSR با هم ادغام شوند. شما می توانید سایت خود را در سمت سرور رندر کنید، محتوای آن را ذخیرهسازی کنید و سپس رندرینگ خود را در سمت مشتری به روز کنید. بنابراین بارگذاری اولیه صفحه به دلیل SSR سریعتر است و گردش در بین صفحات نیز تسهیل می شود زیرا مشتری مجبور است صفحه تغییر یافته را دوباره ارائه دهد.
اما وب اپلیکیشن چیست؟ شما می توانید این فناوری را با استفاده از هر رویکردی بسازید، اما به یاد داشته باشید که برخی از رویکردها بهتر از رقبا عمل می کنند. به عنوان مثال، می توان گفت که محبوب ترین رویکرد همان مفهوم app shell است که SSR و CSR را دقیقاً همانطور که توضیح دادیم، با یکدیگر ادغام می کند. توجه داشته باشید که معمولا برای نوشتن این برنامه ها از زبان های HTML، CSS و جاوا اسکریپت استفاده می شود.
استفاده از وب اپلیکیشن یا PWA چه ویژگی هایی دارد؟
وب اپلیکیشن پیشرو دارای چندین ویژگی است که آن را از وب سنتی و برنامه های موبایل معمولی متمایز می کند. در این بخش از پاسخ به وب اپلیکیشن پیشرو چیست، برخی از این ویژگی ها را فهرست می کنیم:
واکنشپذیری کامل و سازگاری با مرورگر
این اپلیکیشن ها مطابق اصول ارتقای پیشرونده ساخته می شود. بهینه سازی پیش رونده یکی از استراتژی های طراحی وب سایت است که قابلیت ها و محتوای اولیه را در اختیار همه جستجوگران قرار می دهد. بر اساس این استراتژی، مهم نیست که کاربران از چه مرورگری استفاده می کنند یا اتصال اینترنتی آنها در هنگام رندر کردن نسخه های پیچیده صفحات چقدر است.
سازگار با همه مرورگرها و هر وسیلهای، صرف نظر از اندازه صفحه نمایش یا سایر ویژگی ها سازگار است. بنابراین، کاربران تبلت یا موبایل نیز همین تجربه را خواهند داشت. در صورت تمایل می توانید این برنامه ها را روی دسکتاپ خود نصب کنید.
استقلال از اتصال به اینترنت
این یکی از ویژگی های مفیدی است که در پلتفرم PWA یا وب اپلیکیشن های پیشرو نباید فراموش کنیم. اپلیکیشن های وب تنها در دسترس نیستند و از شبکه های اینترنتی ضعیف استفاده می کنند. اما می تواند به صورت آفلاین نیز کار کند. به این ترتیب کار آنها مستقل از اینترنت امکان پذیر خواهد بود.
اصول طراحی رابط کاربری مشابه اپلیکیشنهای معمولی
این اپلیکیشن ها از اپلیکیشن های معمولی تقلید می کنند. به این ترتیب با محیطی آشنا و مشابه روبرو خواهید شد.
اعلانهای لحظهای
اگر پوش نوتیفیکیشن به عنوان بخشی از استراتژی پیامرسانی مناسب استفاده شوند، ، مشتریان به آن علاقهمند خواهند شد و انگیزهای برای استفاده از اپلیکیشن خواهند داشت.
بهروزرسانی خودکار
اپلیکیشن وبها می توانند خود را به طور خودکار به روز کنند، بنابراین همیشه به روز خواهند بود.
ایمنی
این اپلیکیشن ها از طریق HTTPS اجرا می شوند، بنابراین کاربران احراز هویت نمی توانند به محتوای آنها دسترسی داشته باشند.
قابلیت دسترسی و نصب آسان
درست است که موتورهای جستجو PWA ها را به عنوان اپلیکیشن طبقه بندی می کنند، اما معمولاً نمی توانید آنها را از طریق فروشگاه های نرمافزار پیدا کنید. در عوض، میتوانید به سادگی از طریق یک URL به وب اپلیکیشن مورد نظر خود دسترسی داشته باشید. نصب این اپلیکیشن ها نیز یک فرآیند ساده است که شامل باز کردن یک وب سایت و افزودن آن به صفحه نمایش وسیله الکترونیکی شما می شود.
در این قسمت از پاسخ به سوال وب اپلیکیشن پیشرو PWA چیست باید اشاره کنیم که این اپلیکیشن ها کارایی خود را از اپلیکیشن های معمولی موبایل و وب می گیرند. آنها می توانند سریعتر کار کنند و بدون توجه به سیستم عامل و وسیله الکترونیکی عملکرد بهتری ارائه دهند. با ویژگی های ذکر شده در این بخش، PWA ها نیز می توانند تجربه کاربری را به میزان قابل توجهی بهبود بخشند.
معایب استفاده از وب اپلیکیشن پیشرو PWA
وب اپلیکیشن ها علیرغم تمام ویژگی های مفیدی که دارند، معایبی نیز دارند در این بخش که توضیح می دهیم تکنولوژی پیشرو یا PWA چیست، به سه مورد از معایب آن اشاره می کنیم.
سازگاری با iOS
از وقتی که iOS 11.3تولید شده امکان اجرای وب اپلیکیشن در دستگاه های اپل وجود داشته است، اما این فناوری با نسخه های قدیمی سیستم عامل این شرکت سازگار نیست. علاوه بر این، اپل به PWA ها اجازه دسترسی به بسیاری از ویژگی های مهم مانند Touch ID، Face ID، ARKit، بلوتوث، سریال، Beacons را نمی دهد.
مشکلات وسایل موروثی (Legacy Devices)
تنها چند سال از تولید اولین وب اپلیکیشن می گذرد، بنابراین جای تعجب نیست که موبایلهای قدیمی که فقط مرورگرهای وب قدیمی دارند، به خوبی از آنها پشتیبانی نمی کنند. اگرچه این مشکل به مرور زمان حل خواهد شد، با این وجود ممکن است یکی از دلایل شکایت کاربران از بسیاری از شرکت ها باشد.
PWA ها هیچ وظیفه ای را برای شما انجام نمی دهند
اگر PWA ها را با اپلیکیشنهای وب سنتی مقایسه کنید، خواهید دید که در برخی موارد نمی توانند تمام وظایف یک اپلیکیشن موبایل را انجام دهند. از سوی دیگر، این فناوری ها معمولا با استفاده از زبان برنامه نویسی جاوا اسکریپت نوشته می شوند که باتری بیشتری مصرف می کند.
تفاوت وب اپلیکیشن با نرم افزار iOS، اندروید و ویندوزی چیست؟
در این قسمت از پاسخ به سوال وب اپلیکیشن پیشرو چیست، آن را با اپلیکیشن های معمولی سیستم عامل های مختلف از دید کاربر مقایسه می کنیم. به این ترتیب می توانید این فناوری جدید را از دیدگاه کاربر در نظر بگیرید.
وب اپلیکیشن پیشرو به آسانی نصب می شود
تعداد دانلود اپلیکیشن ها روز به روز در حال کاهش است. به این دلیل که کاربران ابتدا باید اپلیکیشن مورد نظر خود را در فروشگاه پیدا کنند و قصد خود را برای نصب آن تایید کنند. پس از آن باید منتظر بمانید تا مراحل دانلود و نصب کامل شود. در نهایت، باید به برنامه مجوزهای مختلفی بدهید تا فقط یک یا دو بار از آن استفاده شود.
اما برای دسترسی به وب اپلیکیشنهای پیشرونده نیازی به فروشگاه برنامه یا نصب ندارید. شما به سادگی می توانید برنامه را در مرورگر خود راه اندازی کنید و آن را به صفحه اصلی خود اضافه کنید.
هر دو عملکرد خوبی دارند، اما اپلیکیشنهای معمولی عملکرد بهتری دارند
وقتی PWA ها را با وب سایت های موبایل مقایسه می کنیم، متوجه می شویم که آنها سریعتر بارگذاری می شوند. به علاوه، وقتی این اپلیکیشنها را به صفحه نمایش اصلی خود اضافه می کنید، می توانید به سرعت آنها را بارگیری کرده و به صورت آفلاین از آنها استفاده کنید. با این حال، کدهای محلی (native codes) سریعتر هستند و یک اپلیکیشن معمولی قدرتمندتر است.
اپلیکیشنهای معمولی وظایف بیشتری را انجام میدهند
در قسمت های قبل، پاسخ پلتفرم PWA یا وب اپلیکیشن های پیشرو چیست، اشاره کردیم که این فناوری به سرعت در حال توسعه است. اما باید اضافه کنیم که عملکرد PWA ها نیز با محدودیت هایی مواجه است. برای مثال، پوش نوتیفیکیشن یا ژئوفنسینگ (Geofencing) ممکن است محدودیتهایی برای این برنامهها باشد.
به طور کلی باید بگوییم که وب اپلیکیشنهای پیشرو در طول سال ها جایگاه بسیار مطلوبی در صنعت IT به دست آورده اند. با این حال، پیشرفت در این زمینه ادامه دارد و کار بیشتری لازم است تا بتوان به نوعی با اپلیکیشنهای معمولی در یک سطح قرار گیرند.
نمونه وب اپلیکیشنهای موفق
نباید فراموش کنیم که بسیاری از شرکت های بزرگ و موفق از برنامه های تحت وب سود زیادی برده اند. . در این بخش، شما را با تعدادی از نمونه PWAهای موفق آشنا میکنیم.
وب اپلیکیشن STARBUCKS
استارباکس اولین اپلیکیشن سفارش بین المللی است که برای موبایل طراحی شده است. اما هدف نهایی این شرکت، دسترسی به بازارهای موجود و نوظهور، استارباکس را وادار کرد تا در سیاست خود تجدید نظر کند. بنابراین اپلیکیشن خود را در PWA توسعه دادند و به این ترتیب تعداد کاربران فعال را دو برابر کردند.
وب اپلیکیشن UBER
Uber نمونه دیگری از یک اپلیکیشن معمولی است که بعداً به PWA تبدیل شد. این تغییر به دلیل نیاز شرکت به ارائه دسترسی برای همه بدون توجه به اتصال به اینترنت و نوع دستگاه الکترونیکی ایجاد شد. بنابراین امروزه برنامه وب اوبر روی اینترنت 2G و سرعت مناسب به خوبی کار می کند. به این ترتیب، آنها توانستند اپلیکیشنی را طراحی کنند که نه تنها نیازی به دانلود نداشت، بلکه تنها در 3 ثانیه بارگذاری شد.
وب اپلیکیشن PINTEREST
با تبدیل اپلیکیشن به PWA، این شرکت توانست از مزایایی مانند افزایش 60 درصدی جذابیت سایت، افزایش 44 درصدی درآمد تبلیغات کاربر و افزایش 40 درصدی حفظ کاربر در سایت برخوردار شود.
از دیگر وب اپلیکیشنهای موفق می توان به Forbes PWA و Twitter Lite PWA اشاره کرد.
جمع بندی
طراحی اپلیکیشن موبایل و PWA دو موضوع مرتبط با یکدیگر هستند. PWAها میتوانند از بسیاری از اصول طراحی اپلیکیشن موبایل استفاده کنند. با این حال، PWAها باید طوری طراحی شوند که از مزایای منحصر به فرد خود مانند عدم نیاز به نصب و کار آفلاین استفاده کنند
امروزه بسیاری از افراد از خود میپرسند که وب اپلیکیشن پیشرو چیست و چه کاربردی دارد. در واقع PWA انقلابی در حوزه فناوری است که تغییرات زیادی در تولید نرم افزارهای موبایل ایجاد کرده است. در این مقاله جدای از پاسخ به این سوال که PWA چیست، به کاربرد، مزایا و معایب آن از جنبه های مختلف پرداخته ایم. اکنون که با این اصطلاح آشنا شدید، می توانید نیازهای خود را ارزیابی کرده و برنامه خود را برای استفاده از این فناوری تنظیم کنید.
6 دیدگاه در “وب اپلیکیشن پیشرو PWA چیست و چه کاربردی دارد؟”
سلام خدا قوت . اگه میشه در مورد وب اپلیکیشن بیشتر مطلب داخل سایتتون بزارین . همینطور در مورد تفاوت وب اپلیکیشن با اپلیکیشن . من هنوز درک درستی از تفاوت این دو پیدا نکردم . من یه کارگاه تولید لوازم یکبارمصرف دارم ولی نمیدونم واسه شروع بهتره وب اپلیکیشن بسازم یا خود اپلیکیشن رو . ممنون میشم اگه در این زمینه راهنماییم کنید .
درود علیرضا جان.
ببین به صورت عملکردی خیلی تفاوتی ندارن. فقط اپلیکیشن ها نیاز به نصب شدن روی دستگاه دارن اما وب اپلیکیشن ها مثل وب سایت هستن و با آدرس اینترنتی بهشون دسترسی داری. غیر از این تفاوتی ندارن.
برا کار شما فکر میکنم وب اپلیکیشن مناسب تر باشه. البته اگر در آینده خواستی اپلیکیشن هم داشته باشی نیاز یبه کار اضافه نداره و با یک کلیک میتونی اپلیکیشن رو هم در کنار وب اپ داشته باشی.
سلام خسته نباشید . من یه کافه دارم و میخوام یه نرم افزار واسه کافم داشته باشم که داخل اون انواع منو ها به همراه قیمت و سفارش مشتری بتونم انجام بدم . اما یسری از اطرافیان بهم پیشنهاد دادن که برای شروع از وب اپلیکیشن شروع کنم . اگر امکانش هست در مورد طراحی و ساخت وب اپلیکیشن راهنماییم کنید که چجوری و از کجا باید شروع کنم . ممنونم از شما
درود وحید جان
برای کار شما دقیقا یک نمونه اپلیکیشن آماده داریم که منو رو در خودش داره و برای سفارش و ثبت لوکیشن سفارش دهنده روی نقشه هم میشه ازش استفاده کرد.
خیلی نیاز به کار سختی نداره. فقط کافیه داخل افزونه فروشگاه لیست آیتم های منو و قیمتشون رو وارد کنی و درگاه پرداخت رو وصل کنی.
اگر خواسته باشی همکاران طراحیمون میتونن براتون اپ رو اختصاصی دیزاین کنن و کاراش رو انجام بدن و در نهایت دوهفته ای اپ رو کامل تحویل بگیری.
این نمونه از پیش آماده هست ولی کاملا قابل تغییره
https://app.puzzley.net/m/cafe.
سلام وقت بخیر ممنونم از مقاله خوب و مفیدتون . من یه سوال داشتم . من یه سایت دارم در زمینه فروش محصولات ارگانیک . میخواستم نرم افزار اندرویدیش رو هم داشته باشم . اما نمیدونم از کجا و چجوری باید اینکارو انجام بدم . ممنون میشم اگه راهنماییم کنید که چجوری بتونم واسه فروشگاهم یه اپلیکیشن اندرویدی هم طراحی کنم .
درود جواد عزیز
برای اینکه بتونین اپلیکیشن هم داشته باشید به صورت کلی 2 راه دارین. اگر مخیواید اپلیکیشن به سایتتون متصل باشه باید یا به صورت اختصاصی براتون کد نویسی بشه و یا هم اگر از سیستم های مدیریت محتوای آماده مثل وردپرس استفاده میکنین به دنبال افزونه یا سرویسی باشید که بتونه فروشگاهتون رو به اپلیکیشن متصل بکنه. معمولا برخی از اپلیکیشن سازها افزونه اتصال به ووکامرس رو دارند ولی باید حواستون باشه که این افزونه ها ممکنه از ادان های وکامرس پشتیبانی نکنند و یا با اضافه کردن افزونه های جدید دچار اختلال بشن.
راه حل دومتون این هست که اپ رو به صورت جدا از سایتتون داشته باشید و کنترل موجودی و قیمت هارو به صورت دستی انجام بدید. البته که هزینه کمتری داره و برای شروع کار در مقیاس پایین بهتره.