Migrace Polaris Web Components: Checkout a Customer Account Shopify

Shopify změnil základní architekturu UI extensions pro Checkout a Customer Account. Nejde o postupnou aktualizaci: model vývoje se mění strukturálně a oficiální průvodci migrací na Polaris web components jsou nyní k dispozici na shopify.dev.

Pokud vaše rozšíření používají verzi API starší než 2025-10, je migrace povinná, abyste se vyhnuli aktivním deprecacím v nejkritičtějším místě konverze každého obchodu.

Co se mění v architektuře

Doposud bylo možné vyvíjet rozšíření Checkout a Customer Account pomocí Reactu nebo čistého JavaScriptu prostřednictvím Shopify API. S verzí 2025-10 je tento přístup opuštěn.

Nový stack stojí na třech základních prvcích:

• Preact místo Reactu jako renderovací knihovna
• Polaris web components jako standardní systém UI komponent
• Globální objekt shopify pro přístup k platformním API

Tato změna se netýká pouze syntaxe. Mění způsob, jakým jsou komponenty instancovány, životní cyklus rozšíření i způsob jejich interakce s kontextem checkoutu.

Komponenty dotčené migrací

Shopify zveřejnil více než 60 stránek dokumentace věnovaných migraci jednotlivých komponent. Mezi hlavní komponenty, které vyžadují přepis, patří:

• Button: nové API pro události a varianty
• TextField: přepracovaná správa stavu a validace
• Banner: zcela redefinovaná struktura a props
• Checkbox: aktualizovaná integrace se stavem formuláře
• View: layout a kompozice s novým modelem

Adaptace existujícího rozšíření, které používá Banner k zobrazení propagačních zpráv při checkoutu, na nový systém není povrchní refaktoring: vyžaduje přepis řízený novým API komponenty a testování skutečného chování v průběhu checkoutu.

Migrace metapolí: samostatné riziko

Aspekt, který bývá podceňován, se týká metapolí. Existující metapolea checkoutu musí být migrována na metapolea košíku. Jde o změnu s přímým provozním dopadem: pokud jsou metapolea využívána k přenosu vlastních dat mezi frontendem a backendem během checkoutu, neúplná migrace může způsobit ztrátu dat nebo neočekávané chování objednávek.

Tuto část je třeba plánovat odděleně od migrace UI komponent, s dedikovaným testováním ve stagingové prostředí ještě před jakýmkoli nasazením do produkce.

Jak postupovat: provozní priority

Pokud spravujete rozšíření Checkout nebo Customer Account, doporučený postup je následující:

1. Zkontrolujte verzi API každého aktivního rozšíření. Rozšíření běžící na verzích starších než 2025-10 jsou ta, která čelí riziku deprecace.
2. Upřednostněte rozšíření v produkci, zejména ta, která přímo operují v nákupním procesu.
3. Postupujte při migraci komponentu po komponentu podle oficiálních průvodců na shopify.dev, bez nestrukturovaných globálních přepisů.
4. Naplánujte migraci metapolí jako samostatnou aktivitu s dedikovanou fází validace.
5. Testujte v kontrolovaném prostředí před nasazením na živý obchod, zejména u merchantů Shopify Plus s vysoce přizpůsobenými checkouty.

Dopad na Shopify Plus merchantů s vlastními checkouty

Pro ty, kdo spravují více Shopify Plus merchantů, může být celkové úsilí značné. Každý obchod s vlastními rozšířeními checkoutu vyžaduje individuální posouzení: počet komponent k migraci, složitost implementované logiky a přítomnost vlastních metapolí určují skutečný objem práce.

Setrvání na starší verzi API není neutrální strategií: znamená vystavení aktivním deprecacím na komponentě kritické pro konverzní poměr. Týmy, které plánují migraci nyní, mají výhodu v tom, že ji mohou zvládnout v klidu, aniž by musely pracovat pod tlakem ve chvíli, kdy budou starší verze deaktivovány.

Pro odhadnutí konkrétního rozsahu prací na vašem Shopify projektu si prohlédněte plány pro vývojáře a jejich ceník.

Polaris web components jako dlouhodobý standard

Nad rámec bezprostřední migrace představuje přijetí Polaris web components strategický směr Shopify pro UI extensions. Investice do přepisu nyní znamená sladění se stackem, který bude dostávat podporu a aktualizace ve střednědobém a dlouhodobém horizontu, místo udržování kódu na architektuře směřující k vyřazení.

Oficiální dokumentace je k dispozici na shopify.dev a podrobně pokrývá každou komponentu s příklady kódu před migrací i po ní.