Static Asset Handling

This project uses a tailored strategy for managing static assets. While most assets are simple version controlled files, CSS undergoes a transformation process to ensure high performance in production.

Asset Organization

All static files are organized under the `public/assets/` directory and categorized by type. This conventional structure simplifies development, improves maintainability, and prevents file path conflicts as the site grows.

public/
└── assets/
    ├── css/      (production build output)
    ├── img/      (optimized images)
    └── js/       (modular vanilla JS)

Asset Pipelines

Each type of asset is handled differently based on its role and optimization needs.

CSS (Processed)

The site's styling is sourced from Tailwind CSS utility classes. The CI/CD pipeline processes a source file to generate a single, minified `style.css` file that is deployed. This build artifact contains only the styles used on the site, ensuring a minimal footprint.

JavaScript (Static)

All JavaScript is handwritten, modular, and framework-free. These scripts are committed directly to the repository and deployed without a bundling or minification step. This approach preserves readability while keeping the payload small.

Images & Fonts (Static)

Images are manually optimized for the web before being committed to the repository. Like JavaScript, images and any self hosted fonts are treated as immutable static assets that are version controlled and deployed as they are.

Global Delivery Network

Ultimately, all assets, whether processed by the build pipeline or handled statically, are uploaded to the AWS S3 origin bucket. From there, Amazon CloudFront distributes and caches the files across its global network of edge locations. This ensures that users worldwide experience fast load times, as they are served assets from a server geographically close to them.