Route JavaScript native?

JavaScript propose des API pushState et replaceState pour la manipulation des URL du navigateur, permettant la création d'applications (spas) (spas) qui naviguent sans rafraîchisse. Cependant, la construction de la logique de routage robuste en utilisant uniquement ces API de bas niveau peut être complexe. Des bibliothèques comme React Router simplifient ce processus, offrant une approche déclarative pour la définition de l'itinéraire à l'aide de JSX.

Réagir le routeur<switch></switch> le composant itéra<route></route> Composants, rendant la première route correspondante en fonction de l'URL actuelle. Cette approche ressemble à une correspondance d'expression régulière, mais avec des fonctionnalités ajoutées comme les segments de chemin paramétré (par exemple , :id ). Bien que efficace, cette dépendance à l'égard des bibliothèques externes ajoute des frais généraux.

La plate-forme Web évolue pour y remédier. URLPattern fournit un moyen natif de définir et tester les modèles de routage d'URL. Il utilise une syntaxe similaire aux expressions régulières, mais avec des extensions spécifiques au domaine pour la manipulation des segments de chemin.

 const p = new UrlPattern ({
  pathname: '/foo/:image.jpg',
  BUSURL: 'https://example.com',
});

Let résultat = p.test ('https://example.com/foo/cat.jpg'); // vrai
résultat = p.exec ('https://imagecdn1.example.com/foo/cat.jpg');
// result.hostname.groups.
// result.pathname.groups [0] sera «foo»
// result.pathname.groups.image sera «chat»

Le potentiel d' URLPattern réside dans la simplification du routage des spa sans bibliothèques externes, conduisant à des sites Web plus petits et plus rapides. Il pourrait également profiter aux bibliothèques de routage existantes en fournissant un mécanisme sous-jacent plus efficace. Bien qu'il soit toujours en cours de développement, URLPattern et son polyfill offrent un aperçu de l'avenir de l'acheminement Web.

En outre, la concentration renouvelée de la plate-forme Web sur les spas est évidente dans la résurgence des transitions d'éléments partagés, ce qui améliore l'expérience utilisateur pendant la navigation. Pour une compréhension plus approfondie de URLPattern , consultez le billet de blog Google WebDev concerné.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!