এমবেডেড ওয়েব ব্যবহার করে ইন-অ্যাপ ব্রাউজিং

ইন-অ্যাপ ব্রাউজার আপনার ব্যবহারকারীদের অ্যাপ থেকে বের না করেই একটি সম্পূর্ণ ওয়েব অভিজ্ঞতা দেয়। ইন-অ্যাপ ব্রাউজার বাস্তবায়নের জন্য অ্যান্ড্রয়েড দুটি প্রধান এপিআই (API) প্রদান করে: কাস্টম ট্যাব (Custom Tabs) এবং ওয়েবভিউ (WebViews )। যখন আপনার কোনো লিঙ্ক বা বিজ্ঞাপন একটি ওয়েব পেজে নিয়ে যায়, তখন একটি ইন-অ্যাপ ব্রাউজার ব্যবহার করুন। আপনি সেই পেজটি সরাসরি আপনার অ্যাপের ভেতরেই খুলতে পারেন, যেমনটি চিত্র ১-এ দেখতে পাচ্ছেন।

একটি লাল বাক্সে অ্যাপের ভেতরের একটি লিঙ্ক, এবং অন্য একটি স্ক্রিনের দিকে নির্দেশ করা একটি তীরচিহ্ন যা দেখাচ্ছে যে লিঙ্কটি একটি কাস্টম ট্যাবে খোলা হয়েছে।
চিত্র ১. অ্যাপের ভেতরের লিঙ্কে ক্লিক করা (বামে) এবং কাস্টম ট্যাব ব্যবহার করে অ্যাপের ভেতরের ব্রাউজার খোলা (ডানে)।

কাস্টম ট্যাব এবং ওয়েবভিউ-এর মধ্যে নির্বাচন করা একটি বড় স্থাপত্যগত সিদ্ধান্ত, যা আপনার ডেভেলপমেন্টের গতি, ব্যবহারকারীর অভিজ্ঞতা এবং UI-এর উপর আপনার নিয়ন্ত্রণের মাত্রাকে প্রভাবিত করে।

দ্রুত তুলনা

আপনার প্রয়োজনের জন্য কোন টুলটি সবচেয়ে উপযুক্ত, তা নির্ধারণ করতে নিচের সারণিটি ব্যবহার করুন:

বৈশিষ্ট্য ওয়েবভিউ কাস্টম ট্যাব
প্রাথমিক ব্যবহারের ক্ষেত্র ওয়েবকে প্রাথমিক বা সহায়ক কন্টেন্ট হিসেবে ব্যবহার করে হাইব্রিড অ্যাপ তৈরি করা, যেখানে বিজ্ঞাপন, ইন-অ্যাপ ক্যাম্পেইন বা পরিষেবার শর্তাবলীর পেজ প্রদর্শন করা হয়। বাহ্যিক ওয়েবসাইট থেকে বিষয়বস্তু প্রদর্শন করা (যেমন সংবাদ নিবন্ধ বা পণ্যের পৃষ্ঠা)।
UI নিয়ন্ত্রণ সম্পূর্ণ। এটি একটি View কম্পোনেন্ট যা আপনি যেকোনো জায়গায় রাখতে পারেন। এর চারপাশের সমস্ত UI আপনি নিয়ন্ত্রণ করেন। সীমিত। আপনি টুলবারের রঙ থিম করতে এবং কয়েকটি কাস্টম অ্যাকশন যোগ করতে পারেন।
ডেটা এবং সেশন স্যান্ডবক্সড। এটি ব্যবহারকারীর মূল ব্রাউজারের সাথে কুকি বা লগইন তথ্য শেয়ার করে না। শেয়ার করা। এটি ব্যবহারকারীর ডিফল্ট ব্রাউজার সেশন ব্যবহার করে, যার মধ্যে কুকি এবং সংরক্ষিত পাসওয়ার্ড অন্তর্ভুক্ত থাকে।
নেটিভ <-> ওয়েব ব্রিজ হ্যাঁ। ওয়েব কন্টেন্ট এবং নেটিভ অ্যাপ কোডের মধ্যে গভীর ও দ্বিমুখী যোগাযোগের জন্য আপনি জাভাস্ক্রিপ্ট ব্রিজ ব্যবহার করতে পারেন। সীমিত। সাধারণ স্ট্রিং পাঠানোর জন্য আপনি window.postMessage() মেথডটি ব্যবহার করতে পারেন।
ডেভেলপার প্রচেষ্টা উচ্চ। আপনাকে এর জীবনচক্র, নেভিগেশন এবং পারফরম্যান্স নিজেই পরিচালনা করতে হবে। কম। আপনি মাত্র কয়েকটি কোড লাইন দিয়েই এটি বাস্তবায়ন করতে পারেন।

