crossroad.page

What It Is

Crossroad is a navigation and routing library for React WebApps. It handles page transitions, path matching, and URL state through simple components such as Router, Switch, and Route, as well as React Hooks. Its high-level API is inspired by React Router, with an emphasis on being lighter: the main text claims a size of around 1.8-1.9kb min+gzip, compared with 17kb for React Router(+Dom).

Core Features

In terms of functionality, Crossroad covers the typical routing needs of single-page applications: Router acts as the top-level wrapper and handles history/click behavior; Switch renders only the first matching route and supports redirects; Route performs exact path matching by default, while a trailing * can be used for partial matching. It supports parameterized routes such as /users/:id, and can attempt to convert number and date types. However, the documentation explicitly states that it does not perform validation, so validation still needs to be handled by the application.

Hooks are one of its highlights. It provides useUrl(), usePath(), useQuery(), useHash(), and useParams(), allowing function components to directly read and modify the URL, path, query parameters, and hash. It also supports route matching based on query parameters, making it suitable for scenarios such as search filters, tabs, and refresh-safe state persistence. For links, it uses native <a> elements rather than a custom Link component, which reduces framework intrusion.

Pricing and Ecosystem

The main content only shows entry points such as npm installation, Documentation, Donate, and Github. There is no mention of commercial plans, licensing, or enterprise support. In terms of ecosystem positioning, it is clearly designed as a lightweight alternative to React Router. It provides CodeSandbox examples and is intended to be integrated near the top level of an App alongside facilities such as stores, error handling, and translation.

Pros and Cons

Its advantages include a small bundle size, familiar API, practical Hooks, reasonably complete documentation examples, and claimed 130+ tests with strict semver. Its drawbacks are that it only covers React use cases, while capabilities for complex large-scale routing ecosystems are not demonstrated in the main text; the open-source license, maintainer identity, SLA, and paid support are also not specified.

Who It’s For and Access from China

It is suitable for React projects that prioritize a small bundle size and have relatively clear routing requirements, especially frontend applications that need to use query parameters as a source of state. If a team heavily depends on a mature ecosystem, community plugins, or enterprise-grade support, React Router remains the safer alternative. Access from China cannot be determined from the main text; npm, Github, and CodeSandbox may be affected by network fluctuations in mainland China, so actual testing is required.