Improve build time

Problem

Build times increased from ~2 mins to ~30 mins.

Solution

Investigating the root cause...

• Commenting out createPages in gatsby-node.js reduces build times from ~30 mins to ~2 mins
• Commenting out most of icon-page.js reduces build times from ~30 mins to ~2 mins. What part of icon-page.js is slowing down builds? I wonder if it's related to styled-components.
• Uncommenting a few components in icon-page.js increased the build time from ~2 mins to >6 mins (still running). Why does icon-page.js take so long to build in this repo but not in primer/octicons?
• Differences between primer/design and primer/octicons:
  • react version (design: v17, octicons: v16)
  • @primer/react version (design: v35, octicons: v30)
  • gatsby version (design: v3, octicons: v2)
  • Number of nav items
• Rendering the Sidebar component in icon-page.js increased build times from ~3 mins to 38 mins. What's causing Sidebar to take so long to render?
• Rendering Sidebar without NavItems fixed the build time. What's causing NavItems to take so long to render?
• Rendering NavItems with an empty array instead of the contents of nav.yml doesn't spike build times. Are the contents of nav.yml too big?
• Rendering about half the amount of nav items, reduces the long build time by about half. This seems like the root cause of the long build times, but I'm unsure how to fix it.
• Not rendering a NavList inside the NavItems component fixes the build time. Could it be a styled-components issue?
• NavList.Items inside NavList.SubNav seem to be causing the issue https://github.com/primer/design/pull/390/commits/deb384f28bdbf4e371dc67160ffe60923ccfe2a3