ওয়েবভিউ

ওয়েবভিউ হলো এমন একটি ভিউ যা ওয়েব পেজগুলোকে আপনার অ্যাপের লেআউটের একটি অবিচ্ছেদ্য অংশ করে তোলে। এটি শক্তিশালী হলেও, কাস্টম ট্যাবের তুলনায় এটি পরিচালনা করা কিছুটা বেশি জটিল।

WebView দূরবর্তী বা স্থানীয় ওয়েব কন্টেন্ট লোড করতে, জাভাস্ক্রিপ্ট চালাতে এবং আপনার ওয়েব কন্টেন্ট ও নেটিভ অ্যাপ কোডের মধ্যে দ্বিমুখী যোগাযোগ সক্ষম করতে পারে। এর সক্ষমতা সম্পর্কে আরও জানতে, “WebView কী করতে পারে” দেখুন।

আপনি আপনার অ্যাপের অংশ হিসেবে একটি ওয়েব অ্যাপ্লিকেশন তৈরি করতে বা একটি অনলাইন ওয়েব পেজ প্রদর্শন করতেও WebView ব্যবহার করতে পারেন। উদাহরণস্বরূপ, একটি ব্যবহারকারী চুক্তি যা আপনাকে পর্যায়ক্রমে আপডেট করতে হবে। আরও জানতে, WebView-তে ওয়েব অ্যাপ তৈরি করুন দেখুন।

কেন আপনার ওয়েবভিউ বেছে নেওয়া উচিত

নিম্নলিখিত কয়েকটি ক্ষেত্রে WebView বেশ উপযুক্ত:

  • হাইব্রিড অ্যাপ: আপনি এমন একটি অ্যাপ তৈরি করছেন যেখানে ওয়েব কন্টেন্ট এবং নেটিভ কম্পোনেন্ট (যেমন নেভিগেশন বার বা ফ্লোটিং অ্যাকশন বাটন) পাশাপাশি থাকে।
  • ফার্স্ট-পার্টি কন্টেন্ট: আপনার ওয়েব কন্টেন্ট হলো অ্যাপ অভিজ্ঞতার একটি মূল ও ইন্টারেক্টিভ অংশ, যেমন একটি ডকুমেন্ট এডিটর বা একটি ডিজাইন ক্যানভাস।
  • সম্পূর্ণ UI নিয়ন্ত্রণ: আপনি সরাসরি ওয়েব পেজের বিষয়বস্তু পরিবর্তন করতে পারবেন অথবা এর উপরে নিজস্ব UI উপাদান যুক্ত করতে পারবেন।
  • গভীর বিশ্লেষণ: ওয়েব ভিউয়ের মধ্যে ব্যবহারকারীর সম্পৃক্ততা এবং কার্যকলাপ সম্পর্কে আপনার বিশদ অন্তর্দৃষ্টি প্রয়োজন।

মূল আপস

WebView ব্যবহার করার সময় বিবেচনা করার মতো কিছু গুরুত্বপূর্ণ বিষয় নিচে দেওয়া হলো:

  • পারফরম্যান্স: WebView মেমরি-ইনটেনসিভ হতে পারে। যদি আপনি এটি সাবধানে পরিচালনা না করেন, তাহলে আপনি পারফরম্যান্স সংক্রান্ত সমস্যা বা ANR (অ্যাপ নট রেসপন্ডিং এরর)-এর সম্মুখীন হতে পারেন।
  • নিরাপত্তা ও রক্ষণাবেক্ষণ: নিরাপত্তা জোরদার করা এবং এর জীবনচক্র পরিচালনা করার দায়িত্ব আপনার। তবে, WebView-এর আপডেটগুলো বিশ্বব্যাপী Google Play-এর মাধ্যমে প্রকাশিত হয়, তাই এর অন্তর্নিহিত ইঞ্জিনটি পুরোনো হয়ে যাওয়া নিয়ে আপনাকে চিন্তা করতে হবে না।

