Performance concerns: Sidebar adds significant cost on mobile (Lighthouse slow 4G)

[Yazan-Ali9]

Hi,

I’ve been testing applications that use the ShadCN UI sidebar component and noticed a performance issue that shows up in Lighthouse reports under mobile conditions (using the recommended settings: slow 4G, 4x CPU slowdown).

On my tests, the sidebar alone seems to add ~300ms to the Lighthouse results. This feels quite heavy for a single UI component, especially when aiming for good performance on constrained devices.

I wanted to start a discussion around this:

• Is this expected behavior?
  Are there specific design or architectural choices in the sidebar that naturally make it heavy (e.g., animations, nested components, DOM complexity)?

• Is there room for optimization?
  Could parts of the sidebar (like rendering, state management, or animation) be simplified or lazy-loaded to reduce the cost on initial load?

• Has anyone else measured similar results?
  I’d be very interested if others could share their Lighthouse scores or real-world metrics with/without the sidebar.

This is not meant as criticism but rather to better understand the tradeoffs. The sidebar is a very useful component, but if it consistently causes a measurable hit in performance budgets, we might want to explore possible improvements or alternative patterns.

Thanks in advance for your insights!