আলাদা frontend মূল্যবান অভিজ্ঞতা দিতে পারে, তবে তার দায়িত্বও চাই। পুরো lifecycle তুলনা করুন; price, stock, order ও payment-এর authority রাখুন এক engine-এ।
লেখক
Anichur Rahaman
এক retailer-এর একটি website, 3,000 product । সোমবারের planning meeting-এ competitor-এর মতো app চাওয়া হলো। Agency নতুন headless website প্রস্তাব দিল। Framework বাছার আগে operations manager জিজ্ঞেস করলেন: আমাদের আলাদা website দরকার, নতুন app দরকার, নাকি বর্তমান দোকানের shopping journey ভালো করা দরকার?
এটি শেখানোর দৃশ্য, customer outcome নয়। একটি website-এর জন্যও headless সঠিক হতে পারে; অনেক channel থাকলেই লাভ হবে না। মূল্যবান capability, চালানো যায় এমন design এবং তৃতীয় বছরেও support দেবেন এমন owner দেখে সিদ্ধান্ত হবে।
Coupled বা built-in storefront commerce platform-এর অংশ হিসেবে সরবরাহ ও maintain হয়। তাতেও API, worker, CDN ও একাধিক deployment component থাকতে পারে। সব সময় এক process, এক server বা customisation-হীন বন্ধ theme নয়।
Headless storefront আলাদাভাবে চালানো presentation app, যা commerce interface ব্যবহার করে। Engine-এ built-in storefront বা hosted checkout থাকতেও পারে। Headless নাম মানেই প্রয়োজনীয় প্রতিটি API action আছে নয়। Hybrid কিছু journey-তে built-in রাখে, একই core-এর ওপর app বা নির্বাচিত experience যোগ করে।
Composable commerce হলো capability বেছে যুক্ত করা। প্রতিটি feature-এর জন্য আলাদা supplier, microservice বা এক hosting model বাধ্যতামূলক নয়। নতুন service-এর contract, identity, observability ও failure handling যাচাই করতে হয়।
প্রতিটি option-এ merchandising, preview, accessibility, translation/RTL, privacy/consent, analytics, SEO, extension, patch ও রাতের incident কার দায়িত্ব লিখুন। দুই model-এই tool এসব দিতে পারে। Theme-এ সব free বা headless-এ সব scratch থেকে বানাতে হয়—দুটিই অন্যায্য অনুমান। Contract, access, exit plan ও support capacity বাস্তব হলে agency-ও দীর্ঘমেয়াদি owner হতে পারে।
Table-টি একই currency unit-এ বানানো annual operating budget; vendor quote, salary survey বা StoreConsole price নয়। দুই option-এই maintenance ও QA/security আছে। Commerce-engine common cost একই ধরে বাদ দেওয়া হয়েছে; নিজের model-এ পার্থক্য থাকলে যোগ করুন। একই staff time দুবার গুনবেন না।
| Annual operating line | Built-in | Separate frontend |
|---|---|---|
| UI maintenance ও support | 24,000 | 54,000 |
| Hosting ও CDN allocation | 6,000 | 12,000 |
| QA, accessibility ও security | 8,000 | 18,000 |
| Preview, analytics ও localisation | 4,000 | 12,000 |
| মোট annual operation | 42,000 | 96,000 |
আলাদা one-off build/migration cost ধরুন built-in 20,000, separate frontend 80,000 । Annual operation 42,000 বনাম 96,000, অর্থাৎ বছরে 54,000 বেশি। তিন বছরের undiscounted total 20,000+3×42,000=146,000 এবং 80,000+3×96,000=368,000; difference 222,000 ।
উদাহরণে incremental contribution margin 25% হলে শুধু extra recurring cost তুলতে 54,000÷0.25=216,000 annual extra sales লাগবে। Initial extra 60,000 তিন বছরে ভাগে বছরে 20,000 । তখন 74,000÷0.25=296,000 annual extra sales-এ সরল তিন বছরের তুলনা মেলে। এটি forecast, cash-payback date বা guarantee নয়।
Contribution-এ goods, payment, fulfilment ও expected return/support-সহ সব relevant variable cost বাদ যায়; শুধু gross margin নয়। Discount, demand uncertainty, financing/tax ও non-sales benefit আলাদা model করুন। API কাজ reuse হতে পারে; চার channel মানে মোট bill চার ভাগের এক নয়। প্রতিটিতে design, test ও operation থাকে।
Actual journey audit করুন: variant, customer-specific price, currency, availability, cart change, shipping, tax, discount, payment method, order, return ও account access । Catalogue-only API পূর্ণ shop-এর জন্য যথেষ্ট নয়। প্রয়োজনীয় enabled module অনুযায়ী versioned contract, rate limit, extension coverage, error ও backward compatibility দেখুন।
Frontend quote দেখাতে ও intent নিতে পারে; authoritative engine permission, current rule ও approved total validate করবে। প্রতিটি app-এ inventory reservation, tax বা discount policy কপি নয়। Cached price বা displayed availability final order acceptance authority নয়। Basket/terms বদলালে প্রয়োজনমতো নতুন confirmation নিন।
OWASP authorization guidance প্রতিটি request ও object boundary-তে প্রযোজ্য। Button লুকানো, order ID জানা বা logged in থাকা অন্য customer/entity-তে access দেয় না। Privileged secret browser-এর বাইরে রাখুন। Public cache ও account/cart/quote response আলাদা করুন; প্রয়োজনীয় market, currency ও permission variation cache design-এ ধরুন।
Payment screen থেকে ফেরত আসা payment proof নয়। Stripe fulfilment guide server-side confirmation ও duplicate-safe handling বোঝায়; actual provider state ও async method গুরুত্বপূর্ণ। Operation identity রাখুন, unknown result হলে আবার collect করার আগে query করুন। Transient failure-এ bounded backoff ও দায়িত্বসহ exception রাখুন। অন্য frontend-এ fallback যেন দ্বিতীয় order বা charge না বানায়।
ভালো Core Web Vitals target: 75 th percentile-এ LCP≤2.5 s, INP≤200 ms, CLS≤0.1; mobile ও desktop অনুযায়ী দেখুন। Lab Lighthouse score field measurement-এর সমান নয়। Architecture label কোনোটির pass প্রমাণ করে না।
Server rendering বা static generation browser work কমাতে পারে। Slow origin, image, font, hydration ও third-party code তবু প্রভাব ফেলে। INP-তে input delay, event processing ও presentation work আছে; শুধু framework JavaScript নয়। দুই model-এই edge cache public read সামলাতে পারে; checkout write ও private state-এর capacity/correctness লাগে।
Google JavaScript SEO guidance crawling ও rendering ব্যাখ্যা করে। Useful content, crawlable link, ঠিক status ও consistent metadata দিন। Rendered product data, canonical, translated route ও structured data যাচাই করুন। Server-এ HTML render হলেই indexing/ranking guarantee নয়।
Hosting ও release-এর কাজ budget করুন। যেমন Next.js self-hosting documentation-এ multi-instance cache/build coordination ও version skew আছে। Separate frontend-এ compatible API/UI change, invalidation, monitoring ও recovery owner দরকার; built-in-এও disciplined release/test লাগে। যারা ব্যবহার করবেন তাঁদের দিয়ে marketing preview ও component extension demonstrate করান।
Decision table কোনো universal winner দেয় না; experiment দেখায়। Specialised configurator একটি আলাদা website justify করতে পারে; mobile app built-in web shop-এর পাশে চলতে পারে। Traffic peak একা সিদ্ধান্ত নয়, কারণ cache miss, write ও shared dependency থাকে।
| প্রয়োজন | যা তুলনা/test করবেন |
|---|---|
| Standard shopping journey | Current storefront improve বনাম alternatives |
| App বা partner channel | Shared engine-এ hybrid বনাম website replace |
| Distinctive single-site experience | Missing capability prototype; API/lifecycle cost |
| ঘন marketing change | Editor দিয়ে preview/publishing demonstrate |
| বড় traffic peak | Cold-cache, write-path ও failure capacity মাপুন |
| সীমিত delivery capacity | প্রতি model-এ credible maintenance/support owner |
একই business outcome ধরে repaired current storefront, focused hybrid ও separate frontend তুলনা করুন। Image weight বা upstream stock error মূল সমস্যা হলে সেটি সরাসরি চিহ্নিত করুন। Repair সস্তা হতে পারে, কিন্তু guaranteed conversion lift বা fixed সপ্তাহের result বানাবেন না।
Supplier review module ও capability map দিয়ে শুরু করে working acceptance journey-তে শেষ করুন। Coverage, maintainer, support ও exit/export plan চান। “One backend” দাবি একা দুই storefront একই আচরণ করে প্রমাণ করে না।
Build-এর আগে baseline ও acceptance goal লিখুন। Product/account journey, keyboard/accessibility, translation/RTL, mobile performance, tax/price display ও consent-সহ analytics test করুন। Commerce engine authoritative রাখুন; competing rule-সহ দুই live write path নয়।
Isolated read-only page pilot হতে পারে, কিন্তু page-by-page সব সময় safest boundary নয়। Cart identity, cookie, authentication, redirect ও payment callback page/domain পেরোয়। Coherent journey ও stable traffic cohort নিন, monitored stop condition-সহ। Random percentage safety guarantee নয়।
যেখানে সম্ভব useful URL রাখুন। বদলালে Google site-move guidance অনুযায়ী mapping, permanent redirect ও monitoring করুন। প্রযোজ্য ক্ষেত্রে অন্তত এক বছর redirect, user-এর জন্য সম্ভব হলে আরও বেশি রাখুন। Unrelated old page একই generic destination-এ পাঠাবেন না। আগে/পরে metadata, sitemap ও crawl দেখুন।
Existing cart, order reference, active session, schema/API version ও in-progress payment নিয়ে rollback exercise করুন। Contract compatible থাকলেই old UI-তে ফেরা নিরাপদ। তা আগেই নেওয়া payment ফেরায় না, নতুন order মুছে দেয় না। অন্ধ replay নয়, outcome ও unfinished obligation reconcile করুন।
Representative trading condition ও recovery-এর evidence পেলে old route retire করুন; launch day ভালো দেখালেই নয়। Support owner ও accepted cost model রাখুন। সোমবারের meeting-এর ভালো উত্তর হলো কাজ করে দেখানো journey ও টেকসই operation plan—framework-এর নাম বা সব sales problem মিটবে এমন promise নয়।
পর্যালোচনা 6 November 2026 । আনিছুর রহমান, StoreConsole-এর নির্মাতা। Cost ও break-even হিসাব উদাহরণ; price, observed outcome বা financial forecast নয়।
লেখকের পরিচয়
Anichur Rahaman
পড়া চালিয়ে যান