কাস্টম ট্যাব

ব্যবহারকারীদের বাহ্যিক ইউআরএল-এ নিয়ে যাওয়ার জন্য কাস্টম ট্যাব একটি চমৎকার বিকল্প, কারণ এটি একটি দ্রুত, নিরাপদ এবং ব্যবহারকারী-বান্ধব ব্রাউজার উইন্ডো প্রদান করে যা আপনার অ্যাপের উপর স্লাইড করে আসে।

কেন আপনার কাস্টম ট্যাব বেছে নেওয়া উচিত

নিম্নলিখিত কয়েকটি ক্ষেত্রে কাস্টম ট্যাব বেশ উপযুক্ত:

  • বাহ্যিক লিঙ্ক: যখন কোনো ব্যবহারকারী আপনার মালিকানাধীন নয় এমন কোনো ওয়েবসাইটের লিঙ্কে ট্যাপ করেন, তখন কাস্টম ট্যাব তাদেরকে একটি পূর্ণাঙ্গ ব্রাউজার অভিজ্ঞতা দেওয়ার পাশাপাশি আপনার অ্যাপের মধ্যেই রাখে।
  • সমন্বয়ের সহজতা: একটি এমবেডেড ওয়েব অভিজ্ঞতা চালু করার এটিই সবচেয়ে সহজ উপায়।
  • শেয়ার্ড স্টেট: যেহেতু এটি ব্যবহারকারীর ডিফল্ট ব্রাউজারের সাথে কুকি শেয়ার করে, তাই ব্যবহারকারীদের আগে থেকে ভিজিট করা সাইটগুলিতে আবার সাইন ইন করতে হয় না।
  • তৃতীয়-পক্ষের সাইন-ইন: এগুলি তৃতীয়-পক্ষের সাইন-ইন প্রক্রিয়ার (যেমন "গুগল দিয়ে সাইন ইন করুন" বা "ফেসবুক দিয়ে সাইন ইন করুন") জন্য বেশ উপযুক্ত, কারণ ব্রাউজারটি ক্রেডেনশিয়ালগুলি নিরাপদে পরিচালনা করে।

যদিও বেশিরভাগ ব্রাউজার কাস্টম ট্যাব সমর্থন করে, কিছু ব্রাউজারে অন্যদের তুলনায় বেশি কাস্টমাইজেশনের সুযোগ থাকে। আরও তথ্যের জন্য, ব্রাউজার সাপোর্ট দেখুন।

Jetpack Compose-এ ওয়েব কন্টেন্ট ব্যবহার করুন

Jetpack Compose দিয়ে বিল্ড করার সময় আপনি কাস্টম ট্যাব এবং ওয়েবভিউ উভয়ই ব্যবহার করতে পারেন:

  • কাস্টম ট্যাব: যেহেতু কাস্টম ট্যাব একটি Intent ব্যবহার করে, আপনি আপনার কম্পোজ ফাংশনের যেকোনো Context থেকে এগুলো চালু করতে পারেন, যা একটি নির্বিঘ্ন ইন্টিগ্রেশন নিশ্চিত করে।
  • WebView: Compose-এ এখনও কোনো নেটিভ WebView কম্পোজেবল নেই, তাই আপনার লেআউটে একটি স্ট্যান্ডার্ড WebView এমবেড করতে AndroidView ব্যবহার করতে হবে।

অতিরিক্ত সম্পদ

WebViews বা Custom Tabs API ব্যবহার করে অ্যান্ড্রয়েড-চালিত ডিভাইসের জন্য ওয়েব পেজ তৈরি করতে, নিম্নলিখিত ডকুমেন্টগুলো দেখুন: