সম্প্রতি প্রোগ্রেসিভ ওয়েব অ্যাপ সম্পর্কে অনেক আলোচনা হয়েছে। এগুলি এখনও তুলনামূলকভাবে নতুন মডেল, তবে এর নীতিগুলি ভ্যানিলা JS, React, Polymer, Angular বা অন্য কোনও ফ্রেমওয়ার্কের সাহায্যে তৈরি অ্যাপগুলিকে সমানভাবে উন্নত করতে পারে। এই পোস্টে, আমি কিছু বিকল্পের সারসংক্ষেপ করব এবং আপনার নিজস্ব প্রোগ্রেসিভ ওয়েব অ্যাপ আজই শুরু করার জন্য রেফারেন্স অ্যাপের উল্লেখ করব।
প্রোগ্রেসিভ ওয়েব অ্যাপ কী?
মনে রাখা গুরুত্বপূর্ণ যে প্রোগ্রেসিভ ওয়েব অ্যাপ সব জায়গায় কাজ করে তবে আধুনিক ব্রাউজারে আরও ভালভাবে কাজ করে। প্রোগ্রেসিভ এনহ্যান্সমেন্ট হল মডেলের মেরুদণ্ড।
অ্যারন গুস্তাফসন প্রোগ্রেসিভ এনহ্যান্সমেন্টকে পিনাট M&M-এর সাথে তুলনা করেছেন। চিনাবাদাম হল আপনার কন্টেন্ট, চকোলেট কোটিং হল আপনার প্রেজেন্টেশন লেয়ার এবং আপনার জাভাস্ক্রিপ্ট হল হার্ড ক্যান্ডি শেল। এই লেয়ারের রঙ আলাদা হতে পারে এবং যে ব্রাউজার এটি ব্যবহার করছে তার ক্ষমতার উপর নির্ভর করে অভিজ্ঞতা আলাদা হতে পারে।
ক্যান্ডি শেলকে এমন একটি জায়গা হিসেবে ভাবুন যেখানে অনেক প্রোগ্রেসিভ ওয়েব অ্যাপ ফিচার থাকতে পারে। এগুলি হল এমন অভিজ্ঞতা যা ওয়েব ও অ্যাপের সেরা ফিচারগুলিকে একত্রিত করে। ব্রাউজার ট্যাবে প্রথমবার ভিজিট করার সময় থেকেই এগুলি ব্যবহারকারীর কাজে লাগে, ইনস্টল করার প্রয়োজন হয় না।
ব্যবহারকারী বারবার ব্যবহার করার মাধ্যমে এইসব অ্যাপের সাথে সম্পর্ক তৈরি করলে, তারা ক্যান্ডি শেলকে আরও মিষ্টি করে তোলে - স্লো নেটওয়ার্ক কানেকশনেও খুব দ্রুত লোড হয় (সার্ভিস ওয়ার্কার-এর জন্য ধন্যবাদ), প্রাসঙ্গিক পুশ বিজ্ঞপ্তি পাঠায় এবং ব্যবহারকারীর হোম স্ক্রিনে ফার্স্ট-ক্লাস আইকন থাকে যা ফুল-স্ক্রিন অ্যাপ অভিজ্ঞতা হিসেবে লোড হতে পারে। এছাড়াও, তারা স্মার্ট ওয়েব অ্যাপ ইনস্টল ব্যানার-এর সুবিধা নিতে পারে।
প্রোগ্রেসিভ ওয়েব অ্যাপ হল
- প্রোগ্রেসিভ - ব্রাউজার যাই হোক না কেন, প্রতিটি ব্যবহারকারীর জন্য কাজ করে, কারণ এগুলি প্রোগ্রেসিভ এনহ্যান্সমেন্টের মূল নীতির উপর ভিত্তি করে তৈরি করা হয়েছে।
- রেসপন্সিভ - ডেস্কটপ, মোবাইল, ট্যাবলেট বা অন্য যেকোনও ডিভাইসের স্ক্রিনের সাইজের সাথে মানানসই।
- কানেক্টিভিটি ইন্ডিপেন্ডেন্ট - অফলাইনে বা খারাপ কোয়ালিটির নেটওয়ার্কে কাজ করার জন্য সার্ভিস ওয়ার্কারের মাধ্যমে উন্নত করা হয়েছে।
- অ্যাপের মতো - অ্যাপ-স্টাইল নেভিগেশন ও ইন্টার্যাকশন প্রদান করতে অ্যাপ শেল মডেল ব্যবহার করুন।
- ফ্রেশ - সার্ভিস ওয়ার্কার আপডেট প্রসেসের জন্য সবসময় আপ-টু-ডেট থাকে।
- নিরাপদ - স্নুপিং প্রতিরোধ করতে এবং কন্টেন্ট যাতে কেউ পরিবর্তন করতে না পারে তা নিশ্চিত করতে TLS-এর মাধ্যমে পরিবেশন করা হয়।
- খুঁজে নেওয়ার যোগ্য - W3C ম্যানিফেস্ট এবং পরিষেবা কর্মীর রেজিস্ট্রেশন স্কোপের জন্য "অ্যাপ্লিকেশন" হিসেবে শনাক্ত করা যায়, যা সার্চ ইঞ্জিনকে সেগুলি খুঁজে পেতে দেয়।
- আবার এনগেজ করা - পুশ বিজ্ঞপ্তির মতো ফিচারের মাধ্যমে আবার এনগেজ করা সহজ করুন।
- ইন্সটলেবল - ব্যবহারকারীদের সবচেয়ে উপযোগী অ্যাপগুলি অ্যাপ স্টোরের ঝামেলা ছাড়াই হোম স্ক্রিনে "রাখার" অনুমতি দিন।
- লিঙ্ক করা যায় - URL-এর মাধ্যমে সহজেই শেয়ার করা যায় এবং জটিল ইনস্টলেশনের প্রয়োজন হয় না।
এছাড়াও, Android-এর জন্য Chrome-এ প্রোগ্রেসিভ ওয়েব অ্যাপ অনন্য নয়। নিচে আমরা দেখতে পাচ্ছি যে Pokedex প্রোগ্রেসিভ ওয়েব অ্যাপ Android-এর জন্য Firefox (বিটা)-এ কাজ করছে, যেখানে হোম স্ক্রিনে যোগ করা এবং সার্ভিস ওয়ার্কার ক্যাশিং ফিচার ঠিকঠাক চলছে।
এই মডেলের "প্রোগ্রেসিভ" প্রকৃতির একটি ভালো দিক হল, ব্রাউজার ভেন্ডররা তাদের জন্য আরও ভালো সহায়তা প্রদান করার সাথে সাথে ফিচারগুলি ধীরে ধীরে আনলক করা যেতে পারে। Pokedex-এর মতো প্রোগ্রেসিভ ওয়েব অ্যাপও Android-এ Opera-তে খুব ভাল কাজ করে, তবে প্রয়োগের ক্ষেত্রে কিছু উল্লেখযোগ্য পার্থক্য আছে:
প্রোগ্রেসিভ ওয়েব অ্যাপ সম্পর্কে আরও জানতে, অ্যালেক্স রাসেলের আসল ব্লগ পোস্ট পড়ুন যেখানে এই অ্যাপের ব্যাপারে বলা হয়েছে। এছাড়াও, পল কিনলান প্রোগ্রেসিভ ওয়েব অ্যাপের জন্য একটি অত্যন্ত উপযোগী Stack Overflow ট্যাগ শুরু করেছেন যা চেক করে দেখা উচিত।
নীতি
ওয়েব অ্যাপ ম্যানিফেস্ট
ম্যানিফেস্টের মাধ্যমে আপনার ওয়েব অ্যাপ ব্যবহারকারীর হোম স্ক্রিনে আরও বেশি নেটিভ-লাইক উপস্থিতি পায়। এটি অ্যাপকে ফুল-স্ক্রিন মোডে (URL বার ছাড়াই) লঞ্চ করার অনুমতি দেয়, স্ক্রিন ওরিয়েন্টেশনের উপর কন্ট্রোল প্রদান করে এবং Android-এ Chrome-এর সাম্প্রতিক ভার্সনে অ্যাড্রেস বারের জন্য স্প্ল্যাশ স্ক্রিন ও থিম কালার নির্ধারণ করার সুবিধা প্রদান করে। এছাড়াও, এটি উপরে উল্লেখ করা স্প্ল্যাশ স্ক্রিন ও হোম স্ক্রিন আইকনের জন্য ব্যবহৃত সাইজ ও ঘনত্ব অনুযায়ী আইকনের সেট নির্ধারণ করতে ব্যবহার করা হয়।
Web Starter Kit এবং Google Chrome স্যাম্পেল-এ একটি স্যাম্পেল ম্যানিফেস্ট ফাইল পাওয়া যাবে। ব্রুস লসন একটি ম্যানিফেস্ট জেনারেটর লিখেছেন এবং মুনির লামৌরি একটি সহজ ওয়েব ম্যানিফেস্ট ভ্যালিডেটর লিখেছেন যা চেক করে দেখা যেতে পারে।
আমার ব্যক্তিগত প্রোজেক্টে, ওয়েব অ্যাপ ম্যানিফেস্ট এবং iOS, ডেস্কটপ ও অন্যান্য প্ল্যাটফর্মে ব্যবহারের জন্য সঠিক সাইজের আইকন তৈরি করতে আমি realfavicongenerator-এর উপর নির্ভর করি। favicons Node মডিউলও আপনার বিল্ড প্রসেসের অংশ হিসেবে একই ধরনের আউটপুট অর্জন করতে পারে।
Chromium-ভিত্তিক ব্রাউজার (Chrome, Opera ইত্যাদি) বর্তমানে ওয়েব অ্যাপ ম্যানিফেস্ট সাপোর্ট করে, Firefox সক্রিয়ভাবে সাপোর্ট ডেভেলপ করছে এবং Edge সেগুলিকে বিবেচনাধীন হিসেবে তালিকাভুক্ত করছে। WebKit/Safari এখনও পর্যন্ত এই ফিচার প্রয়োগ করার ব্যাপারে তাদের অভিপ্রায় সম্পর্কে সর্বজনীন সিগন্যাল পোস্ট করেনি।
আরও তথ্যের জন্য, ওয়েবের মূল নীতিতে Android-এর জন্য Chrome-এ ওয়েব অ্যাপ ম্যানিফেস্ট সহ ইনস্টলযোগ্য ওয়েব অ্যাপ নিবন্ধটি পড়ুন।
"হোম স্ক্রিনে যোগ করুন" ব্যানার
Android-এ Chrome-এর হোম স্ক্রিনে আপনার সাইট যোগ করার সুবিধা এখন কিছু সময়ের জন্য রয়েছে, তবে সাম্প্রতিক ভার্সনে নেটিভ ওয়েব অ্যাপ ইনস্টল ব্যানার ব্যবহার করে সাইট যোগ করার জন্য প্রোঅ্যাক্টিভ সাজেশনও রয়েছে।
অ্যাপ ইনস্টল করার প্রম্পট দেখানোর জন্য আপনার অ্যাপকে অবশ্যই:
- সঠিক ওয়েব অ্যাপ ম্যানিফেস্ট থাকতে হবে
- HTTPS-এ খুলতে হবে (ফ্রি সার্টিফিকেটের জন্য letsencrypt দেখুন)
- সঠিক সার্ভিস ওয়ার্কার রেজিস্টার করা থাকতে হবে
- দুবার ভিজিট করতে হবে, দুটি ভিজিটের মধ্যে কমপক্ষে ৫ মিনিটের ব্যবধান থাকতে হবে
অ্যাপ ইনস্টল ব্যানার স্যাম্পেল-এর সংখ্যা উপলভ্য, যা বেসিক ব্যানার থেকে শুরু করে সম্পর্কিত অ্যাপ্লিকেশন দেখানোর মতো আরও জটিল ব্যবহারের ক্ষেত্রে কভার করে।
অফলাইন ক্যাশিংয়ের জন্য সার্ভিস ওয়ার্কার
সার্ভিস ওয়ার্কার হল একটি স্ক্রিপ্ট যা আপনার ওয়েব পেজ থেকে আলাদাভাবে ব্যাকগ্রাউন্ডে চলে। এটি ইভেন্টে সাড়া দেয়, যার মধ্যে এটি পরিবেশন করা পৃষ্ঠাগুলি থেকে করা নেটওয়ার্ক অনুরোধগুলিও অন্তর্ভুক্ত। সার্ভিস ওয়ার্কারের লাইফটাইম ইচ্ছাকৃতভাবে ছোট করা হয়েছে।
এটি কোনও ইভেন্ট পেলে চালু হয় এবং এটি প্রসেস করার জন্য যতক্ষণ প্রয়োজন ততক্ষণই চলে। সার্ভিস ওয়ার্কার আপনাকে Cache API ব্যবহার করে রিসোর্স ক্যাশে করার অনুমতি দেয় এবং ব্যবহারকারীদের অফলাইন অভিজ্ঞতা প্রদান করতে ব্যবহার করা যেতে পারে।
অফলাইন ক্যাশিংয়ের জন্য সার্ভিস ওয়ার্কার খুবই কার্যকরী, তবে আপনার সাইট বা ওয়েব অ্যাপে বারবার ভিজিট করার সময় ঝটপট লোড করার মাধ্যমে এটি পারফর্ম্যান্সের ক্ষেত্রেও উল্লেখযোগ্য উন্নতি করে। আপনি নিজের অ্যাপ্লিকেশন শেল ক্যাশে করতে পারেন যাতে এটি অফলাইনে কাজ করে এবং জাভাস্ক্রিপ্ট ব্যবহার করে এর কন্টেন্ট পপুলেট করে।
Google Chrome স্যাম্পেলে সার্ভিস ওয়ার্কার স্যাম্পেলের একটি বিস্তারিত সেট উপলভ্য আছে। জেক আর্চিবল্ডের অফলাইন কুকবুক অবশ্যই পড়া উচিত এবং আপনি যদি সার্ভিস ওয়ার্কারের ক্ষেত্রে নতুন হন, তাহলে আমি পল কিনলানের আপনার প্রথম অফলাইন ওয়েব অ্যাপ ওয়াকথ্রু পড়ে দেখার জন্য বিশেষভাবে সাজেস্ট করব।
এছাড়াও, আমাদের টিম বেশ কিছু সার্ভিস ওয়ার্কার হেল্পার ইউটিলিটি ও বিল্ড টুল ম্যানেজ করে যেগুলি সার্ভিস ওয়ার্কার সেট-আপ করার সময় ওভারহেড কমাতে সাহায্য করে। সেগুলি সার্ভিস ওয়ার্কার লাইব্রেরি-তে তালিকাভুক্ত করা আছে। দুটি প্রধান কারণ হল:
- sw-precache: একটি বিল্ড-টাইম টুল যা আপনার ওয়েব অ্যাপ শেল প্রিক্যাচ করার জন্য উপযোগী একটি সার্ভিস ওয়ার্কার স্ক্রিপ্ট তৈরি করে
- sw-toolbox: একটি লাইব্রেরি যা খুব কম ব্যবহৃত রিসোর্সের জন্য রানটাইম ক্যাশিং প্রদান করে
জেফ পসনিক sw-precache-এর উপর একটি কুইক প্রাইমার লিখেছেন যার নাম অফলাইন-ফার্স্ট, ফাস্ট, sw-precache মডিউলের সাথে এবং একই টুলের উপর একটি কোডল্যাব যা আপনার কাজে লাগতে পারে।
Chrome, Opera এবং Firefox-এ সার্ভিস ওয়ার্কারের জন্য সাপোর্ট যোগ করা হয়েছে এবং Edge-এর ক্ষেত্রেও এই ফিচারের ব্যাপারে আগ্রহের ইতিবাচক পাবলিক সিগন্যাল পাওয়া গেছে। Safari একজন ইঞ্জিনিয়ারের প্রস্তাবিত পাঁচ বছরের পরিকল্পনার মাধ্যমে এতে আগ্রহের কথা সংক্ষেপে উল্লেখ করেছে।
আবার এনগেজ করার জন্য পুশ বিজ্ঞপ্তি
কার্যকরভাবে, আপনি এমন ওয়েব অ্যাপ তৈরি করতে পারেন যা ব্যবহারকারীরা ট্যাবের বাইরেও ব্যবহার করতে পারবেন। ব্রাউজার বন্ধ করা যেতে পারে এবং আপনার অভিজ্ঞতার সাথে যুক্ত হতে তাদের আপনার ওয়েব অ্যাপ সক্রিয়ভাবে ব্যবহার করার প্রয়োজনও নেই। এই ফিচারের জন্য সার্ভিস ওয়ার্কার ও ওয়েব অ্যাপ ম্যানিফেস্ট, দুটিরই প্রয়োজন হয়, যা আগে উল্লেখ করা কিছু ফিচারের উপর ভিত্তি করে তৈরি করা হয়।
Push API, Chrome-এ প্রয়োগ করা হয়েছে, Firefox-এ ডেভেলপ করা হচ্ছে এবং Edge-এ বিবেচনা করা হচ্ছে। Safari-এর পক্ষ থেকে এই ফিচার প্রয়োগ করার ব্যাপারে এখনও কোনও সর্বজনীন সিগন্যাল পাওয়া যায়নি।
ওপেন ওয়েবে পুশ বিজ্ঞপ্তি হল ম্যাট গন্ট দ্বারা পুশ সেট-আপ করার একটি বিস্তারিত ভূমিকা এবং ওয়েবের মূল নীতিতে একটি পুশ বিজ্ঞপ্তি কোডল্যাবও উপলভ্য।
আপনি যদি ভিডিও দেখতে বেশি পছন্দ করেন, তাহলে Chrome টিমের মাইকেল ভ্যান আউওয়ারকার্কের পুশ সম্পর্কে ৬ মিনিটের একটি ইন্ট্রো ভিডিও দেখতে পারেন।
উন্নত ফিচারে লেয়ারিং
মনে রাখবেন, আপনার ওয়েব অ্যাপ দেখার জন্য যে ব্রাউজার ব্যবহার করা হচ্ছে তার উপর নির্ভর করে আপনার ব্যবহারকারীর অভিজ্ঞতা বিভিন্ন লেভেলের হতে পারে। হার্ড ক্যান্ডি শেল আপনার নিয়ন্ত্রণে আছে।
ওয়েব প্ল্যাটফর্মে আসা অতিরিক্ত ফিচার যেমন ব্যাকগ্রাউন্ড সিঙ্ক (আপনার ওয়েব অ্যাপ বন্ধ থাকলেও সার্ভারের সাথে ডেটা সিঙ্ক করার জন্য) এবং ওয়েব ব্লুটুথ (আপনার ওয়েব অ্যাপ থেকে ব্লুটুথ ডিভাইসের সাথে কথা বলার জন্য) এই পদ্ধতিতে আপনার প্রোগ্রেসিভ ওয়েব অ্যাপে লেয়ার করা যেতে পারে।
Chrome-এ ওয়ান-শট ব্যাকগ্রাউন্ড সিঙ্ক চালু করা হয়েছে এবং জ্যাক আর্চিবল্ডের কাছে তার অফলাইন উইকিপিডিয়া অ্যাপ-এর একটি ভিডিও এবং এটি কীভাবে কাজ করে তা দেখানোর জন্য নিবন্ধ আছে। আপনি যদি সেই API ব্যবহার করে দেখতে আগ্রহী হন, তাহলে François Beaufort-এর কাছেও বেশ কিছু ওয়েব ব্লুটুথ স্যাম্পেল উপলভ্য আছে।
ফ্রেমওয়ার্ক-বান্ধব
আপনি যে ফ্রেমওয়ার্ক ব্যবহার করে কোনও অ্যাপ্লিকেশন তৈরি করছেন বা আগে থেকে আছে এমন কোনও অ্যাপ্লিকেশনে উপরের নীতিগুলি প্রয়োগ করতে কোনও বাধা নেই। আপনার প্রোগ্রেসিভ ওয়েব অ্যাপ তৈরি করার সময় আরও কয়েকটি নীতি মনে রাখা উচিত, যেমন RAIL ব্যবহারকারী-কেন্দ্রিক পারফর্ম্যান্স মডেল এবং FLIP ভিত্তিক অ্যানিমেশন।
আমি আশাবাদী যে ২০১৬ সালে, আমরা প্রোগ্রেসিভ ওয়েব অ্যাপের জন্য মূল ফিচার হিসেবে অর্গানিক্যালি বেকিং-এর ক্ষেত্রে ক্রমবর্ধমান সংখ্যক বয়লারপ্লেট এবং সিড প্রোজেক্ট দেখতে পাব। ততক্ষণ পর্যন্ত, আপনার নিজের অ্যাপে এইসব ফিচার যোগ করার ক্ষেত্রে বাধা খুব বেশি নয় এবং আমার মতে, চেষ্টা করার মতো।
আর্কিটেকচার
প্রোগ্রেসিভ ওয়েব অ্যাপ মডেলে "অল-ইন" হওয়ার বিভিন্ন লেভেল আছে, তবে একটি সাধারণ পদ্ধতি হল অ্যাপ্লিকেশন শেলের চারপাশে সেগুলিকে আর্কিটেক্ট করা। এটি বাধ্যতামূলক নয়, তবে এর অনেক সুবিধা আছে।
অ্যাপ্লিকেশন শেল আর্কিটেকচার আপনার অ্যাপ্লিকেশন শেল (ইউজার ইন্টারফেস) ক্যাশে করার জন্য উৎসাহিত করে যাতে এটি অফলাইনে কাজ করে এবং জাভাস্ক্রিপ্ট ব্যবহার করে এর কন্টেন্ট পপুলেট করে। বারবার ভিজিট করার সময়, এটি আপনাকে নেটওয়ার্ক ছাড়াই স্ক্রিনে খুব দ্রুত অর্থপূর্ণ পিক্সেল পেতে দেয়, এমনকি আপনার কন্টেন্ট শেষ পর্যন্ত সেখান থেকে এলেও। এর ফলে পারফর্ম্যান্স উল্লেখযোগ্যভাবে উন্নত হয়।
জেরেমি কিথ সম্প্রতি মন্তব্য করেছেন যে এই ধরনের মডেলে সম্ভবত সার্ভার-সাইড রেন্ডারিং ফলব্যাক হিসেবে দেখা উচিত নয়, বরং ক্লায়েন্ট-সাইড রেন্ডারিং এনহ্যান্সমেন্ট হিসেবে দেখা উচিত। এটি ন্যায্য মতামত।
অ্যাপ্লিকেশন শেল মডেলে, যতটা সম্ভব সার্ভার-সাইড রেন্ডারিং ব্যবহার করা উচিত এবং ক্লায়েন্ট-সাইড প্রোগ্রেসিভ রেন্ডারিং ব্যবহার করা উচিত, ঠিক যেভাবে সার্ভিস ওয়ার্কার কাজ করলে আমরা অভিজ্ঞতা "উন্নত" করি। এই সমস্যা সমাধানের অনেক উপায় আছে।
আমার সাজেশন হল, আর্কিটেকচারের উপর আমাদের লেখাটি পড়ুন এবং মূল্যায়ন করুন যে কীভাবে একই ধরনের নীতি আপনার নিজের অ্যাপ্লিকেশন এবং স্ট্যাকের ক্ষেত্রে সবচেয়ে ভালোভাবে প্রয়োগ করা যেতে পারে।
শুরু করার বয়লারপ্লেট
অ্যাপ্লিকেশন শেল
app-shell রিপোজিটরিতে অ্যাপ্লিকেশন শেল আর্কিটেকচার-এর প্রায় সম্পূর্ণ ইমপ্লিমেন্টেশন রয়েছে। এটির ব্যাকএন্ড Express.js-এ এবং ফ্রন্টএন্ড ES2015-এ লেখা।
মডেলের ক্লায়েন্ট ও সার্ভার-সাইড অংশ কভার করার জন্য এবং সেখানে অনেক কিছু চলছে বলে, কোডবেসের সাথে পরিচিত হতে কিছুটা সময় লাগবে। অন্যথায়, এটিই এখন আমাদের সবচেয়ে বিস্তারিত প্রোগ্রেসিভ ওয়েব অ্যাপের স্টার্টিং পয়েন্ট। এই প্রোজেক্টের জন্য Docs আমাদের পরবর্তী ফোকাস হবে।
Polymer স্টার্টার কিট
Polymer ওয়েব অ্যাপের অফিসিয়াল স্টার্টিং পয়েন্ট নিম্নলিখিত প্রোগ্রেসিভ ওয়েব অ্যাপ ফিচার সাপোর্ট করে:
- ওয়েব অ্যাপ্লিকেশন ম্যানিফেস্ট
- Android-এর জন্য Chrome স্প্ল্যাশস্ক্রিন
- Platinum SW এলিমেন্ট সহ সার্ভিস ওয়ার্কার অফলাইন ক্যাশিং
- Platinum Push এলিমেন্ট সহ পুশ বিজ্ঞপ্তি (ম্যানুয়ালি সেট-আপ করতে হবে)
PSK-এর বর্তমান ভার্সনে কিছু উন্নত পারফর্ম্যান্স প্যাটার্নের (যেমন, অ্যাপ্লিকেশন শেল মডেল, অ্যাসিঙ্ক লোডিং) জন্য সাপোর্ট নেই, যা আপনি কিছু প্রোগ্রেসিভ পলিমার ওয়েব অ্যাপে দেখতে পাবেন।
২০১৬ সালে PSK-তে এই প্যাটার্নগুলি বেক করার চেষ্টা করার লক্ষ্য আমাদের আছে, তবে এই বিষয়ে প্রাথমিক পরীক্ষাগুলি রব ডডসন দ্বারা পলিমার Zuperkulblog অ্যাপে এবং এরিক বিডেলম্যানের চমৎকার পলিমার পারফ প্যাটার্ন টকে পাওয়া যাবে।
Web Starter Kit
নতুন ভ্যানিলা প্রোজেক্টের জন্য আমাদের মতামতযুক্ত স্টার্টিং পয়েন্টে নিম্নলিখিত প্রোগ্রেসিভ ওয়েব অ্যাপ ফিচার অন্তর্ভুক্ত থাকে:
- ওয়েব অ্যাপ্লিকেশন ম্যানিফেস্ট
- Android-এর জন্য Chrome স্প্ল্যাশস্ক্রিন
- sw-precache-এর জন্য ধন্যবাদ, সার্ভিস-ওয়ার্কার প্রি-ক্যাশিং
আপনি যদি ভ্যানিলা JS/ES2015-এর সাথে কাজ করতে পছন্দ করেন এবং পলিমার ব্যবহার করতে না পারেন, তাহলে ওয়েব স্টার্টার কিট একটি রেফারেন্স পয়েন্ট হিসেবে উপযোগী হতে পারে যেখান থেকে আপনি কোড স্নিপেট আবার ব্যবহার করতে বা চুরি করতে পারেন।
ফ্রেমওয়ার্ক সহ ও ফ্রেমওয়ার্ক ছাড়া প্রোগ্রেসিভ ওয়েব অ্যাপ
কমিউনিটির মেম্বাররা JS লাইব্রেরি ও ফ্রেমওয়ার্ক সহ ও ছাড়া অনেক ওপেন-সোর্স প্রোগ্রেসিভ ওয়েব অ্যাপ তৈরি করেছেন। আপনি যদি অনুপ্রেরণা খুঁজছেন, তাহলে নিচের রেপো রেফারেন্স হিসেবে উপযোগী হতে পারে। এছাড়াও, এগুলি খুবই ভালো অ্যাপ।
ভ্যানিলা জাভাস্ক্রিপ্ট
- পল লুইসের ভয়েস মেমো
app-shell(রাইট-আপ)-এর মতো একই আর্কিটেকচার ব্যবহার করে তৈরি করা হয়েছে - জ্যাক আর্চিবল্ডের অফলাইন উইকিপিডিয়া (ভিডিও)
- পল কিনলানের Air Horner
- পল লুইসের গিটার টিউনার (রাইট-আপ)
Polymer
- রব ডডসন-এর Zuperkulblog (স্লাইড)
প্রতিক্রিয়া জানান
Virtual-DOM
- Nolan Lawson-এর Pokedex - প্রোগ্রেসিভ রেন্ডারিংয়ে সাহায্য করার জন্য "ওয়েব ওয়ার্কারে সবকিছু করুন" অ্যাপ্রোচ প্রয়োগ করে চমৎকার প্রোগ্রেসিভ ওয়েব অ্যাপ। (রাইট-আপ)
Angular.js
- Kenneth Auchenberg-এর Timey.in - রিসোর্স প্রিক্যাচিংয়ের জন্য
sw-precacheব্যবহার করে
ক্লোজিং নোট
যেমনটি উল্লেখ করা হয়েছে, প্রোগ্রেসিভ ওয়েব অ্যাপগুলি এখনও তাদের শৈশবকালে রয়েছে তবে তাদের পিছনে থাকা পদ্ধতিগুলির সাথে খেলা করা এবং তারা আপনার নিজের ওয়েব অ্যাপগুলিতে কতটা ভালভাবে প্রয়োগ করতে পারে তা দেখার জন্য এটি একটি উত্তেজনাপূর্ণ সময়।
পল কিনলান বর্তমানে প্রোগ্রেসিভ ওয়েব অ্যাপে ওয়েবের মূল নীতি সংক্রান্ত নির্দেশিকা পরিকল্পনা করছেন এবং আপনি যদি এমন কোনও ক্ষেত্র সম্পর্কে ইনপুট দিতে চান যা আপনি কভার করতে চান, তাহলে নির্দ্বিধায় থ্রেডে কমেন্ট করুন।
আরও পড়ুন
- প্রোগ্রেসিভ ওয়েব অ্যাপ: আমাদের মূল উদ্দেশ্য না হারিয়ে ট্যাব থেকে বেরিয়ে আসা
- প্রোগ্রেসিভ ওয়েব অ্যাপ কেন ওয়েব ডেভেলপমেন্টের ভবিষ্যৎ
- প্রোগ্রেসিভ ওয়েব অ্যাপ: প্রাইমটাইমের জন্য প্রস্তুত
- ServiceWorker-এর সাহায্যে প্রোগ্রেসিভ অ্যাপ তৈরি করা
- প্রোগ্রেসিভ ওয়েব অ্যাপ হল ভবিষ্যৎ
- প্রোগ্রেসিভ ওয়েব অ্যাপ: মোবাইলে অভিজ্ঞতা পাওয়ার নতুন উপায়
- Pokedex.org-এর সাথে পরিচয়: Pokémon অনুরাগীদের জন্য একটি প্রোগ্রেসিভ ওয়েবঅ্যাপ
- Chrome ডেভেলপার সামিট রিক্যাপ: প্রোগ্রেসিভ ওয়েব অ্যাপ