performance: responsive image loading

[cdaringe]

Per #519, the hero image is very large (1.2MB ish). Instead of serving a giant hero image, instead:

• host various images sizes for the same intent
• serve a device/viewport aware image to the user
• scale the 1.25Mb image down to (30,40,50KB) responsive images for users

less data, faster loading, happy users

Uncompressed demo of changing the viewport and watching new responsive images downloaded at (<600px first load, 600px - 799px, and 800px+). DPR of 2x assumed

https://user-images.githubusercontent.com/1003261/146657148-495560bd-94d3-4029-be02-0f6eb12f7ec8.mov

Modified relative paths:

https://v3-ocaml-org-git-BRANCH_NAME-ocaml.vercel.app/PATH/TO/PAGE

https://v3-ocaml-org-git-fork-cdaringe-fix-caml-img-ocaml.vercel.app

Contributor Pre-flight Checklist

• [ ] Accessibility check - checked pa11y report for modified pages, observing new errors
• [ ] Responsive check - visually inspected vercel preview, using responsive tool to toggle between desktop and mobile view
• [ ] HTML review - use browser DOM/Page inspector to inspect generated HTML within <div id="__next>" element