ネイティブJavaScriptルーティング？

JavaScriptは、ブラウザURLを操作するためにpushStateとreplaceState APIを提供し、ページのリフレッシュなしでナビゲートするシングルページアプリケーション（SPA）の作成を可能にします。ただし、これらの低レベルAPIのみを使用して堅牢なルーティングロジックを構築することは複雑です。 Reactルーターのようなライブラリは、このプロセスを簡素化し、JSXを使用して定義をルートするための宣言的なアプローチを提供します。

Reactルーター<switch></switch>コンポーネントはネストされた繰り返しを繰り返します<route></route>コンポーネント、現在のURLに基​​づいて最初のマッチングルートをレンダリングします。このアプローチは、正規表現のマッチングに似ていますが、パラメーター化されたパスセグメント（例:id ）などの追加機能を備えています。効果的ですが、この外部ライブラリへの依存はオーバーヘッドを追加します。

Webプラットフォームはこれに対処するために進化しています。 URLPattern 、URLルーティングパターンを定義およびテストするネイティブの方法を提供します。正規表現と同様の構文を使用しますが、パスセグメントを処理するためにドメイン固有の拡張機能を備えています。

 const p = new urlpattern（{
  PathName： '/foo/:image.jpg'、
  baseurl： 'https：//example.com'、
}）;

let rest = p.test（ 'https://example.com/foo/cat.jpg'）; // 真実
result = p.exec（ 'https://imagecdn1.example.com/foo/cat.jpg'）;
// result.hostname.groups.subdomainは「imagecdn1」になります
// result.pathname.groups [0]は「foo」になります
// result.pathname.groups.imageは「猫」になります

URLPatternの潜在能力は、外部ライブラリなしでスパルーティングを簡素化することにあり、より小さく、より高速なWebサイトにつながります。また、より効率的な基礎メカニズムを提供することにより、既存のルーティングライブラリに利益をもたらす可能性があります。まだ開発中に、 URLPatternとそのポリフィルは、Webルーティングの将来を垣間見ることができます。

さらに、Webプラットフォームのスパへの新たな焦点は、ナビゲーション中のユーザーエクスペリエンスを向上させる共有要素遷移の復活で明らかです。 URLPatternをより深く理解するには、関連するGoogle WebDevブログ投稿を参照してください。

以上がネイティブJavaScriptルーティング？の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。