Polaris 2.0.0-rc.1 の変更点まとめ

DEV PREVIEW

新管理画面スタイルへの追従・バグ修正・パフォーマンス改善の3本柱

Polaris 2.0.0-rc.1は2026年10月1日にリリースされたリリース候補版です。Shopifyの新しい管理画面スタイルへのコンポーネント対応が進み、複数のレイアウト・イベントバグが修正されました。React非使用ページを含む広いシナリオでマウントと更新の速度が向上しています。

課題: スマートフォンからShopify管理画面を操作するスタッフが、Badgeの表示が分かりにくい・Sectionのボタンが見出しを圧迫すると報告していた。
打ち手: Polaris 2.0.0-rc.1へアップデートすることで、Badgeがモバイルでピル形状になり、狭い画面でSectionのprimary actionが見出し下に移動するため、レイアウトが自動改善される。
効果: モバイルオペレーターの誤操作・視認性問題をコード変更なしに解消できる。
技術メモ: カスタムCSSでBadgeやSectionのレイアウトを上書きしていた場合は競合に注意。既存スタイルの見直しを推奨。

課題: マウント後にMenuやlabelをプログラム的に追加するカスタム管理画面アプリで、secondary actionのdisclosureアイコンが消えるバグが発生していた。
打ち手: 今回の修正により、マウント後にMenuやlabelを追加してもdisclosureアイコンが維持されるようになった。また、接続済み要素にマークアップを注入した際のslottedアクション消失も解消されている。
効果: 動的UI生成パターンの信頼性が向上し、追加の回避コードが不要になる。
技術メモ: Web Componentsとして実装されているPolaris要素に対してinnerHTMLやappendChildを使う実装パターンで効果が出る。

課題: Shopifyアプリのカスタムページ（Vanilla JS環境）でPolarisコンポーネントを利用しているが、ページ表示が遅いと感じていた。
打ち手: Polaris 2.0.0-rc.1はReact非使用ページでのマウントと更新速度を特に改善しており、ChoiceList・Menu・Modal・Select・各ピッカーの不要な再レンダリングも削減された。
効果: 特別な最適化コードを書かなくても、初期表示や操作レスポンスが向上する。
技術メモ: React環境でも再レンダリング削減の恩恵はあるが、最も効果が出るのはReact非使用のページとされている。

コンポーネント

Select の高さ統一
SelectがTextFieldなど他の入力と高さが揃ったことで、フォームレイアウトの調整が不要になる場合がある。既存の高さ補正CSSは削除を検討。

コンポーネント

Tooltip の配置拡張
Section の supplemental スロットにTooltipを配置できるようになった。情報補足UIの設計自由度が向上。

レイアウト

Section 等高カード
同一Grid内でequal-height cardsをサポート。グリッドレイアウトで高さ揃えのためのCSSハックが不要になる可能性がある。

バグ修正

GlobalThis.polaris 状態の保持
ページが同一バンドルを複数回ロードした場合に状態が失われる問題が修正された。複数のアプリブロックが共存する環境で特に重要。

パフォーマンス

影響コンポーネントの範囲
不要な再レンダリング削減の対象はChoiceList・Menu・Modal・Select・ピッカー系コンポーネント。これらを多用するページで効果を検証推奨。

修正項目	影響範囲	対応推奨
Modal actions の click イベント (commandFor)	commandFor属性を使うModal実装	イベントハンドラの動作確認
TextField accessory クリック	React onClick を使う TextField accessory	既存の回避コードを削除検討
ネストSectionの位置ずれ	Section をネストするレイアウト	カスタムCSSとの競合確認
Aside Section スタイル修正	Page aside を使う画面	デザイン確認・回帰テスト推奨
Banner タイトルコントラスト	カスタムテーマとBannerを組み合わせる実装	アクセシビリティ改善として記載なしのスコア変化に注意