প্রোগ্রেসিভ ওয়েব অ্যাপ কী এবং কীভাবে ইনস্টল করবেন?

অ্যাপগুলো আপনার ফোনে প্রভাবশালী। দীর্ঘদিন ধরে, অ্যাপগুলো আপনার ডেস্কটপ বা ব্রাউজারে একইভাবে প্রভাব ফেলত না। যা Последние বছরে পরিবর্তন হয়েছে। প্রোগ্রেসিভ ওয়েব অ্যাপস (PWA) কদाचিত আরো উন্নত হচ্ছে এবং সকল ধরনের ওয়েবসাইটের সাথে আমাদের ইন্টারঅ্যাকশন পরিবর্তন করছে।

কিন্তু প্রোগ্রেসিভ ওয়েব অ্যাপ আসলেই কী? একটি PWA একটি ওয়েবসাইটের চেয়ে কী করে যা একটি ওয়েবসাইট করে না? প্রোগ্রেসিভ ওয়েব অ্যাপ সম্পর্কে যা জানতে হবে সেটি এখানে।

প্রোগ্রেসিভ ওয়েব অ্যাপ কী?

প্রোগ্রেসিভ ওয়েব অ্যাপস হল ওয়েব অ্যাপ্লিকেশন যা ব্যবহারকারীদের একটি রেগুলার সাইট অফার করে কিন্তু একটি নেটিভ মোবাইল অ্যাপের মত দেখায়। PWAs একটি নেটিভ মোবাইল অ্যাপের ব্যবহারযোগ্যতা আধুনিক ব্রাউজার ফিচার সেটে আনতে চেষ্টা করে, উভয় ডেভেলপমেন্ট ক্ষেত্রের অগ্রগতির পুরা সুবিধা নেয়।

তাহলে একটি PWA কী কী সংজ্ঞায়িত করে?

• Universal: একটি PWA প্রতিটি ব্যবহারকারীর জন্য seamless (প্রায়) কাজ করতে হবে, তাদের ব্রাউজার যেকোনো হোক।
• Responsive: PWAs যেকোনো ডিভাইসের সাথে কাজ করা উচিত, যেন আপনার ল্যাপটপ, ট্যাবলেট, স্মার্টফোন, ইত্যাদি।
• Design: ডিজাইনটি নেটিভ মোবাইল অ্যাপের অনুকরণ করা উচিত, মানে সুস্পষ্ট, খুব সহজে খুঁজে পাওয়া মেনু, উন্নত ফিচার জন্য সিম্পল ইন্টারঅ্যাক্টিভিটি সহ।
• Safe: PWAs ব্যবহারকারীর ডেটা নিরাপদ রাখতে HTTPS ব্যবহার করা উচিত।
• Discoverable: ব্যবহারকারীরা PWAs খুঁজে পেতে পারেন, এবং সেগুলো সহজে একটি অ্যাপ্লিকেশন হিসেবে চিহ্নিত করা যায় (একটি "সাইট" বরং)।
• Engagement: একটি PWA-র নেটিভ এনগেজমেন্ট ফিচারের মতো পুশ নোটিফিকেশনের অ্যাক্সেস থাকতে হবে।
• Updates: PWAs আপ টু ডেট থাকে, একটি সার্ভিস বা সাইটের লেটেস্ট ভার্শন সার্ভ করে।
• Installation: ব্যবহারকারীদের সহজে PWA টি তাদের হোম স্ক্রিনে "ইনস্টল" করার অনুমতি দেয় অ্যাপ স্টোর ছাড়া।
• Sharing: PWAs শুধু একটি URL দিয়ে শেয়ার করা যায়, কোনো ইনস্টলেশন ছাড়া।

আপনি দেখতে পাচ্ছেন, PWAs লক্ষ্য করে ব্যবহারকারীদের একটি পূর্ণ ওয়েবসাইট অভিজ্ঞতা দিতে নেটিভ অ্যাপের স্ট্রিমলাইনড ফিচার এবং ইন্টারফেস ডিজাইন সহ।

প্রোগ্রেসিভ ওয়েব অ্যাপ কীভাবে কাজ করে?

