When it comes to using assets in the DOM, generally, all you need to know is that the element is for picking different assets based on format compatibility and the attributes srcset and sizes are for picking different assets based on the screen. If you're using React, Next.js have an awesome image component which does a bunch of work out of the box for you like:Įven if you're not using React, it'd be worth checking out their source to see how they pull that off in JS here. We use Imgix in production for a site that sees around 500k visitors a day but I'm sure services like it do just as well. Alternatively you can link it to an S3 bucket. Super easy to setup over the top of an existing site too since they have a web folder option which means you can leverage an existing image host. Aside from requesting a specific size and applying transforms in the URL parameters you can also use format=auto which will check the browser's user agent and deliver a compatible, optimized format. There are services like imgix out there which are pretty cost effective and take a lot of the effort out of images.
0 kommentar(er)
