Why?

Vite already supports environment variables. These environment variables are statically replaced during build time. This works well for simple use cases, but what if we have a complicated setup where some functionality needs to be configured at the time of deployment(long after we build the app for production)?

I recently came across one such use case where I had to figure out a way to provide a configuration variable to an SPA built with Vite deployed via Docker/nginx when the container starts.

Running a large CloudFront distribution can be costly if the assets aren’t optimized. Additional users might see blank placeholders everywhere while images are loading and increased data usage. In the developing market having most users on mobile devices using mobile data, this can be a deal-breaker.

There are several ways this problem can be approached.

1. Convert images to needed sizes immediately after they are uploaded.
2. Convert images as they are requested on the fly thanks to Lambda@Edge.

Option 2 seems more efficient and more convenient as there are no changes required on your application back-end and no need to worry about scaling problems.