প্রোগ্রেসিভ ওয়েব অ্যাপের কী হল ব্রাউজার সার্ভিস ওয়ার্কার।

একটি সার্ভিস ওয়ার্কার হল একটি স্ক্রিপ্ট যা আপনার ব্রাউজারের ব্যাকগ্রাউন্ডে চলে, "একটি ওয়েব পেজ থেকে আলাদা, এমন ফিচারের দরোয়াজা খুলে যা একটি ওয়েব পেজ বা ব্যবহারকারীর ইন্টারঅ্যাকশনের প্রয়োজন নেই।" আপনি এই মুহূর্তে সার্ভিস ওয়ার্কার ব্যবহার করতে পারেন পুশ নোটিফিকেশন এবং ব্যাকগ্রাউন্ড সিঙ্কের মত, কিন্তু ತ্বরা PWA ভবিষ্যত এই স্ক্রিপ্টগুলোর অধিক ক্ষমতা দেয়।

যেহেতু, সার্ভিস ওয়ার্কার PWA স্ট্যান্ডার্ডের ফাউন্ডেশন গঠন করে, ওয়েব ক্যাশ ব্যবহার করে প্রায় ইনস্ট্যান্ট রেজাল্টের জন্য।

সার্ভিস ওয়ার্কারের আগে, ব্রাউজার ক্যাশ স্ক্রিপ্টের go-to ছিল অ্যাপ্লিকেশন ক্যাশ (অথবা App Cache)। App Cache ওয়াইড রেঞ্জ অফলাইন-ফার্স্ট সার্ভিসে ফিচার করা হতেও, কিন্তু কিছুটা এরর-প্রোন ছিল।而且, App Cache-এর কিছু সুপরিচিত সীমাবদ্ধতা রয়েছে, যেমন A List Apart ব্যাখ্যা করেছে।

কিন্তু ডেভেলপারদের জন্য মূল সমস্যা হল AppCache কীভাবে কাজ করে সেটির সাথে সরাসরি ইন্টারঅ্যাকশনের অভাব, যা ডেভেলপারদের উত্থান হওয়া সমস্যা সঠিকভাবে ফিক্স করতে বাধা দেয়। ফলস্বরূপ, পূর্ণ অফলাইন ফাংশন্যালিটিওয়ালা ওয়েবসাইট এবং সার্ভিসগুলো রিস্কি পছন্দ ছিল।

সার্ভিস ওয়ার্কারগুলো, তবে, কেবল ততক্ষণই থাকে যতক্ষণ তাদের অ্যাকশনের প্রয়োজন। একটি PWA-তে, আপনি কিছু ক্লিক করলে বা একটি ফিচার ব্যবহার করলে, একটি সার্ভিস ওয়ার্কার acción-এ আসে। সার্ভিস ওয়ার্কার (মনে রাখবেন, এটি একটি স্ক্রিপ্ট) ইভেন্টটি প্রসেস করে, সিদ্ধান্ত নেয় অফলাইন ক্যাশটি কি রিকোয়েস্টটি পূরণ করতে পারে। ধারণা হল PWA-র জন্য একাধিক অফলাইন ক্যাশ রয়েছে যাদের থেকে বেছে নেওয়া যায়, যা অফলাইন ফাংশন্যালিটির একটি অনেক وسیচার রেঞ্জ দেয়।

অতিরিক্তভাবে, ক্যাশটি শুধু অফলাইন স্পিড বুস্টের জন্য নয়। উদাহরণস্বরূপ, আপনি একটি PWA-তে যান, কিন্তু আপনার কানেকশন খুব খারাপ। সার্ভিস ওয়ার্কার একটি পূর্বের ক্যাশ সার্ভ করে, পূর্ণ-ফাংশনিং, আপনার অভিজ্ঞতা বাধা দিয়ে না।

প্রোগ্রেসিভ ওয়েব অ্যাপ ব্রাউজার সাপোর্ট

প্রোগ্রেসিভ ওয়েব অ্যাপ ব্যবহার করার জন্য দুটি প্রয়োজনীয়তা: একটি কম্প্যাটিবল ব্রাউজার এবং একটি PWA-এনাবল্ড সার্ভিস।

