Hosting Hugo Website with a Lot of Media

I’ve explored how to store high-volume (images and videos) website with Hugo. I’m going to use some CDN-like solution.

Web Links

• Large - really large Hugo sites. 10GB of images
• Repository storage for Large Hugo site
• Worries about developing news site with thousands of pages and heavy media usage
• Best Practices: Assets with Content

Own CDN

• Self-hosted CDN
  • Nginx maybe? http://idiallo.com/blog/creating-your-own-cdn-with-nginx
  • How about apache traffic server. Thatll do your caching and whatever. http://trafficserver.apache.org/

Possible Solutions

1. Amazon Cloud Front: Securely deliver content with low latency and high transfer speeds

   • Amazon CloudFront
   • Amazon CloudFront pricing

   Web service to distribute content to end users with low latency and high transfer speeds.

   • 1 TB of data transfer out to the internet per month
   • 10,000,000 HTTP or HTTPS Requests per month
   • 2,000,000 CloudFront Function invocations per month
   • 2,000,000 CloudFront KeyValueStore reads per month

   I think, for me it’s only the 10M requests per month, which is roughly 1/3M requests a day, which is 300K requests a day. Sounds like a lot. I think, I may start with Walter’s website first.

2. Cloudinary offers 25 GB of storage.

   I’ve had this same issue, but I had a client with 30GB of images in their site. I chose to set their Hugo site up with Forestry.io which also has a free an integration with Cloudinary.
   I actually ran a web image optimizer which reduced the 30GB of images to 15GB. Then I uploaded all of the optimized images to Cloudinary for storage. The made the GIT repo small and fast again.
   Also, Cloudinary has amazing image optimizations through “transforms.” Setting this up greatly improve page loading speed as well.
   Furthermore, it’s been my experience that clients don’t know how to optimize their images for the web. Thus, they keep uploading 5MB images for a profile thumbnail. Cloudinary is great for this because it will allow them to upload that 5MB image, however, through setting up transforms, I can have Cloudinary transform that image to 80kb to display in the site. So it’s a win-win. Cloudinary can store the large file, yet serve an optimized image on the fly.

   I think Smashing Magazine use Cloudinary,com for their images?
   Edit: Yes they do. See https://www.smashingmagazine.com/2017/03/a-little-surprise-is-waiting-for-you-here/

3. Others

   • Cloudflare Images, S3, R2

4. Someone suggested to use Google Photos

   I have faced a similar issue. Wherever I want to store such a large site with tones of images, the options are really limited.
   I end up making a different approach when I created www.paraplan.com.pl 29.
   It may not be a solution for you, but there are some. I host all images in albums on Google Photo. Album shared as public and links to images generated using PublicAlbum.org solution.
   The whole site goes down to just 500MB where all GBs of images are on Google Photos. Suitable solution for this site but may not be best for all.

5. Announcing the Cloudflare Images Sourcing Kit

6. Imgix has 1,000 Origin Images and 100 GB Bandwidth in their free tier.