Fix reference sidebar flash by server-rendering directory

[rakesh2OO5]

Fixes #477

Summary

Server-renders the reference directory to prevent the initial sidebar flash and layout shift caused by client-only hydration.

Changes

• Added a server-rendered Astro component for the reference directory
• Kept client-side filtering as a progressive enhancement
• Updated ReferenceLayout to render the directory during SSR

Result

• Sidebar appears immediately on load
• No visible flash or layout jump
• Filtering behavior remains unchanged

[stalgiag]

Thanks! I will try to review this some time in the next month. If any other reviewers gets here first, please by all means feel free to review ahead of me.

[coseeian]

I pulled the changes to test them locally, but I noticed some unexpected UX on the page, and it seems like we’re still seeing the flash in the original nav (screenshot below).

Screen.Recording.2026-01-20.at.06.20.01.mov

It looks like the 'flashing' persists because the issue might be rooted deeper in how the global NavPanels component handles initial resizing on the client side (the desktop isOpen state being false by default): https://github.com/processing/p5.js-website/blob/main/src/components/Nav/NavPanels.tsx

Since this affects every page and not just the Reference section, I think we might need to shift our focus to that core component to truly solve the flash issue described in #477.

[rakesh2OO5]

Thanks for the detailed investigation and for pointing me to NavPanels.tsx.
I’ve converted this PR to draft while I rework the fix to address the root hydration mismatch in the global nav rather than just the reference directory.
I’ll mark it ready for review once the revised approach is pushed.