প্রথমে, ব্রাউজারগুলো দেখি। PWA ব্রাউজার সাপোর্ট চেক করার আপনার দুটি অপশন রয়েছে। প্রথমটি হল জেক আর্চিবল্ডের Is Service Worker Ready? যা হ্যান্ডিলি प्रमुख ব্রাউজারগুলো প্লাস Samsung Internet-এর PWA-রেডি স্ট্যাটাস দেখায়।

PWA ব্রাউজার সাপোর্টের আরও বিস্তারিত ওভারভিউতে, আপনাকে Can I Use চেক আউট করা উচিত, একটি ওয়েবসাইট যা বিভিন্ন ওয়েব এবং ব্রাউজার টেকনোলজির ইমপ্লিমেন্টেশন ব্রাউজার ভার্শন অনুযায়ী লিস্ট করার উপর স্পেশালাইজড। উদাহরণস্বরূপ, আপনি সার্চ বারে "service workers" ইনপুট করলে, আপনি একটি টেবিল পাবেন যা প্রতিটি ব্রাউজারের কোন ভার্শনে PWA সার্ভিস ওয়ার্কার ইমপ্লিমেন্ট করেছে সেটি দেখাবে।

Can I Use Service Workers টেবিল নিশ্চিত করে যে प्रमुख ব্রাউজারগুলো সব PWAs সাপোর্ট করে। এছাড়া এটি কিছু অল্টারনেটিভ ডেস্কটপ ব্রাউজার এবং মোবাইল ব্রাউজারের PWA সাপোর্ট ইলাস্ট্রেট করে।

এটি কিছুটা ব্রেক ডাউন করলে:

• ডেস্কটপ ব্রাউজার (Full Support): Chrome, Firefox, Opera, Edge, Safari
• ডেস্কটপ ব্রাউজার (Partial Support/Outdated Version): QQ Browser, Baidu Browser
• মোবাইল ব্রাউজার (Full Support): Chrome, Firefox, Safari, UC Browser, Samsung Internet, Mint Browser, Wechat
• মোবাইল ব্রাউজার (Partial Support/Outdated Version): QQ Browser, Android Browser, Opera Mobile

তাহলে, প্রধান ব্রাউজারগুলো সব PWAs সাপোর্ট করে। Microsoft Edge এবং Safari হল সাম্প্রতিক ফুল সাপোর্ট লিস্টে যোগ হওয়া। বিপরীতে, QQ Browser এবং Baidu Browser আউটডেটেড ভার্শন ব্যবহার করতেই দ্বিতীয় তলায় পড়েছে।

প্রোগ্রেসিভ ওয়েব অ্যাপ খুঁজে বের করার এবং ইনস্টল করার উপায়

এখন আপনি জানেন কোন ব্রাউজার ব্যবহার করতে হবে, আপনি PWA খুঁজে বের করার এবং ইনস্টল করার কথা চিন্তা করতে পারেন। এই উদাহরণে, আমি একটি Samsung Galaxy S8 ব্যবহার করছি Google Chrome-র সাথে।

প্রোগ্রেসিভ ওয়েব অ্যাপস সব জায়গায় রয়েছে। অনেক কোম্পানির সাইট এবং সার্ভিস PWA ভার্শন অফার করার জন্য অ্যাডাপ্ট করেছে। অনেক ক্ষেত্রে, আপনি প্রথমবার একটি PWA সম্মুখীন হবেন যখন আপনি কোনো সার্ভিসের হোমপেজ বা মোবাইল সাইটে যাবেন, যা Add to Home Screen ডায়ালগ বক্স ট্রিগার করে।

নিচের ভিডিও চেক আউট করুন টুইটার মোবাইল সাইট ভিজিট করলে কী হয় সেটি দেখতে।

