چه کسی دوست ندارد برنامهای که میسازد بدون دردسر خاصی روی دستگاههای مختلف، از ساعت و گوشیهای هوشمند گرفته تا رایانههای رومیزی و حتّی تلویزیونهای هوشمند اجرا شود؟ توسعهدهندگان نرمافزار همواره به فکر تولید برنامههایی به صورت Cross-Platform بوده اند. از ابتدای پیدایش صنعت نرم افزار کارهای زیادی در این حوزه انجام گرفته است که پرداختن به آنها در حوصلهی بحث ما نیست، ولی یکی از روشهای واقعاً عملیاتی در این عرصه استفاده از وب به عنوان بستری برای تولید برنامههای Cross-Platform است.
بعد از معرّفی HTML 5 در سال ۲۰۰۸ قابلیّتهای بسیاری به وب اضافه شد. کار با ویدئو و صوت، قابلیت ایجاد پایگاه داده در سمت کاربر، قابلیت اجرای سایت به صورت کاملاً offline، کار با فایلها، دسترسی به مکان جغرافیایی کاربر، قابلیّت WebRTC برای ضبط صوت و تصویر کاربر و ارسال و دریافت آن، برنامهنویسی گرافیکی و بسیاری امکانات دیگر که در این نسخه از HTML ارائه شد توسعهدهندگان را به این فکر انداخت که برای تولید برنامهی Cross-Platform به این حوزه رو بیاورند، زیرا هر دستگاهی از ساعت و گوشی هوشمند گرفته تا رایانهی رومیزی و تلویزیون هوشمند دارای مرورگری برای باز کردن برنامههای وبی است. پس اگر برنامهای در این قالب نوشته شود عملاً در هر بستری قابل اجرا خواهد بود.
یکی از قابلیتهای HTML 5 برنامهنویسی گرافیکی بود (از طریق تگ Canvas و قابلیت WebGL) که موجب ظهور بازیهای وبی HTML5 شد. تا قبل از آن ابزاری به نام Flash به عنوان افزونهای که روی مرورگر نصب میشد برای کارهای چندرسانهای و بازیهای تحت وب مورد استفاده قرار میگرفت. چند سال بعد Flash به علّت بیخاصیت بودنش در مقایسه با HTML 5 منسوخ شد.
امّا در استفاده از خودِ وب به عنوان بستر اصلی تولید برنامههای Cross-Platform مشکلاتی وجود داشت از جمله:
- دسترسی سختتر: برنامههای وبی بهاندازهی برنامههای بومی کاربر را درگیر نمیکردند و دسترسی به آنها سختتر بود. مثلاً icon برنامهی بومی پس از نصب در صفحهی اصلی دستگاه کاربر قابل مشاهده است و در آینده با یک کلیک یا ضربه به راحتی اجرا میشود، ولی در برنامهی وبی کاربر مجبور است هر بار آدرس برنامه را در نوار آدرس مرورگر وارد کند تا اجرا شود.
- نیاز به اتّصال به اینترنت: در برنامهی بومی نیازی به اتّصال اینترنت نیست و برنامه در حالت offline هم به خوبی اجرا میشود؛ البته قابلیّت اجرای یک وبسایت به صورت offline در HTML 5 اضافه شد (این قابلیّت در قالب موضوعی به نام AppCache به HTML 5 اضافه شد، ولی در حال حاضر به دلیل روی کار آمدن فناوریهای جدیدتر منسوخ شده است)، متأسفانه هیچ وقت فرهنگ اجرای آفلاین سایتها در بین مردم جا نیفتاد، حتّی الآن که در سال ۲۰۲۱ هستیم برای کاربران نامأنوس است که در صورت عدم اتّصال اینترنت آدرس وبسایتی را در مرورگر وارد کنند و وبسایت باز شود، در حالی که این فنّاوری بیش از ۱۰سال است که وجود دارد.
- عرضهی محصول به بازار: برنامههای بومی در فروشگاههای نرمافزاری مثل Google Play، کافهبازار و مایکت قابل عرضه اند، ولی برنامههای وبی را باید در موتورهای جستجوی وب پیدا کرد.
- فرستادن اعلان (Notification) در صورت بسته بودن: برنامههای بومی میتوانستند اعلان بفرستند و حتّی در صورت بسته بودن کارهایی را در پسزمینه انجام دهند، در حالی که برنامههای وبی نمیتوانستند.
- دسترسی به قابلیّتهای خاص: برنامههای وبی به بسیاری از قابلیّتهای بومی سیستم عامل مقصد دسترسی نداشتند، یعنی برنامههای وبی نمیتوانستند به فایلهای موجود در دستگاه کاربر دسترسی پیدا کنند و فایل جدیدی ایجاد کنند، یا پیامکهای دریافتی گوشی کاربر را بخوانند و کارهایی از این دست انجام دهند.
برنامهی وبی پیشرو (PWA) یا همان Progressive Web Application وبسایتی است که میخواهد بر تمام مشکلاتی که اشاره کردیم غلبه کند! امّا تا قبل از PWA برنامهنویسان چه تمهیداتی اندیشیدند که بر این مشکلات غلبه کنند؟
در آن زمان ابزارهایی تولید شدند که کد سمت کلاینت را که به زبانهای HTML و CSS و JavaScript نوشته میشود به عنوان ورودی دریافت میکنند و خروجی بومی برای سیستم عاملهای مختلف تولید میکنند. یعنی مثلاً برای اندروید فایل apk و برای ویندوز فایل exe در اختیار ما قرار میدهند. به این روش تولید نرمافزار، روش ترکیبی یا اصطلاحاً Hybrid گفته میشود. تولید نرم افزار به صورت Hybrid همچنان رواج دارد و شرکتهای بزرگی از آن استفاده میکنند. در صورت علاقه به این موضوع به مطلب «تولید نرمافزارهای کراس پلتفرم» مراجعه کنید.
یکی از فعّالیتها در این حوزه بستر نرم افزاری کروم (Chrome App Platform) بود. از آنجایی که مرورگر Chrome تقریباً برای همهی سیستم عاملها نسخهای داده است، سازندگانش تصمیم گرفتند به همه اجازهی تولید برنامههایی مخصوص این مرورگر بدهند، این برنامهها به صورت پنجرهای مستقل از پنجرهی مرورگر بدون نمایش نوار آدرس اجرا میشد، و همانند برنامههای بومی روی دستگاه کاربر نصب میشد و به صورت Offline هم قابل اجرا بود. علاوه بر این برای این برنامهها API خوبی هم ارائه داده بودند که بتوان به قابلیّتهای بومی دسترسی داشت. سازندگان این گونه برنامهها میتوانستند آنها را در Chrome Web Store ثبت کنند.
امّا Google رسماً اعلام کرد که از سال ۲۰۲۰ اجازهی ثبت برنامهی جدیدی در Chrome App Store نمیدهد، از سال ۲۰۲۱ از برنامههای Chrome فقط در سیستم عامل Chrome OS پشتیبانی میکند و از سال ۲۰۲۲ به کلّی از این برنامهها پشتیبانی نمیکند.
دلیل نابودی Chrome App Platform چیزی نبود جز گسترش مفهوم برنامههای وبی پیشرو.
برنامه های وبی پیشرو (Progressive Web Applications)
یک برنامهی تحت وب روی همه نوع دستگاه و هر سیستم عاملی قابل اجراست، مدل امنیّتی آن کاربرمحور است، در انحصار هیچ شرکت خاصی نیست و محتوای آن در google قابل جستجو است و میتوانیم به سادگی هر محتوایی را در برنامهی وبی از طریق لینک با دیگران به اشتراک بگذاریم.
چه عواملی موجب میشود افراد به جای ایجاد برنامههای وبی به تولید برنامههای بومی یا حتّی Hybrid بیندیشند؟
برنامههای بومی قابل اتکا هستند و دارای قابلیّتهای زیادی هستند. آیکون آنها در صفحهی اصلی قرار میگیرد، بدون نیاز به اینترنت کار میکنند، به صورت مستقل قابل اجرا هستند، میتوانند فایلهای روی سیستم را بخوانند و تغییر دهند، به سختافزارهایی مثل بلوتوث و USB دسترسی داشته باشند و… در کل برنامههای بومی طوری به نظر میرسند که انگار جزئی از سیستم کاربر هستند.
برنامهی وبی پیشرو (به اختصار PWA) برنامهای است که در عین تحت وب بودن قرار است شبیه به برنامههای بومی باشد، و جایگزین آنها. PWA قرار است خوبیهای هر دو نوع برنامه را داشته باشد، هم قابلیتهای فراوان برنامههای بومی (Native) را داشته باشد و هم گسترهی مخاطبین و سادگی دسترسی و اشتراکگذاری برنامههای وبی را.
اصول سهگانه PWA
یک PWA باید «پرقابلیت»، «قابل اتکا» و «قابل نصب» باشد. با این سه اصل، PWA تجربهی کاربری مشابه برنامههای بومی خواهد داشت.
پرقابلیت (Capable)
وب امروزی بسیار پرقابلیت شده است، قابلیت چت ویدئویی با کمک WebRTC، شناسایی مکان جغرافیای کاربر از طریق GPS و ارسال Notification از سمت سرور (که اصطلاحا به آن Push Notification گفته میشود) و برنامهنویسی گرافیکی با WebGL و قابلیت نصب برنامهی وبی از قابلیتهایی است که چندین سال است در وب وجود دارند. حتّی با استفاده از فناوری WebAssembly میتوان کتابخانههایی را که به زبانهای دیگر مثل C، C و Rust نوشته شده است را در برنامهی وبی مورد استفاده قرار داد. مثلا وبسایت Squoosh.app از همین فناوری برای فشردهسازی تصاویر استفاده میکند.
اگرچه هنوز هم قابلیتهایی هستند که به وب اضافه نشده اند، ولی روز به روز قابلیتهای وب اضافه میشود و کمبودها جبران میشود، گوگل در قالب پروژهای تحت عنوان Fugu مدّتهاست روی این موضوع کار میکند تا وب از نظر قابلیتها کمبود نداشته باشد. بعدها دربارهی این پروژه بیشتر بحث خواهیم کرد.
در وبسایت //whatwebcando.today میتوانید لیستی از قابلیتهایی که امروزه در وب وجود دارد را مشاهده کنید.
قابل اتکا (Reliable)
یک PWA باید با هر جور اینترنتی سریع و روان کار کند.
اگر سرعت بارگذاری صفحهی وب از ۱ تا ۱۰ ثانیه تغییر کند، احتمال اینکه کاربر صفحه را ترک کند ۱۲۳درصد افزایش مییابد. بحث سرعت یک برنامهی وبی تنها به بارگذاری صفحه ختم نمیشود، بلکه در ادامهی کار نیز (مثلاً با کلیک روی یک دکمه) کاربر باید سرعت را حس کند، کاربر نباید در هنگام اسکرول صفحه یا مشاهدهی انیمیشنهای صفحه احساس کند بودن داشته باشد. بعداً در مبحث کارایی در این مورد بیشتر صحبت خواهیم کرد.
غیر از سرعت، برنامه باید بتواند بدون نیاز به اینترنت هم اجرا شود. کاربر انتظار دارد آخرین محتوایی را که داشته با آن کار میکرده ببیند. حتّی اگر اتّصال به سرور ضروری باشد و در شرایطی ممکن نباشد، کاربر باید پیغام خطایی مناسب با این وضعیّت مشاهده کند، نه اینکه بدون هیچ پیغام خاصی همهچیز خراب شود و برنامه از کار بیفتد.
قابل نصب (Installable)
یک برنامهی وبی پیشروی نصب شده در پنجرهای مستقل از مرورگر باز میشود. آیکون آن در صفحهی اصلی قابل مشاهده است، در بین سایر برنامههای بومی نصبشده روی سیستم قابل جستجو است و مانند آنها با سیستم عامل یکپارچه دیده میشود.
علاوه بر این PWA نصبشده دارای قابلیتهای منحصربهفردی نیز هست. مثلاً میتوان PWA را به عنوان نرم افزار پیشفرض برای باز کردن فلان نوع فایل قرار داد، یا اینکه محتوایی را که در سایر برنامههای بومی دیده میشود در آن به اشتراک گذاشت (مثلاً وقتی کاربر در پیامرسان خود محتوایی را share میکند، PWA نصبشده را هم به عنوان یکی از جاهایی که میتواند محتوا را برایش بفرستد میبیند).
وقتی PWA به صورت مستقل از مرورگر باز شود، کاربر جور دیگری دربارهی آن فکر میکند!
به صورت کلی میتوان گفت برنامهی وبی پیشرو فقط یک برنامهی وبی عادی است که از Progressive enhancement استفاده میکند، به این معنا که از قابلیتهای جدید وب که در مرورگرهای جدید وجود دارد استفاده میکند، ولی مرورگرهای قدیمیتر را نیز در نظر میگیرد که برای کاربری که بروز نیست غیر قابل استفاده نباشد (هرچند این کاربر خیلی از قابلیتها را از دست خواهد داد). علاوه بر آن با استفاده از Service Worker و Web App Manifest که در آینده در موردشان بیشتر صحبت میکنیم «قابل اتکا» و «قابل نصب» هم میشود.
تأثیر برنامههای وبی پیشرو در بازار محصول
متخصّصان Google در پژوهشهایی الگوهای جالبی از رفتار کاربران کشف کردند:
- کاربران از وجود تأخیر در برنامههای تلفن همراه و غیرقابل اتّکا بودن برنامه بیزارند. تا حدّی که طبق تحقیقات میزان استرس واردشده به کاربران در این شرایط با استرسی که در زمان مشاهدهی فیلمی ترسناک به ایشان وارد میشود قابل مقایسه است.
- نیمی از کاربران گوشیهای هوشمند ترجیح میدهند از وبسایت یک فروشگاه یا شرکتی که دارای برنامهی بومی هست استفاده کنند، زیرا نمیخواهند برنامهای را بارگیری کنند.
- یکی از مهمترین دلایل حذف نصب برنامههای بومی در تلفن همراه کمبود حافظه است (این در حالیست که PWAهای نصبشده کمتر از ۱ مگابایت حافظهی دستگاه کاربر را اشغال میکنند).
- احتمال اینکه کاربران گوشیهای هوشمند از وبسایتهایی خریداری کنند که در آینده پیشنهادات مرتبطی در مورد محصولات ارائه میدهند بیشتر است، علاوه بر این ۸۵درصد کاربران گوشیهای هوشمند قابلیّت اعلان را مفید میدانند.
این پژوهش نشان داد که کاربران انتظار دارند وبسایتی که بازدید میکنند سریع باشد، قابل نصب باشد، قابل اتّکا باشد و نیز بازمشغولی ایجاد کند. اینها همان ارکان PWA است.
حتّی اگر PWA را به عنوان روشی برای تولید برنامههای Cross Platform نیاز نداشته باشیم و فقط یک بستر خاص را هدف گرفته باشیم، باز هم برنامههای بومی مشکلاتی جدی دارند که PWA میتواند بر آنها چیره شود:
- محدودیت فضا: ممکن است نصب برنامهی بومی جدید به معنای حذف نصب سایر برنامهها یا خالی کردن فضای دستگاه به نوعی دیگر، مثلاً از طریق حذف محتوایی ارزشمند باشد. این موضوع مخصوصاً برای کاربرانی که از گوشیهای هوشمند ضعیفتری استفاده میکنند قابل قبول نیست.
- پهنای باند موجود: بارگیری برنامهی بومی جدید هزینهبردار و زمانبر است، مخصوصاً برای کاربرانی سرعت اینترنتشان پایین است یا هزینهی زیادی برای اینترنت میپردازند.
- فرسایشی شدن: خارج شدن از وبسایت برای بارگیری برنامهی بومی در حین یک فرآیند، آن را تأخیر میاندازد و کاربرِ کمحوصله را از ادامهی کار منصرف میکند، در حالی که چنین کاری مستقیماً از طریق وب هم قابل انجام بود.
- بروزرسانی: ایجاد تغییرات در برنامههای بومی و انتشار نسخهی جدید زمانبر است، زیرا بازارچههای نرمافزاری دوباره برنامه را بازنگری میکنند تا تأیید کنند. علاوه بر آن بسیاری از کاربران به محض انتشار نسخهی جدید برنامههای بومی خود را بروز نمیکنند، و تا مدّتها از همان نسخههای قدیمی استفاده میکنند. این مسأله سرعت تغییرات و کارهای آزمایشی مثل آزمون A/B را کاهش میدهد.
علاوه بر مزایای برنامههای بومی، PWA دارای مزایای برنامههای وبی هم هست که بسیار ارزشمند است. مثلاً محتوای PWA توسّط موتورهای جستجوی وب قابل Index است و در نتایج جستجوی این موتورها پیدا میشود، PWA همیشه بروز است و سازندهی آن همواره مطمئن است که کاربرانش از آخرین نسخه استفاده میکنند و در کل دارای مشکلاتی که کمی بالاتر در مورد برنامههای بومی اشاره کردیم نیست.