mirror of
https://github.com/RayLabsHQ/gitea-mirror.git
synced 2026-10-30 22:21:58 +01:00
Arunavo Ray
1ba20d7c47
The Spline scene kept the GPU at about 45% on an M1 Pro for the whole visit, even after scrolling past the hero, and phones downloaded and ran it for a hidden canvas. - Load Spline only at md and up, after the page loads, and not at all with reduced motion - Pause the scene and the shader while the hero is off screen - Render Spline at 1.5x instead of the device ratio and the shader at half resolution - Size the static logo to match the 3D mascot so the swap does not jump - Drop backdrop blurs on the feature cards and CTA that changed no visible pixels - Make the header scroll listener passive Measured on the built site: GPU use went from about 44% to 28% at the top and from 42% to 5% below the hero, and the phone page weight went from 1.19 MB to 0.33 MB.
Gitea Mirror Marketing Site
This Astro workspace powers the public marketing experience for Gitea Mirror. It includes the landing page, screenshots, call-to-action components, and the new use case library that highlights real-world workflows.
Developing Locally
pnpm install
pnpm dev
The site is available at http://localhost:4321. Tailwind CSS v4 handles styling; classes can be used directly inside Astro, MDX, and React components.
Project Structure
src/pages/index.astro– Main landing pagesrc/components/– Reusable UI (Header, Hero, Features, UseCases, etc.)src/lib/use-cases.ts– Central data source for use case titles, summaries, and tagssrc/pages/use-cases/– MDX guides for each use case, rendered withUseCaseLayoutsrc/layouts/UseCaseLayout.astro– Shared layout that injects the header, shader background, and footer into MDX guides
Authoring Use Case Guides
- Add or update a record in
src/lib/use-cases.ts. This keeps the landing page and library listing in sync. - Create a new MDX file in
src/pages/use-cases/<slug>.mdxwith theUseCaseLayoutlayout and descriptive frontmatter. - Run
pnpm devto preview the layout and ensure the new guide inherits global styles.
Deployment
The marketing site is built with the standard Astro pipeline. Use pnpm build to generate a production build before deploying.