অনেক সাইট ভিজিট করে হোম স্ক্রিন ট্রিগার দেখার আশা করা সত্যিকারের উপযোগী নয়। বরং, এটি সম্পূর্ণ টাইম-কনসামিং। সৌভাগ্যবশত, আপনাকে সেটি করতে হবে না কারণ PWAs ক্যাটালগ করার জন্য কিছু ডেডিকেটেড সাইট রয়েছে।

প্রথমে, outweb চেষ্টা করুন। এটি PWAs-এর একটি прили ডিসেন্ট রেঞ্জ লিস্ট করে, নতুন অপশনগুলো প্রায়শই যোগ হয়। তারপর, pwa.rocks চেষ্টা করুন। এতে একটি ছোট সিলেকশন রয়েছে, কিন্তু কিছু হ্যান্ডি PWA যা আপনি আপনার ডিভাইসে যোগ করতে চাইবেন।

অতিরিক্তভাবে, জানুয়ারি ২০১৯-এ, অ্যান্ড্রয়েডের জন্য Chrome 72 Trusted Web Activity (TWA) নিয়ে এলো। TWA Chrome ট্যাবগুলোর স্ট্যান্ডঅ্যালোন মোডে খোলার অনুমতি দেয়। এর ফলস্বরূপ, PWAs গুগল প্লে অ্যাপ স্টোরে ফিচার হতে পারে। গুগল প্লেতে প্রদর্শিত হয়ে যাওয়া প্রথম কিছু PWA ছিল Twitter Lite, Instagram Lite, এবং Google Maps Go, আরো অনেক আসবে সময়ের সাথে সাথে।

কি প্রোগ্রেসিভ ওয়েব অ্যাপস নেটিভ অ্যাপসকে প্রতিস্থাপন করবে?

প্রোগ্রেসিভ ওয়েব অ্যাপস আপনার ব্রাউজার এবং একটি নেটিভ মোবাইল অ্যাপের মাঝপথে একটি চমৎকার হাইব্রিড ধাপ। কি PWAs সম্পূর্ণভাবে নেটিভ অ্যাপসকে প্রতিস্থাপন করবে? আমার দিক থেকে কঠোর "না"। PWAs একটি লাইটওয়েট অফারিং হিসেবে চমৎকার, কিন্তু যেহেতু তারা বর্তমানে প্রায়শই বিদ্যমান সাইট এবং সার্ভিস রেপ্লিকেট করার ওপর ফোকাস করে, তারা নেটিভ অ্যাপসকে প্রতিস্থাপন করবে না।

কমপক্ষে, ফিলহাল পর্যন্ত।

PWAs কাজ করে। PWA Stats-এ উপলব্ধ ডেটা এটাকেও সাপোর্ট করে। এখানে কিছু আকর্ষণীয় নম্বর যা ইলাস্ট্রেট করে PWAs কীভাবে সাধারণত ব্যবহৃত ওয়েবসাইটের সাথে আমাদের ইন্টারঅ্যাকশন পরিবর্তন করছে:

• Trivago তাদের PWA হোম স্ক্রিনে যোগ করে ব্যবহারকারীদের জন্য ১৫০% এনগেজমেন্ট বৃদ্ধি পেয়েছে।
• Forbes-এর PWA "হোমপেজ সম্পূর্ণ লোড হয় কেবল ০.৮ সেকেন্ডে," যখন ইমপ্রেশন পর ভিজিট ১০% বেড়েছে। Forbes-এর PWA-এ ইউজার সেশন দৈর্ঘ্যও ডবল হয়েছে।
• Twitter Lite-এ পেজ পার সেশন ৬৫% বৃদ্ধি পেয়েছে, এবং টুইটে বড় ৭৫% বৃদ্ধি। এটি ৩জিতে "৫ সেকেন্ডের কমে ইন্টারঅ্যাক্টিভ"।
• Alibaba-এ মোবাইল কনভার্সনে ৭৬% বৃদ্ধি পেয়েছে।

PWAs এখনো মেইনস্ট্রিম হয়নি। কিন্তু যেহেতু তারা যে বিশাল পরিধির সুবিধা প্রদান করে, যেন আপনার ডিভাইসে জায়গা বাঁচানো, আপনি ভবিষ্যতে তাদের ওপর আরও শুনবেন।