{"action":"closed","issue":{"url":"https://api.github.com/repos/reactjs/react-router/issues/3215","repository_url":"https://api.github.com/repos/reactjs/react-router","labels_url":"https://api.github.com/repos/reactjs/react-router/issues/3215/labels{/name}","comments_url":"https://api.github.com/repos/reactjs/react-router/issues/3215/comments","events_url":"https://api.github.com/repos/reactjs/react-router/issues/3215/events","html_url":"https://github.com/reactjs/react-router/issues/3215","id":142426836,"number":3215,"title":"Performance regression on route matching for sites with 20+ routes","user":{"login":"KyleAMathews","id":71047,"avatar_url":"https://avatars.githubusercontent.com/u/71047?v=3","gravatar_id":"","url":"https://api.github.com/users/KyleAMathews","html_url":"https://github.com/KyleAMathews","followers_url":"https://api.github.com/users/KyleAMathews/followers","following_url":"https://api.github.com/users/KyleAMathews/following{/other_user}","gists_url":"https://api.github.com/users/KyleAMathews/gists{/gist_id}","starred_url":"https://api.github.com/users/KyleAMathews/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/KyleAMathews/subscriptions","organizations_url":"https://api.github.com/users/KyleAMathews/orgs","repos_url":"https://api.github.com/users/KyleAMathews/repos","events_url":"https://api.github.com/users/KyleAMathews/events{/privacy}","received_events_url":"https://api.github.com/users/KyleAMathews/received_events","type":"User","site_admin":false},"labels":[{"url":"https://api.github.com/repos/reactjs/react-router/labels/bug","name":"bug","color":"fc2929"}],"state":"closed","locked":false,"assignee":null,"milestone":null,"comments":13,"created_at":"2016-03-21T18:08:07Z","updated_at":"2016-03-22T02:17:07Z","closed_at":"2016-03-22T02:17:07Z","body":"I'm working on upgrading my [blog](http://bricolage.io) to the latest version of [Gatsby](https://github.com/gatsbyjs/gatsby) which also means an upgrade under the hood from React-Router 0.13 to 2.0.\r\n\r\nI noticed that upon doing so, clicking on some links on the front page has became *very* slow. As in 1.2 seconds as shown in this performance audit.\r\n\r\n![screen shot 2016-03-21 at 10 39 06 am](https://cloud.githubusercontent.com/assets/71047/13927994/3558859c-ef51-11e5-8ad8-12f0168bbbca.png)\r\n\r\nLooking at the bottom up chart. Almost all the time is spent in the [`matchPattern` function](https://github.com/reactjs/react-router/blob/ebd9cf560bdea8e6e5f457dc4ca69ee345fbe4b8/modules/PatternUtils.js#L84).\r\n\r\n![screen shot 2016-03-21 at 10 40 01 am](https://cloud.githubusercontent.com/assets/71047/13928050/791ad62c-ef51-11e5-944f-933297151783.png)\r\n\r\nMy blog has roughly ~100 routes. Clicking around, some routes load near instantly and other take longer. When I added some console.logs, it turns out the `matchPattern` function is called for every route until there's a match. So if the route is near the top of the routes list, it's matched very quickly but if near the bottom, not so quickly. Surrounding the function with console.time, the function takes ~15ms of time each time it's called on my Macbook Pro ~2015 machine in Chrome.\r\n\r\nGiven 15ms execution per route, even with as little as 7 routes, users can start seeing delays of over 100ms which according to [Google's RAIL Performance Model](https://developers.google.com/web/tools/chrome-devtools/profile/evaluate-performance/rail?hl=en) is the point at which users start noticing system delays.\r\n\r\n## Version\r\n2.0.2\r\n\r\n## Steps to reproduce\r\n1. Install Gatsby `npm install -g gatsby`\r\n2. Run my blog locally — `gatsby new perf-blog-test https://github.com/kyleamathews/blog; cd perf-blog; gatsby develop`\r\n3. Open localhost:8000 and compare latency clicking on different posts.\r\n4. Compare this with http://bricolage.io which is still running react-router 0.13 where all path matching feels instant.\r\n \r\n## Expected Behavior\r\nPath matching takes less than 100ms\r\n\r\n## Actual Behavior\r\nPath matching can take longer than 1000ms."}}