FullStack Developer
آینده وب اپلیکیشن ها با PWA
ایجاد نرم افزارهای تحت وبی که در حالت آفلاین هم امکان استفاده از آن میسر است و فارغ از اینکه دستگاهی که کاربر از آن استفاده می کند چیست تجربه ای شبیه نرم افزارهای native را برای او فراهم می کند.
این ایده اصلی توسعه رویکرد Progressive Web Application یا به اختصار PWA است. همانطور که اشاره شد PWA یا اپلیکیشن های پیش رونده تنها یک رویکرد و روش هست و نه زبان برنامه نویسی یا فریمورک.
اصطلاح progressive web application اولین بار توسط فرانس بری من و الکس راسل از مهندسان گوگل سال 2015 مطرح شد.
این مدل از نرم افزار ها با استفاده از ویژگی های جدید مرورگرها مثل استفاده آفلاین و دسترسی به منابع سخت افزاری مثل دوربین ، ارسال ناتیفیکیشن تجربه ای مانند یک اپلیکیشن native را برای کاربر ایجاد می کنند و به این ترتیب دست توسعه دهندگان را در پیاده سازی سریع تر وب اپلیکیشن ها و سرویس ها باز می کند.
بسیاری از فریمورک های مطرح جاوا اسکریپتی مثل Vue ، React ، Angular نیز به شکل ساده و راحتی امکان استفاده از PWA را فراهم کرده اند.
بیایید نگاهی به ویژگی های Progressive Web Application ها داشته باشیم:
1- به تدریج و کم کم (progressive)
در شکل سنتی وب اپلیکیشن ها ، مرورگر تمام محتوای صفحه را یکجا دانلود و رندر می کند ، اما در PWA محتوا متناسب با تعاملی که کاربر با آن دارد ، به تدریج دانلود و cache می شود و این ویژگی اثر قابل توجه ای در افزایش سرعت و پرفرومنس دارد و نامگذاری این تکنولوژی به progressive هم به همین دلیل بوده است.
2-استقلال از شبکه
یکی از دغدغه هایی که همیشه همراه وب اپلیکیشن ها بوده و هست مشکلاتی مثل کندی ، قطعی و اختلالات زیاد در کانکشن است که بعضا در سناریو ها و پروژه هایی باید عطای یک اپ آنلاین را به لقای ببخشیم! اما قابلیت دسترسی و استفاده آفلاین راه کار مناسبی برای این حل این مشکلات هست.
این قابلیت از طریق service workers که کتابخانه ای تحت جاوا اسکریپت هست و با اجرا شدن در یک thread مستقل در پس زمینه مرورگر و ذخیره سازی اطلاعات امکان استفاده آفلاین از نرم افزار را فراهم می کند.
3-واکنشگرا، دسترس پذیر
مهم نیست دستگاهی که کاربر از آن استفاده می کند چه باشد، لپتاپ، موبایل، ساعت هوشمند و... در همه دستگاه ها امکان بهره مندی از نرم افزار مهیاست و این نکته بسیار مهمی در دسترس پذیری نرم افزار در کنار کاهش هزینه های توسعه است.
یکی از مشکلاتی که در سال های اخیر به دغدغه توسعه دهندگان برای ایجاد نسخه های native اضافه شده ارائه نرم افزار روی پلتفرم های مختلف اندروید ، IOS و دستگاه های ریز و درشت از ساعت هوشمند تا موبایل و تبلت و تلویزیون و .... که روز به روز هم به تعداد و تنوع این دستگاه ها اضافه می شود و پشتیبانی از همه این ها باعث افزایش هزینه های تولید، افزایش زمان توسعه و هزینه های نگهداری می شود، اما در رویکرد جدید بدون اینکه تغییر زیادی نیاز باشد یکبار می نویسید و روی همه پلتفرم ها اجرا می کنید.
وب اپلیکیشن ها چیزی بیش از یک سری فایل HTML ، CSS ، JS و Media نیستند. وقتی درخواستی برای باز شدن یک وبسایت از طریق مروگر ارسال می کنید دیتا از طریق مرورگر دانلود می شود و بعد از رندر شدن نمایش داده می شود اما اگر اینترنت قطع باشد با خطای عدم دسترسی به شبکه مواجه خواهید شد و امکان استفاده از آن را نخواهید داشت.
در PWA از طریق یک اسکریپت Javascript به نام service worker دیتا بعد از دریافت و رندر شدن cache می شود و حتی در صورت قطعی اینترنت باز هم امکان کار با وب اپلیکیشن را خواهید داشت. حتی در پس زمینه شما event هایی مثل ناتیفیکیشن ها را دریافت خواهید کرد.
اگر دیجی کالا و اینستاگرام را با موبایل باز کنید نسخه PWA را خواهید دید و از طریق Add to Home Screen با اضافه کردن به لیست اپلیکیشن های گوشی امکان استفاده سریع از آنها را خواهید شد.
وبسایت زیر نمونه ای از یک PWA هست که فقط در حالت آفلاین کار می کند برای دیدن این دمو باید ارتباط اینترنتی خود را قطع کنید.
https://whentheinternetisdown.com
مطلبی دیگر از این انتشارات
آنچه از html یاد گرفتم :)
مطلبی دیگر از این انتشارات
چگونه در سال ۱۳۹۷ یک برنامهنویس Front End عالی باشیم؟
مطلبی دیگر از این انتشارات
قهرمانی به نام Nodejs (قسمت اول)