JavaScript는 브라우저 URL을 조작하기위한 pushState
및 replaceState
API를 제공하여 페이지 새로 고침없이 탐색하는 단일 페이지 응용 프로그램 (SPA)을 생성 할 수 있습니다. 그러나 이러한 저수준 API 만 사용하여 강력한 라우팅 로직을 구축하는 것은 복잡 할 수 있습니다. React 라우터와 같은 라이브러리는이 프로세스를 단순화하여 JSX를 사용하여 경로 정의에 대한 선언적 접근 방식을 제공합니다.
라우터의 반응<switch></switch>
구성 요소는 중첩을 통해 반복합니다<route></route>
구성 요소, 현재 URL을 기반으로 첫 번째 일치하는 경로를 렌더링합니다. 이 접근법은 정규식 일치와 비슷하지만 매개 변수화 된 경로 세그먼트 (예 : :id
)와 같은 추가 기능이 있습니다. 효과적이지만 외부 라이브러리에 대한 이러한 의존은 오버 헤드가 추가됩니다.
웹 플랫폼이이를 해결하기 위해 발전하고 있습니다. URLPattern
URL 라우팅 패턴을 정의하고 테스트하는 기본 방법을 제공합니다. 정규 표현식과 유사한 구문을 사용하지만 경로 세그먼트를 처리하기위한 도메인 별 확장 기능이 있습니다.
const p = 새로운 urlpattern ({ PathName : '/foo/:image.jpg', Baseurl : 'https://example.com', }); 결과 = p.test ( 'https://example.com/foo/cat.jpg'); // 진실 결과 = p.exec ( 'https://imagecdn1.example.com/foo/cat.jpg'); // result.hostname.groups.subdomain은 'imagecdn1'입니다. // result.pathname.groups [0]은 'foo'가됩니다. // result.pathname.groups.image는 'cat'가됩니다.
URLPattern
의 잠재력은 외부 라이브러리가없는 스파 라우팅을 단순화하는 데있어 더 작고 빠른 웹 사이트로 이어집니다. 또한보다 효율적인 기본 메커니즘을 제공함으로써 기존 라우팅 라이브러리에 도움이 될 수 있습니다. 여전히 개발중인 URLPattern
과 폴리 필드는 웹 라우팅의 미래를 엿볼 수 있습니다.
또한 웹 플랫폼의 스파에 대한 새로운 초점은 공유 요소 전환의 부활에서 분명하므로 탐색 중 사용자 경험을 향상시킵니다. URLPattern
에 대한 더 깊은 이해를 원하시면 관련 Google WebDev 블로그 게시물을 참조하십시오.
위 내용은 기본 JavaScript 라우팅?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!